Client-Side Routing not working with Heroku - React Rails Application

Question

I have created an application using React and Ruby on Rails. I deployed my app to Heroku. When running locally, I client-side routing works, but when on the Heroku deployment, I get error 404 when routing directing or refreshing the page. I tried creating a static.json file like this:

{
  "root": "build/",
  "clean_urls": false,
  "routes": {
    "/**": "index.html"
  }
}

But no luck. Does anyone have any ideas? I am using React-Router_dom 5.3.3 and my routes look like this right now:

App.js

      return (
    <>
      <Header>
        <NavBar user={user} setUser={setUser} />
      </Header>
      <Content>
        <Switch>
          <Route exact path="/">
            <TicketPage user={user} />
          </Route>
          <Route path="/user">
            <UserPage user={user} />
          </Route>
          <Route path="/mytickets">
            <MyTickets user={user} />
          </Route>
        </Switch>
      </Content>
    </>
  );
}

index.js

import React from "react";
import ReactDOM from "react-dom";
import { BrowserRouter } from "react-router-dom";
import App from "./App";

ReactDOM.render(
  <BrowserRouter>
    <App />
  </BrowserRouter>,
  document.getElementById("root")
);

Thank you!