Merge branch 'livekit' into toger5/track-processor-blur

src/App.tsx

@@ -6,14 +6,8 @@ Please see LICENSE in the repository root for full details.
 */
 
 import { type FC, Suspense, useEffect, useState } from "react";
-import {
-  BrowserRouter as Router,
-  Switch,
-  Route,
-  useLocation,
-} from "react-router-dom";
+import { BrowserRouter, Route, useLocation, Routes } from "react-router-dom";
 import * as Sentry from "@sentry/react";
-import { type History } from "history";
 import { TooltipProvider } from "@vector-im/compound-web";
 import { logger } from "matrix-js-sdk/src/logger";
 
@@ -30,7 +24,7 @@ import { widget } from "./widget";
 import { useTheme } from "./useTheme";
 import { ProcessorProvider } from "./livekit/TrackProcessorContext";
 
-const SentryRoute = Sentry.withSentryRouting(Route);
+const SentryRoute = Sentry.withSentryReactRouterV6Routing(Route);
 
 interface SimpleProviderProps {
   children: JSX.Element;
@@ -56,11 +50,7 @@ const ThemeProvider: FC<SimpleProviderProps> = ({ children }) => {
   return children;
 };
 
-interface AppProps {
-  history: History;
-}
-
-export const App: FC<AppProps> = ({ history }) => {
+export const App: FC = () => {
   const [loaded, setLoaded] = useState(false);
   useEffect(() => {
     Initializer.init()
@@ -77,7 +67,7 @@ export const App: FC<AppProps> = ({ history }) => {
   return (
     // eslint-disable-next-line @typescript-eslint/ban-ts-comment
     // @ts-ignore
-    <Router history={history}>
+    <BrowserRouter>
       <BackgroundProvider>
         <ThemeProvider>
           <TooltipProvider>
@@ -86,20 +76,15 @@ export const App: FC<AppProps> = ({ history }) => {
                 <Providers>
                   <Sentry.ErrorBoundary fallback={errorPage}>
                     <DisconnectedBanner />
-                    <Switch>
-                      <SentryRoute exact path="/">
-                        <HomePage />
-                      </SentryRoute>
-                      <SentryRoute exact path="/login">
-                        <LoginPage />
-                      </SentryRoute>
-                      <SentryRoute exact path="/register">
-                        <RegisterPage />
-                      </SentryRoute>
-                      <SentryRoute path="*">
-                        <RoomPage />
-                      </SentryRoute>
-                    </Switch>
+                    <Routes>
+                      <SentryRoute path="/" element={<HomePage />} />
+                      <SentryRoute path="/login" element={<LoginPage />} />
+                      <SentryRoute
+                        path="/register"
+                        element={<RegisterPage />}
+                      />
+                      <SentryRoute path="*" element={<RoomPage />} />
+                    </Routes>
                   </Sentry.ErrorBoundary>
                 </Providers>
               </Suspense>
@@ -109,7 +94,7 @@ export const App: FC<AppProps> = ({ history }) => {
           </TooltipProvider>
         </ThemeProvider>
       </BackgroundProvider>
-    </Router>
+    </BrowserRouter>
   );
 };