DataTrailsApp: Update to react-router v6 (#94447)

* DataTrailsApp: Update router

* Update route

public/app/features/trails/DataTrailsApp.tsx

@@ -1,5 +1,5 @@
 import { useEffect, useState } from 'react';
-import { Route, Switch } from 'react-router-dom';
+import { Routes, Route } from 'react-router-dom-v5-compat';
 
 import { PageLayoutType } from '@grafana/data';
 import { locationService } from '@grafana/runtime';
@@ -32,11 +32,11 @@ export class DataTrailsApp extends SceneObjectBase<DataTrailsAppState> {
     const { trail, home } = model.useState();
 
     return (
-      <Switch>
+      <Routes>
+        {/* The routes are relative to the HOME_ROUTE */}
         <Route
-          exact={true}
-          path={HOME_ROUTE}
-          render={() => (
+          path={'/'}
+          element={
             <Page
               navId="explore/metrics"
               layout={PageLayoutType.Standard}
@@ -45,10 +45,10 @@ export class DataTrailsApp extends SceneObjectBase<DataTrailsAppState> {
             >
               <home.Component model={home} />
             </Page>
-          )}
+          }
         />
-        <Route exact={true} path={TRAILS_ROUTE} render={() => <DataTrailView trail={trail} />} />
-      </Switch>
+        <Route path={TRAILS_ROUTE.replace(HOME_ROUTE, '')} element={<DataTrailView trail={trail} />} />
+      </Routes>
     );
   };
 }