upgrade router

Signed-off-by: ryjiang <jiangruiyi@gmail.com>

client/package.json

@@ -25,7 +25,7 @@
     "react-dom": "^18.2.0",
     "react-highlight-words": "^0.17.0",
     "react-i18next": "^13.5.0",
-    "react-router-dom": "^6.14.2",
+    "react-router-dom": "^6.20.0",
     "react-syntax-highlighter": "^15.5.0",
     "socket.io-client": "^4.7.1",
     "vite": "5.0.2",

client/src/router/Router.tsx

@@ -1,4 +1,4 @@
-import { createHashRouter, RouterProvider } from 'react-router-dom';
+import { HashRouter as Router, Routes, Route } from 'react-router-dom';
 import { useContext } from 'react';
 import { authContext } from '@/context';
 import Collection from '@/pages/collections/Collection';
@@ -11,54 +11,30 @@ import Search from '@/pages/search/VectorSearch';
 import System from '@/pages/system/SystemView';
 import SystemHealthy from '@/pages/systemHealthy/SystemHealthyView';
 
-const routeObj = [
-  {
-    path: '/',
-    element: <Index />,
-    children: [
-      {
-        path: '/databases',
-        element: <Database />,
-      },
-      {
-        path: '/collections',
-        element: <Collections />,
-      },
-      {
-        path: '/collections/:collectionName',
-        element: <Collection />,
-      },
-      {
-        path: '/search',
-        element: <Search />,
-      },
-      {
-        path: '/system_healthy',
-        element: <SystemHealthy />,
-      },
-    ],
-  },
-  { path: '/connect', element: <Connect /> },
-];
-
-const Router = () => {
+const RouterComponent = () => {
   const { isManaged } = useContext(authContext);
 
-  if (!isManaged) {
-    routeObj[0].children?.push(
-      {
-        path: '/users',
-        element: <Users />,
-      },
-      {
-        path: '/system',
-        element: <System />,
-      }
-    );
-  }
-
-  const router = createHashRouter(routeObj);
-
-  return <RouterProvider router={router}></RouterProvider>;
+  return (
+    <Router>
+      <Routes>
+        <Route path="/" element={<Index />}>
+          <Route index element={<Database />} />
+          <Route path="databases" element={<Database />} />
+          <Route path="collections" element={<Collections />} />
+          <Route path="collections/:collectionName" element={<Collection />} />
+          <Route path="search" element={<Search />} />
+          <Route path="system_healthy" element={<SystemHealthy />} />
+          {!isManaged && (
+            <>
+              <Route path="users" element={<Users />} />
+              <Route path="system" element={<System />} />
+            </>
+          )}
+        </Route>
+        <Route path="connect" element={<Connect />} />
+      </Routes>
+    </Router>
+  );
 };
-export default Router;
+
+export default RouterComponent;

package.json

@@ -11,5 +11,8 @@
       "{name: 'beta', prerelease: true}"
     ]
   },
-  "private": true
-}
+  "private": true,
+  "dependencies": {
+    "react-router-dom": "^6.20.0"
+  }
+}

yarn.lock

@@ -2,3 +2,22 @@
 # yarn lockfile v1
 
 
+"@remix-run/router@1.13.0":
+  version "1.13.0"
+  resolved "https://registry.yarnpkg.com/@remix-run/router/-/router-1.13.0.tgz#7e29c4ee85176d9c08cb0f4456bff74d092c5065"
+  integrity sha512-5dMOnVnefRsl4uRnAdoWjtVTdh8e6aZqgM4puy9nmEADH72ck+uXwzpJLEKE9Q6F8ZljNewLgmTfkxUrBdv4WA==
+
+react-router-dom@^6.20.0:
+  version "6.20.0"
+  resolved "https://registry.yarnpkg.com/react-router-dom/-/react-router-dom-6.20.0.tgz#7b9527a1e29c7fb90736a5f89d54ca01f40e264b"
+  integrity sha512-CbcKjEyiSVpA6UtCHOIYLUYn/UJfwzp55va4yEfpk7JBN3GPqWfHrdLkAvNCcpXr8QoihcDMuk0dzWZxtlB/mQ==
+  dependencies:
+    "@remix-run/router" "1.13.0"
+    react-router "6.20.0"
+
+react-router@6.20.0:
+  version "6.20.0"
+  resolved "https://registry.yarnpkg.com/react-router/-/react-router-6.20.0.tgz#4275a3567ecc55f7703073158048db10096bb539"
+  integrity sha512-pVvzsSsgUxxtuNfTHC4IxjATs10UaAtvLGVSA1tbUE4GDaOSU1Esu2xF5nWLz7KPiMuW8BJWuPFdlGYJ7/rW0w==
+  dependencies:
+    "@remix-run/router" "1.13.0"