From 39c972eeea4b4bae0dd91d469f78a637e4e2ee96 Mon Sep 17 00:00:00 2001 From: Ivan <8611739+IRBorisov@users.noreply.github.com> Date: Mon, 25 Nov 2024 19:52:57 +0300 Subject: [PATCH] R: Upgrade to react-router v7 --- README.md | 2 +- rsconcept/frontend/package-lock.json | 24 ++++--------------- rsconcept/frontend/package.json | 2 +- .../frontend/src/app/ApplicationLayout.tsx | 2 +- rsconcept/frontend/src/app/Router.tsx | 2 +- rsconcept/frontend/src/app/index.tsx | 2 +- .../frontend/src/components/ui/TextURL.tsx | 2 +- .../src/context/NavigationContext.tsx | 10 ++++---- .../frontend/src/hooks/useQueryStrings.ts | 2 +- .../frontend/src/pages/OssPage/OssPage.tsx | 2 +- .../src/pages/RSFormPage/RSFormPage.tsx | 2 +- rsconcept/frontend/vite.config.ts | 2 +- 12 files changed, 19 insertions(+), 35 deletions(-) diff --git a/README.md b/README.md index d8647431..67920ca8 100644 --- a/README.md +++ b/README.md @@ -31,7 +31,7 @@ This readme file is used mostly to document project dependencies and conventions - axios - clsx - react-icons - - react-router-dom + - react-router - react-toastify - react-loader-spinner - react-tabs diff --git a/rsconcept/frontend/package-lock.json b/rsconcept/frontend/package-lock.json index 2fe4e1f6..ca05c0c7 100644 --- a/rsconcept/frontend/package-lock.json +++ b/rsconcept/frontend/package-lock.json @@ -25,7 +25,7 @@ "react-icons": "^5.3.0", "react-intl": "^7.0.1", "react-loader-spinner": "^6.1.6", - "react-router-dom": "^7.0.0", + "react-router": "^7.0.1", "react-select": "^5.8.3", "react-tabs": "^6.0.2", "react-toastify": "^10.0.6", @@ -9268,9 +9268,9 @@ } }, "node_modules/react-router": { - "version": "7.0.0", - "resolved": "https://registry.npmjs.org/react-router/-/react-router-7.0.0.tgz", - "integrity": "sha512-1xf+yMVhUjAzZGY90ZnYJ9KVe1R8FggpugzRBkh+p6vl4cC1sHDe3nO+r5rxWTAgCMf8uN5hfoV2M7rLVTWPUA==", + "version": "7.0.1", + "resolved": "https://registry.npmjs.org/react-router/-/react-router-7.0.1.tgz", + "integrity": "sha512-WVAhv9oWCNsja5AkK6KLpXJDSJCQizOIyOd4vvB/+eHGbYx5vkhcmcmwWjQ9yqkRClogi+xjEg9fNEOd5EX/tw==", "license": "MIT", "dependencies": { "@types/cookie": "^0.6.0", @@ -9291,22 +9291,6 @@ } } }, - "node_modules/react-router-dom": { - "version": "7.0.0", - "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-7.0.0.tgz", - "integrity": "sha512-2QAxXpwgQuh423C64oZiV2cCKPCNUgZxcvZaS8O0PAHPZ/z8kTq7YbGD4KTNZm6Yj66d+HAfGkWPp8MCpdtD+Q==", - "license": "MIT", - "dependencies": { - "react-router": "7.0.0" - }, - "engines": { - "node": ">=20.0.0" - }, - "peerDependencies": { - "react": ">=18", - "react-dom": ">=18" - } - }, "node_modules/react-select": { "version": "5.8.3", "resolved": "https://registry.npmjs.org/react-select/-/react-select-5.8.3.tgz", diff --git a/rsconcept/frontend/package.json b/rsconcept/frontend/package.json index 6518811e..3dcbf258 100644 --- a/rsconcept/frontend/package.json +++ b/rsconcept/frontend/package.json @@ -29,7 +29,7 @@ "react-icons": "^5.3.0", "react-intl": "^7.0.1", "react-loader-spinner": "^6.1.6", - "react-router-dom": "^7.0.0", + "react-router": "^7.0.1", "react-select": "^5.8.3", "react-tabs": "^6.0.2", "react-toastify": "^10.0.6", diff --git a/rsconcept/frontend/src/app/ApplicationLayout.tsx b/rsconcept/frontend/src/app/ApplicationLayout.tsx index 3d520e9b..d9744314 100644 --- a/rsconcept/frontend/src/app/ApplicationLayout.tsx +++ b/rsconcept/frontend/src/app/ApplicationLayout.tsx @@ -1,4 +1,4 @@ -import { Outlet } from 'react-router-dom'; +import { Outlet } from 'react-router'; import ConceptToaster from '@/app/ConceptToaster'; import Footer from '@/app/Footer'; diff --git a/rsconcept/frontend/src/app/Router.tsx b/rsconcept/frontend/src/app/Router.tsx index fc9d93ea..0518b7c0 100644 --- a/rsconcept/frontend/src/app/Router.tsx +++ b/rsconcept/frontend/src/app/Router.tsx @@ -1,4 +1,4 @@ -import { createBrowserRouter } from 'react-router-dom'; +import { createBrowserRouter } from 'react-router'; import CreateItemPage from '@/pages/CreateItemPage'; import DatabaseSchemaPage from '@/pages/DatabaseSchemaPage'; diff --git a/rsconcept/frontend/src/app/index.tsx b/rsconcept/frontend/src/app/index.tsx index e8f95bdf..94c2fb3e 100644 --- a/rsconcept/frontend/src/app/index.tsx +++ b/rsconcept/frontend/src/app/index.tsx @@ -1,4 +1,4 @@ -import { RouterProvider } from 'react-router-dom'; +import { RouterProvider } from 'react-router'; import { Router } from './Router'; diff --git a/rsconcept/frontend/src/components/ui/TextURL.tsx b/rsconcept/frontend/src/components/ui/TextURL.tsx index e48d7eb3..4a73be00 100644 --- a/rsconcept/frontend/src/components/ui/TextURL.tsx +++ b/rsconcept/frontend/src/components/ui/TextURL.tsx @@ -1,4 +1,4 @@ -import { Link } from 'react-router-dom'; +import { Link } from 'react-router'; interface TextURLProps { /** Text to display. */ diff --git a/rsconcept/frontend/src/context/NavigationContext.tsx b/rsconcept/frontend/src/context/NavigationContext.tsx index 4a73562f..0ad7dd35 100644 --- a/rsconcept/frontend/src/context/NavigationContext.tsx +++ b/rsconcept/frontend/src/context/NavigationContext.tsx @@ -1,7 +1,7 @@ 'use client'; import { createContext, useCallback, useContext, useEffect, useState } from 'react'; -import { useLocation, useNavigate } from 'react-router-dom'; +import { useLocation, useNavigate } from 'react-router'; import { globals } from '@/utils/constants'; import { contextOutsideScope } from '@/utils/labels'; @@ -54,7 +54,7 @@ export const NavigationState = ({ children }: React.PropsWithChildren) => { } if (validate()) { scrollTop(); - router(path); + Promise.resolve(router(path)).catch(console.log); setIsBlocked(false); } }, @@ -65,7 +65,7 @@ export const NavigationState = ({ children }: React.PropsWithChildren) => { (path: string) => { if (validate()) { scrollTop(); - router(path, { replace: true }); + Promise.resolve(router(path, { replace: true })).catch(console.log); setIsBlocked(false); } }, @@ -75,7 +75,7 @@ export const NavigationState = ({ children }: React.PropsWithChildren) => { const back = useCallback(() => { if (validate()) { scrollTop(); - router(-1); + Promise.resolve(router(-1)).catch(console.log); setIsBlocked(false); } }, [router, validate, scrollTop]); @@ -83,7 +83,7 @@ export const NavigationState = ({ children }: React.PropsWithChildren) => { const forward = useCallback(() => { if (validate()) { scrollTop(); - router(1); + Promise.resolve(router(1)).catch(console.log); setIsBlocked(false); } }, [router, validate, scrollTop]); diff --git a/rsconcept/frontend/src/hooks/useQueryStrings.ts b/rsconcept/frontend/src/hooks/useQueryStrings.ts index a1b44f9e..513de8b9 100644 --- a/rsconcept/frontend/src/hooks/useQueryStrings.ts +++ b/rsconcept/frontend/src/hooks/useQueryStrings.ts @@ -1,6 +1,6 @@ 'use client'; -import { useLocation } from 'react-router-dom'; +import { useLocation } from 'react-router'; function useQueryStrings() { const search = useLocation().search; diff --git a/rsconcept/frontend/src/pages/OssPage/OssPage.tsx b/rsconcept/frontend/src/pages/OssPage/OssPage.tsx index 185d9e22..d0dae55a 100644 --- a/rsconcept/frontend/src/pages/OssPage/OssPage.tsx +++ b/rsconcept/frontend/src/pages/OssPage/OssPage.tsx @@ -1,6 +1,6 @@ 'use client'; -import { useParams } from 'react-router-dom'; +import { useParams } from 'react-router'; import { AccessModeState } from '@/context/AccessModeContext'; import { OssState } from '@/context/OssContext'; diff --git a/rsconcept/frontend/src/pages/RSFormPage/RSFormPage.tsx b/rsconcept/frontend/src/pages/RSFormPage/RSFormPage.tsx index 4e7849cf..ae5e4673 100644 --- a/rsconcept/frontend/src/pages/RSFormPage/RSFormPage.tsx +++ b/rsconcept/frontend/src/pages/RSFormPage/RSFormPage.tsx @@ -1,6 +1,6 @@ 'use client'; -import { useParams } from 'react-router-dom'; +import { useParams } from 'react-router'; import { AccessModeState } from '@/context/AccessModeContext'; import { RSFormState } from '@/context/RSFormContext'; diff --git a/rsconcept/frontend/vite.config.ts b/rsconcept/frontend/vite.config.ts index ef079cff..e8f4de0f 100644 --- a/rsconcept/frontend/vite.config.ts +++ b/rsconcept/frontend/vite.config.ts @@ -5,7 +5,7 @@ import { defineConfig, loadEnv, PluginOption } from 'vite'; import { dependencies } from './package.json'; // Packages to include in main app bundle -const inlinePackages = ['react', 'react-router-dom', 'react-dom']; +const inlinePackages = ['react', 'react-router', 'react-dom']; // Rollup warnings that should not be displayed const warningsToIgnore = [['SOURCEMAP_ERROR', "Can't resolve original location of error"]];