Merge pull request #858 from L4Ph/react-router-v7

React router v7

package.json

@@ -27,7 +27,7 @@
     "react-helmet-async": "^2.0.5",
     "react-image-gallery": "^1.3.0",
     "react-redux": "^9.1.2",
-    "react-router-dom": "^6.2.1",
+    "react-router": "^7.0.1",
     "redux": "^4.0.5",
     "redux-devtools-extension": "^2.13.8",
     "redux-thunk": "^2.3.0",
@@ -87,7 +87,6 @@
     "@types/react": "^18.3.3",
     "@types/react-dom": "^18.3.0",
     "@types/react-image-gallery": "^1.2.4",
-    "@types/react-router-dom": "^5.1.6",
     "@types/sinon": "^10.0.2",
     "@types/w3c-web-hid": "^1.0.1",
     "@types/w3c-web-serial": "^1.0.2",

src/App.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { SnackbarProvider } from 'notistack';
 // import './App.css';
-import { BrowserRouter, Navigate, Route, Routes } from 'react-router-dom';
+import { BrowserRouter, Navigate, Route, Routes } from 'react-router';
 import Configure from './components/configure/Configure.container';
 import Hid from './services/hid/ui/Hid';
 import Top from './components/top/Top.container';

src/components/catalog/Catalog.tsx

@@ -12,7 +12,7 @@ import { CatalogActionsType, CatalogStateType } from './Catalog.container';
 import { NotificationItem } from '../../actions/actions';
 import CloseIcon from '@mui/icons-material/Close';
 import * as qs from 'qs';
-import { useLocation, useParams } from 'react-router-dom';
+import { useLocation, useParams } from 'react-router';
 
 type ICatalogDetailMode = 'introduction' | 'keymap' | 'firmware' | 'build';
 

src/components/catalog/content/Content.tsx

@@ -13,7 +13,7 @@ import {
 } from '../../../services/storage/Storage';
 import { sendEventToGoogleAnalytics } from '../../../utils/GoogleAnalytics';
 import TweetButton from '../../common/twitter/TweetButton';
-import { useNavigate } from 'react-router-dom';
+import { useNavigate } from 'react-router';
 
 type ContentState = {};
 type OwnProps = {};

src/components/catalog/keyboard/CatalogKeyboard.tsx

@@ -8,7 +8,7 @@ import CatalogIntroduction from './introduction/CatalogIntroduction.container';
 import CatalogKeymap from './keymap/CatalogKeymap.container';
 import CatalogFirmware from './firmware/CatalogFirmware.container';
 import useLocationChange from '../../common/hooks/LocationChange';
-import { matchPath, useNavigationType } from 'react-router-dom';
+import { matchPath, useNavigationType } from 'react-router';
 import qs from 'qs';
 import CatalogBuild from './build/CatalogBuild.container';
 

src/components/catalog/keyboard/keymap/Catalogkeymap.tsx

@@ -18,7 +18,7 @@ import { genKey, Key } from '../../../configure/keycodekey/KeyGen';
 import { KeymapPdfGenerator } from '../../../../services/pdf/KeymapPdfGenerator';
 import { sendEventToGoogleAnalytics } from '../../../../utils/GoogleAnalytics';
 import LayerPagination from '../../../common/layer/LayerPagination';
-import { useNavigate } from 'react-router-dom';
+import { useNavigate } from 'react-router';
 import { MOD_LEFT } from '../../../../services/hid/Constraints';
 
 type OwnProps = {};

src/components/common/hooks/LocationChange.ts

@@ -1,4 +1,4 @@
-import { Location, useLocation } from 'react-router-dom';
+import { Location, useLocation } from 'react-router';
 import { useEffect, useRef } from 'react';
 
 // eslint-disable-next-line no-unused-vars

src/components/documents/Documents.tsx

@@ -12,7 +12,7 @@ import ReviewPolicy from './reviewpolicy/ReviewPolicy';
 import TermsOfUse from './termsofuse/TermsOfUse';
 import Faq from './faq/Faq';
 import Index from './index/Index';
-import { useParams } from 'react-router-dom';
+import { useParams } from 'react-router';
 import SupportQmk022 from './support-qmk-022/SupportQmk022';
 import Encoders from './encoders/Encoders';
 import Build from './build/Build';

src/components/keyboards/KeyboardDefinitionManagement.tsx

