feat: upgrade react router to v6

openedx · Mar 17, 2023 · 79aa9cc · 79aa9cc
1 parent ab80fd7
commit 79aa9cc
Show file tree

Hide file tree

Showing 3 changed files with 64 additions and 38 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -30,7 +30,7 @@
     "@edx/brand": "npm:@edx/brand-openedx@1.2.0",
     "@edx/frontend-component-footer": "11.6.3",
     "@edx/frontend-component-header": "3.6.4",
-    "@edx/frontend-platform": "3.3.1",
+    "@edx/frontend-platform": "^3.6.0",
     "@edx/paragon": "^20.20.0",
     "@fortawesome/fontawesome-svg-core": "1.2.36",
     "@fortawesome/free-brands-svg-icons": "5.15.4",
@@ -51,7 +51,7 @@
     "react-instantsearch-hooks-web": "^6.40.1",
     "react-redux": "7.2.9",
     "react-router": "5.3.4",
-    "react-router-dom": "5.3.4",
+    "react-router-dom": "^6.0.0",
     "redux": "4.2.1",
     "redux-devtools-extension": "2.13.9",
     "redux-logger": "3.0.6",

diff --git a/src/index.jsx b/src/index.jsx
@@ -16,7 +16,7 @@ import {
 
 import React from 'react';
 import ReactDOM from 'react-dom';
-import { Route, Switch } from 'react-router-dom';
+import { Route, Routes } from 'react-router-dom';
 
 import Header, { messages as headerMessages } from '@edx/frontend-component-header';
 import Footer, { messages as footerMessages } from '@edx/frontend-component-footer';
@@ -35,14 +35,14 @@ subscribe(APP_READY, () => {
       <Head />
       <Header />
       <main>
-        <Switch>
+        <Routes>
           {getConfig().ENABLE_SKILLS_BUILDER && (
-            <Route path="/skills" component={SkillsBuilder} />
+            <Route path="/skills" element={<SkillsBuilder />} />
           )}
-          <Route path="/u/:username" component={ProfilePage} />
-          <Route path="/notfound" component={NotFoundPage} />
-          <Route path="*" component={NotFoundPage} />
-        </Switch>
+          <Route path="/u/:username" element={<ProfilePage />} />
+          <Route path="/notfound" element={<NotFoundPage />} />
+          <Route path="*" element={<NotFoundPage />} />
+        </Routes>
       </main>
       <Footer />
     </AppProvider>,