@@ -15,7 +15,7 @@ import CloseIcon from '@mui/icons-material/Close';
 import Header from './header/Header.container';
 import Content from './content/Content.container';
 import { getGitHubProviderData } from '../../services/auth/Auth';
-import { useParams } from 'react-router-dom';
+import { useParams } from 'react-router';
 
 type ParamsType = {
   definitionId: string;

src/components/organizations/OrganizationManagement.tsx

@@ -15,7 +15,7 @@ import CloseIcon from '@mui/icons-material/Close';
 import { getGitHubProviderData } from '../../services/auth/Auth';
 import Header from './header/Header.container';
 import Content from './content/Content.container';
-import { useParams } from 'react-router-dom';
+import { useParams } from 'react-router';
 
 type ParamsType = {
   organizationId: string;

src/components/top/Top.tsx

@@ -15,7 +15,7 @@ import Footer from '../common/footer/Footer.container';
 import { Logo } from '../common/logo/Logo';
 import './Top.scss';
 import { TopActionsType, TopStateType } from './Top.container';
-import { useNavigate } from 'react-router-dom';
+import { useNavigate } from 'react-router';
 import {
   Alert,
   AppBar,

yarn.lock

@@ -3282,13 +3282,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@remix-run/router@npm:1.16.1":
-  version: 1.16.1
-  resolution: "@remix-run/router@npm:1.16.1"
-  checksum: 10c0/5f1b0aef4924830eeab9c86dcaa5af8157066e5de65b449e7fdf406532b2384828a46a447c31b0735fd713a06938dd88bfd4e566d9989be70c770457dda16c92
-  languageName: node
-  linkType: hard
-
 "@rollup/plugin-inject@npm:^5.0.5":
   version: 5.0.5
   resolution: "@rollup/plugin-inject@npm:5.0.5"
@@ -4867,6 +4860,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@types/cookie@npm:^0.6.0":
+  version: 0.6.0
+  resolution: "@types/cookie@npm:0.6.0"
+  checksum: 10c0/5b326bd0188120fb32c0be086b141b1481fec9941b76ad537f9110e10d61ee2636beac145463319c71e4be67a17e85b81ca9e13ceb6e3bb63b93d16824d6c149
+  languageName: node
+  linkType: hard
+
 "@types/downloadjs@npm:^1.4.2":
   version: 1.4.6
   resolution: "@types/downloadjs@npm:1.4.6"
@@ -4946,13 +4946,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@types/history@npm:^4.7.11":
-  version: 4.7.11
-  resolution: "@types/history@npm:4.7.11"
-  checksum: 10c0/3facf37c2493d1f92b2e93a22cac7ea70b06351c2ab9aaceaa3c56aa6099fb63516f6c4ec1616deb5c56b4093c026a043ea2d3373e6c0644d55710364d02c934
-  languageName: node
-  linkType: hard
-
 "@types/html-minifier-terser@npm:^5.0.0":
   version: 5.1.2
   resolution: "@types/html-minifier-terser@npm:5.1.2"
@@ -5138,27 +5131,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@types/react-router-dom@npm:^5.1.6":
-  version: 5.3.3
-  resolution: "@types/react-router-dom@npm:5.3.3"
-  dependencies:
-    "@types/history": "npm:^4.7.11"
-    "@types/react": "npm:*"
-    "@types/react-router": "npm:*"
-  checksum: 10c0/a9231a16afb9ed5142678147eafec9d48582809295754fb60946e29fcd3757a4c7a3180fa94b45763e4c7f6e3f02379e2fcb8dd986db479dcab40eff5fc62a91
-  languageName: node
-  linkType: hard
-
-"@types/react-router@npm:*":
-  version: 5.1.20
-  resolution: "@types/react-router@npm:5.1.20"
-  dependencies:
-    "@types/history": "npm:^4.7.11"
-    "@types/react": "npm:*"
-  checksum: 10c0/1f7eee61981d2f807fa01a34a0ef98ebc0774023832b6611a69c7f28fdff01de5a38cabf399f32e376bf8099dcb7afaf724775bea9d38870224492bea4cb5737
-  languageName: node
-  linkType: hard
-
 "@types/react-transition-group@npm:^4.4.10":
   version: 4.4.10
   resolution: "@types/react-transition-group@npm:4.4.10"
@@ -5919,7 +5891,6 @@ __metadata:
     "@types/react": "npm:^18.3.3"
     "@types/react-dom": "npm:^18.3.0"
     "@types/react-image-gallery": "npm:^1.2.4"
-    "@types/react-router-dom": "npm:^5.1.6"
     "@types/sinon": "npm:^10.0.2"
     "@types/w3c-web-hid": "npm:^1.0.1"
     "@types/w3c-web-serial": "npm:^1.0.2"
@@ -5957,7 +5928,7 @@ __metadata:
     react-helmet-async: "npm:^2.0.5"
     react-image-gallery: "npm:^1.3.0"
     react-redux: "npm:^9.1.2"
-    react-router-dom: "npm:^6.2.1"
+    react-router: "npm:^7.0.1"
     redux: "npm:^4.0.5"
     redux-devtools-extension: "npm:^2.13.8"
     redux-thunk: "npm:^2.3.0"
@@ -7973,6 +7944,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"cookie@npm:^1.0.1":
+  version: 1.0.2
+  resolution: "cookie@npm:1.0.2"
+  checksum: 10c0/fd25fe79e8fbcfcaf6aa61cd081c55d144eeeba755206c058682257cb38c4bd6795c6620de3f064c740695bb65b7949ebb1db7a95e4636efb8357a335ad3f54b
+  languageName: node
+  linkType: hard
+
 "copy-concurrently@npm:^1.0.0":
   version: 1.0.5
   resolution: "copy-concurrently@npm:1.0.5"
@@ -15321,27 +15299,21 @@ __metadata:
   languageName: node
   linkType: hard
 
-"react-router-dom@npm:^6.2.1":
-  version: 6.23.1
-  resolution: "react-router-dom@npm:6.23.1"
-  dependencies:
-    "@remix-run/router": "npm:1.16.1"
-    react-router: "npm:6.23.1"
-  peerDependencies:
-    react: ">=16.8"
-    react-dom: ">=16.8"
-  checksum: 10c0/01b954d7d0ff4c53bb2edbc816458f3fad1ce9ee49a4dfdc5c866065c23026c9cce429b46b754cbaebb83b22cfe5f605bbf441acf515e3c377cbdf021b0bec4c
-  languageName: node
-  linkType: hard
-
-"react-router@npm:6.23.1":
-  version: 6.23.1
-  resolution: "react-router@npm:6.23.1"
+"react-router@npm:^7.0.1":
+  version: 7.0.1
+  resolution: "react-router@npm:7.0.1"
   dependencies:
-    "@remix-run/router": "npm:1.16.1"
+    "@types/cookie": "npm:^0.6.0"
+    cookie: "npm:^1.0.1"
+    set-cookie-parser: "npm:^2.6.0"
+    turbo-stream: "npm:2.4.0"
   peerDependencies:
-    react: ">=16.8"
-  checksum: 10c0/091949805745136350ab049b2a96281bf38742c9d3651019fb48ea79c5eafbfb0379f1d3e636602dd56b0ef278389e8fd25be983dc2c0ffd1103d06dfa8019f3
+    react: ">=18"
+    react-dom: ">=18"
+  peerDependenciesMeta:
+    react-dom:
+      optional: true
+  checksum: 10c0/aac4c9989ae6b9cf989b5ddcda88f505ba0704a4e4b37ae04c819c2bd02f080361f9eb1793695e3ecf41080d91b79aee454c3163b586d1b19ceca13f6eacec0e
   languageName: node
   linkType: hard
 
@@ -16268,6 +16240,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"set-cookie-parser@npm:^2.6.0":
+  version: 2.7.1
+  resolution: "set-cookie-parser@npm:2.7.1"
+  checksum: 10c0/060c198c4c92547ac15988256f445eae523f57f2ceefeccf52d30d75dedf6bff22b9c26f756bd44e8e560d44ff4ab2130b178bd2e52ef5571bf7be3bd7632d9a
+  languageName: node
+  linkType: hard
+
 "set-function-length@npm:^1.2.1":
   version: 1.2.2
   resolution: "set-function-length@npm:1.2.2"
@@ -17547,6 +17526,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"turbo-stream@npm:2.4.0":
+  version: 2.4.0
+  resolution: "turbo-stream@npm:2.4.0"
+  checksum: 10c0/e68b2569f1f16e6e9633d090c6024b2ae9f0e97bfeacb572451ca3732e120ebbb546f3bc4afc717c46cb57b5aea6104e04ef497f9912eef6a7641e809518e98a
+  languageName: node
+  linkType: hard
+
 "type-check@npm:^0.4.0, type-check@npm:~0.4.0":
   version: 0.4.0
   resolution: "type-check@npm:0.4.0"