From 2f3e69eb765fb2163a52799437cd17eef0a396bf Mon Sep 17 00:00:00 2001 From: Nick Grosenbacher Date: Thu, 9 Jan 2025 14:13:57 -0500 Subject: [PATCH] Migrate from react-router-dom@6 to react-router@7 --- apps/SageAccountWeb/package.json | 2 +- apps/SageAccountWeb/src/App.tsx | 2 +- apps/SageAccountWeb/src/AppWrapper.tsx | 8 +- apps/SageAccountWeb/src/LoginPage.tsx | 8 +- .../src/components/AccountCreatedPage.tsx | 14 +- .../src/components/AccountSettings.tsx | 2 +- .../src/components/BackButton.tsx | 5 +- .../src/components/CertificationQuiz.tsx | 6 +- .../src/components/CurrentAffiliationPage.tsx | 10 +- .../src/components/JoinTeamPage.tsx | 18 +- .../src/components/LogoutPage.tsx | 2 +- .../ProfileValidation/ProfileValidation.tsx | 46 ++-- .../ProfileValidation/ReturnToAppButton.tsx | 4 +- .../src/components/RegisterAccount1.tsx | 18 +- .../src/components/ResetPassword.tsx | 4 +- .../src/components/SageResourcesPage.tsx | 8 +- .../components/SignUpdatedTermsOfUsePage.tsx | 2 +- .../TwoFactorAuth/ResetTwoFactorAuth.tsx | 8 +- .../TwoFactorAuthBackupCodesPage.tsx | 2 +- .../TwoFactorAuthEnrollmentPage.tsx | 2 +- .../useMaybeRedirectToSignTermsOfService.ts | 2 +- apps/SageAccountWeb/src/index.tsx | 8 +- .../src/tests/AppInitialization.test.tsx | 4 +- apps/SageAccountWeb/src/tests/TestWrapper.tsx | 2 +- apps/portals/adknowledgeportal/package.json | 2 +- .../src/config/explorePageRoutes.tsx | 12 +- .../src/config/routesConfig.tsx | 2 +- .../src/pages/StudyDetailsPage.tsx | 2 +- apps/portals/arkportal/package.json | 2 +- .../src/config/explorePageRoutes.tsx | 2 +- .../arkportal/src/config/routesConfig.tsx | 2 +- apps/portals/bsmn/package.json | 2 +- .../bsmn/src/config/explorePageRoutes.tsx | 2 +- apps/portals/bsmn/src/config/routesConfig.tsx | 2 +- apps/portals/cancercomplexity/package.json | 2 +- .../src/config/explorePageRoutes.tsx | 2 +- .../src/config/routesConfig.tsx | 2 +- apps/portals/challengeportal/package.json | 2 +- .../src/config/pages/ChallengeDetailsPage.tsx | 2 +- .../src/config/routesConfig.tsx | 4 +- apps/portals/digitalhealth/package.json | 2 +- .../src/config/explorePageRoutes.tsx | 2 +- .../digitalhealth/src/config/routesConfig.tsx | 2 +- apps/portals/elportal/package.json | 2 +- .../elportal/src/config/routesConfig.tsx | 4 +- .../elportal/src/pages/StudyDetailsPage.tsx | 4 +- apps/portals/genie/package.json | 2 +- .../genie/src/config/explorePageRoutes.tsx | 2 +- .../portals/genie/src/config/routesConfig.tsx | 2 +- apps/portals/nf/package.json | 2 +- apps/portals/nf/src/config/routesConfig.tsx | 2 +- .../HackathonDetailsPage.tsx | 2 +- .../OrganizationDetailsPage.tsx | 4 +- .../StudyDetailsPage/StudyDetailsPage.tsx | 2 +- .../pages/ToolDetailsPage/ToolDetailsPage.tsx | 2 +- .../ToolDetailsPageDataTab.tsx | 2 +- apps/portals/stopadportal/package.json | 2 +- .../stopadportal/src/config/routesConfig.tsx | 2 +- apps/synapse-oauth-signin/package.json | 2 +- apps/synapse-oauth-signin/src/App.tsx | 2 +- .../src/AppInitializer.tsx | 8 +- .../src/LoginComponent.tsx | 2 +- apps/synapse-oauth-signin/src/OAuth2Form.tsx | 2 +- apps/synapse-oauth-signin/src/index.tsx | 20 +- .../src/test/App.test.tsx | 2 +- apps/synapse-portal-framework/package.json | 2 +- apps/synapse-portal-framework/src/App.tsx | 2 +- apps/synapse-portal-framework/src/Portal.tsx | 20 +- .../components/DetailsPage/DetailsPage.tsx | 2 +- .../DetailsPage/DetailsPageContentLayout.tsx | 2 +- .../DetailsPageDocumentMetadata.tsx | 2 +- .../DetailsPage/DetailsPageTabs.tsx | 2 +- .../src/components/DetailsPage/utils.ts | 4 +- .../Explore/ExploreWrapper.test.tsx | 2 +- .../src/components/Explore/ExploreWrapper.tsx | 2 +- .../components/Explore/ExploreWrapperProps.ts | 2 +- .../components/Explore/ExploreWrapperTabs.tsx | 6 +- .../src/components/NavLink.tsx | 2 +- .../src/components/PortalContext.tsx | 2 +- .../src/components/ProjectDiscussionForum.tsx | 8 +- .../src/components/RedirectToURL.tsx | 2 +- .../src/components/RedirectWithQuery.tsx | 2 +- .../src/components/SectionLayout.tsx | 2 +- .../csbc-home-page/HomePageLinks.tsx | 2 +- .../src/components/index.ts | 42 +-- .../components/navbar/DropdownNavButton.tsx | 4 +- .../src/components/navbar/Navbar.tsx | 4 +- .../src/shared-config/sharedRoutes.tsx | 2 +- .../UseGetPortalComponentSearchParams.ts | 2 +- .../src/utils/useDocumentTitleFromRoutes.ts | 2 +- packages/synapse-react-client/package.json | 6 +- .../SubmissionDirectoryList.tsx | 30 +-- .../ChangePassword.integration.test.tsx | 32 +-- .../ChangePassword/ChangePassword.tsx | 8 +- ...angePasswordWithToken.integration.test.tsx | 16 +- .../DownloadCart/ShowDownloadV2.tsx | 8 +- .../ImageCardGridWithLinks.stories.tsx | 2 +- .../ImageCardGridWithLinks.test.tsx | 16 +- .../ImageCardGridWithLinks.tsx | 12 +- .../PortalFeatureHighlights.stories.tsx | 2 +- .../PortalFeatureHighlights.test.tsx | 4 +- .../PortalFeatureHighlights.tsx | 4 +- .../RecentPublicationsGrid.test.tsx | 14 +- .../RecentPublicationsGrid.tsx | 17 +- .../ReleaseCard/ReleaseCard.test.tsx | 2 +- .../ReleaseCard/ReleaseCardLarge.tsx | 2 +- .../ReleaseCard/ReleaseCardMedium.tsx | 2 +- .../components/StorybookComponentWrapper.tsx | 3 +- .../SynapseForm/SynapseForm.test.tsx | 6 +- ...ccessHistoryDashboard.integration.test.tsx | 2 +- .../dataaccess/AccessHistoryDashboard.tsx | 14 +- ...equestSubmissionTable.integration.test.tsx | 2 +- .../AccessRequestSubmissionTable.tsx | 22 +- ...sRequirementDashboard.integration.test.tsx | 2 +- .../dataaccess/AccessRequirementDashboard.tsx | 14 +- ...ssSubmissionDashboard.integration.test.tsx | 2 +- .../dataaccess/AccessSubmissionDashboard.tsx | 11 +- .../dataaccess/ReviewerDashboard.tsx | 22 +- .../src/components/utils/Blocker.tsx | 2 +- .../widgets/LoginAwareButton.test.tsx | 10 +- .../components/widgets/LoginAwareButton.tsx | 4 +- .../src/testutils/LocationTracker.tsx | 2 +- .../src/utils/AppUtils/AppUtils.ts | 2 +- .../session/ApplicationSession.test.tsx | 36 +-- .../session/ApplicationSessionManager.tsx | 2 +- .../src/utils/hooks/useQuerySearchParam.ts | 2 +- pnpm-lock.yaml | 242 +++++++----------- 127 files changed, 455 insertions(+), 559 deletions(-) diff --git a/apps/SageAccountWeb/package.json b/apps/SageAccountWeb/package.json index 6b86a5c0dd8..c16eb9538d3 100644 --- a/apps/SageAccountWeb/package.json +++ b/apps/SageAccountWeb/package.json @@ -23,7 +23,7 @@ "react-cookie": "4.0.0", "react-dom": "18.2.0", "react-easy-crop": "^5.0.7", - "react-router-dom": "^6.28.1", + "react-router": "^7.1.1", "sass": "^1.71.1", "synapse-react-client": "workspace:*", "universal-cookie": "^4.0.4" diff --git a/apps/SageAccountWeb/src/App.tsx b/apps/SageAccountWeb/src/App.tsx index 8e98469c340..8f073c7ea3c 100644 --- a/apps/SageAccountWeb/src/App.tsx +++ b/apps/SageAccountWeb/src/App.tsx @@ -1,5 +1,5 @@ import { useEffect } from 'react' -import { Route, Routes } from 'react-router-dom' +import { Route, Routes } from 'react-router' import { CookiesNotification, processRedirectURLInOneSage, diff --git a/apps/SageAccountWeb/src/AppWrapper.tsx b/apps/SageAccountWeb/src/AppWrapper.tsx index ce2967ab37c..c7ebb1da24d 100644 --- a/apps/SageAccountWeb/src/AppWrapper.tsx +++ b/apps/SageAccountWeb/src/AppWrapper.tsx @@ -1,14 +1,14 @@ -import { PropsWithChildren } from 'react' -import { RESET_2FA_ROUTE, RESET_2FA_SIGNED_TOKEN_PARAM } from './Constants' import { StyledEngineProvider } from '@mui/material/styles' import { QueryClient, QueryClientProvider } from '@tanstack/react-query' +import { PropsWithChildren } from 'react' +import { useNavigate } from 'react-router' import { ApplicationSessionManager, SynapseToastContainer, } from 'synapse-react-client' -import { SourceAppProvider } from './components/useSourceApp' import AppInitializer from './AppInitializer' -import { useNavigate } from 'react-router-dom' +import { SourceAppProvider } from './components/useSourceApp' +import { RESET_2FA_ROUTE, RESET_2FA_SIGNED_TOKEN_PARAM } from './Constants' const queryClient = new QueryClient({ defaultOptions: { diff --git a/apps/SageAccountWeb/src/LoginPage.tsx b/apps/SageAccountWeb/src/LoginPage.tsx index 2a412bb00f6..e439ef4de78 100644 --- a/apps/SageAccountWeb/src/LoginPage.tsx +++ b/apps/SageAccountWeb/src/LoginPage.tsx @@ -1,14 +1,14 @@ import { Box, Typography } from '@mui/material' -import { useNavigate } from 'react-router-dom' +import { useNavigate } from 'react-router' import { LoginMethod, + restoreLastPlace, StandaloneLoginForm, + storeLastPlace, SynapseConstants, SystemUseNotification, - storeLastPlace, - restoreLastPlace, - useLastLoginInfoState, useApplicationSessionContext, + useLastLoginInfoState, } from 'synapse-react-client' import { backButtonSx } from './components/BackButton.js' import { SourceAppDescription, SourceAppLogo } from './components/SourceApp.js' diff --git a/apps/SageAccountWeb/src/components/AccountCreatedPage.tsx b/apps/SageAccountWeb/src/components/AccountCreatedPage.tsx index 0377786aa8a..fadd0f1c3b6 100644 --- a/apps/SageAccountWeb/src/components/AccountCreatedPage.tsx +++ b/apps/SageAccountWeb/src/components/AccountCreatedPage.tsx @@ -1,15 +1,15 @@ -import { SourceAppLogo } from './SourceApp' import { Button, Grid, Link, Typography } from '@mui/material' -import { AppContextConsumer } from '../AppContext' -import { Link as RouterLink } from 'react-router-dom' -import { LeftRightPanel } from './LeftRightPanel' -import useMembershipInvitationTokenHandler from '../hooks/useMembershipInvitationTokenHandler' -import { useSourceApp } from './useSourceApp' +import { Link as RouterLink } from 'react-router' import { - SynapseHookUtils, processRedirectURLInOneSage, + SynapseHookUtils, } from 'synapse-react-client' +import { AppContextConsumer } from '../AppContext' +import useMembershipInvitationTokenHandler from '../hooks/useMembershipInvitationTokenHandler' import { sourceAppConfigTableID } from '../resources' +import { LeftRightPanel } from './LeftRightPanel' +import { SourceAppLogo } from './SourceApp' +import { useSourceApp } from './useSourceApp' export type AccountCreatedPageProps = {} diff --git a/apps/SageAccountWeb/src/components/AccountSettings.tsx b/apps/SageAccountWeb/src/components/AccountSettings.tsx index db5c25e4eb0..6b2b8e9050e 100644 --- a/apps/SageAccountWeb/src/components/AccountSettings.tsx +++ b/apps/SageAccountWeb/src/components/AccountSettings.tsx @@ -20,7 +20,7 @@ import { } from '@sage-bionetworks/synapse-types' import { RefObject, useEffect, useRef, useState } from 'react' import { Form } from 'react-bootstrap' -import { Link as RouterLink, useLocation, useNavigate } from 'react-router-dom' +import { Link as RouterLink, useLocation, useNavigate } from 'react-router' import { ChangePassword, CookiePreferencesDialog, diff --git a/apps/SageAccountWeb/src/components/BackButton.tsx b/apps/SageAccountWeb/src/components/BackButton.tsx index 8ab409aa43c..6f0a1fefde9 100644 --- a/apps/SageAccountWeb/src/components/BackButton.tsx +++ b/apps/SageAccountWeb/src/components/BackButton.tsx @@ -1,10 +1,7 @@ import ArrowBackIcon from '@mui/icons-material/ArrowBack' import { IconButton, SxProps } from '@mui/material' import { MouseEventHandler } from 'react' -import { - Link as RouterLink, - LinkProps as RouterLinkProps, -} from 'react-router-dom' +import { Link as RouterLink, LinkProps as RouterLinkProps } from 'react-router' type StyleProps = { sx?: SxProps } type BackLinkProps = { to: RouterLinkProps['to'] } diff --git a/apps/SageAccountWeb/src/components/CertificationQuiz.tsx b/apps/SageAccountWeb/src/components/CertificationQuiz.tsx index 05feda40b86..79aeb0fde1b 100644 --- a/apps/SageAccountWeb/src/components/CertificationQuiz.tsx +++ b/apps/SageAccountWeb/src/components/CertificationQuiz.tsx @@ -1,7 +1,7 @@ -import { Link as RouterLink } from 'react-router-dom' -import { MuiContainer, CertificationQuiz as Quiz } from 'synapse-react-client' -import ReturnArrow from '../assets/ReturnArrow.svg?url' import { Link, Paper } from '@mui/material' +import { Link as RouterLink } from 'react-router' +import { CertificationQuiz as Quiz, MuiContainer } from 'synapse-react-client' +import ReturnArrow from '../assets/ReturnArrow.svg?url' export const CertificationQuiz = () => { return ( diff --git a/apps/SageAccountWeb/src/components/CurrentAffiliationPage.tsx b/apps/SageAccountWeb/src/components/CurrentAffiliationPage.tsx index 87f62385be2..b913dc0677e 100644 --- a/apps/SageAccountWeb/src/components/CurrentAffiliationPage.tsx +++ b/apps/SageAccountWeb/src/components/CurrentAffiliationPage.tsx @@ -1,16 +1,16 @@ -import { useEffect, useState } from 'react' -import { SourceAppLogo } from './SourceApp' import { TextField, Typography } from '@mui/material' -import { LeftRightPanel } from './LeftRightPanel' -import { StyledFormControl } from './StyledComponents' +import { useEffect, useState } from 'react' +import { Navigate } from 'react-router' import { displayToast, SynapseClient, SynapseQueries, useSynapseContext, } from 'synapse-react-client' -import { Navigate } from 'react-router-dom' +import { LeftRightPanel } from './LeftRightPanel' import { ContinueButton } from './ProfileValidation/ContinueButton' +import { SourceAppLogo } from './SourceApp' +import { StyledFormControl } from './StyledComponents' import { useSourceApp } from './useSourceApp' export const CurrentAffiliationPage = () => { diff --git a/apps/SageAccountWeb/src/components/JoinTeamPage.tsx b/apps/SageAccountWeb/src/components/JoinTeamPage.tsx index ae0f0448383..de2348c0441 100644 --- a/apps/SageAccountWeb/src/components/JoinTeamPage.tsx +++ b/apps/SageAccountWeb/src/components/JoinTeamPage.tsx @@ -1,12 +1,5 @@ -import { useEffect, useState } from 'react' +import { CelebrationOutlined, Groups2Outlined } from '@mui/icons-material' import { Box, Button, Typography, useTheme } from '@mui/material' -import { useAppContext } from '../AppContext' -import { - displayToast, - SynapseClient, - UserOrTeamBadge, -} from 'synapse-react-client' -import { Navigate } from 'react-router-dom' import { isJoinTeamSignedToken, isMembershipInvtnSignedToken, @@ -14,7 +7,14 @@ import { MembershipInvitation, ResponseMessage, } from '@sage-bionetworks/synapse-types' -import { CelebrationOutlined, Groups2Outlined } from '@mui/icons-material' +import { useEffect, useState } from 'react' +import { Navigate } from 'react-router' +import { + displayToast, + SynapseClient, + UserOrTeamBadge, +} from 'synapse-react-client' +import { useAppContext } from '../AppContext' import { StyledOuterContainer } from './StyledComponents' export function JoinTeamPage() { diff --git a/apps/SageAccountWeb/src/components/LogoutPage.tsx b/apps/SageAccountWeb/src/components/LogoutPage.tsx index 65e864de1cd..c3de2ae53c2 100644 --- a/apps/SageAccountWeb/src/components/LogoutPage.tsx +++ b/apps/SageAccountWeb/src/components/LogoutPage.tsx @@ -1,4 +1,4 @@ -import { useNavigate } from 'react-router-dom' +import { useNavigate } from 'react-router' import { SynapseClient } from 'synapse-react-client' export default function LogoutPage() { diff --git a/apps/SageAccountWeb/src/components/ProfileValidation/ProfileValidation.tsx b/apps/SageAccountWeb/src/components/ProfileValidation/ProfileValidation.tsx index 611bc80ca1c..979430f52f3 100644 --- a/apps/SageAccountWeb/src/components/ProfileValidation/ProfileValidation.tsx +++ b/apps/SageAccountWeb/src/components/ProfileValidation/ProfileValidation.tsx @@ -1,22 +1,5 @@ -import { SyntheticEvent, useEffect, useState } from 'react' -import { Navigate } from 'react-router-dom' -import { - displayToast, - SynapseClient, - SynapseConstants, - SynapseContextUtils, -} from 'synapse-react-client' -import CloseIcon from '@mui/icons-material/Close' import ArrowRightAltIcon from '@mui/icons-material/ArrowRightAlt' -import { - UserBundle, - UserProfile, - VerificationSubmission, -} from '@sage-bionetworks/synapse-types' -import { getSearchParam } from '../../URLUtils' -import { ProfileFieldsEditor } from './ProfileFieldsEditor' -import { VerifyIdentify } from './VerifyIdentify' -import { StyledInnerContainer, StyledOuterContainer } from '../StyledComponents' +import CloseIcon from '@mui/icons-material/Close' import { Box, Button, @@ -26,14 +9,31 @@ import { Typography, useTheme, } from '@mui/material' +import { + UserBundle, + UserProfile, + VerificationSubmission, +} from '@sage-bionetworks/synapse-types' +import { SyntheticEvent, useEffect, useState } from 'react' +import { Navigate } from 'react-router' +import { + displayToast, + SynapseClient, + SynapseConstants, + SynapseContextUtils, +} from 'synapse-react-client' +import { getSearchParam } from '../../URLUtils' +import { BackButton } from '../BackButton' import { SourceAppLogo } from '../SourceApp' -import Attestation from './Attestation' -import ThankYou from './ThankYou' -import TermsAndConditionsWrapped from './TermsAndConditionsWrapped' -import { ReturnToAppButton } from './ReturnToAppButton' +import { StyledInnerContainer, StyledOuterContainer } from '../StyledComponents' import { TermsOfUseRightPanelText } from '../TermsOfUseRightPanelText' -import { BackButton } from '../BackButton' import { useSourceApp } from '../useSourceApp' +import Attestation from './Attestation' +import { ProfileFieldsEditor } from './ProfileFieldsEditor' +import { ReturnToAppButton } from './ReturnToAppButton' +import TermsAndConditionsWrapped from './TermsAndConditionsWrapped' +import ThankYou from './ThankYou' +import { VerifyIdentify } from './VerifyIdentify' const IDENTITY_ATTESTATION_TEMPLATE_DOCUMENT_LINK = 'https://help.synapse.org/__attachments/2007072795/signing_official.doc?inst-v=77bba77d-449d-4402-a8bb-6895820b38a9' diff --git a/apps/SageAccountWeb/src/components/ProfileValidation/ReturnToAppButton.tsx b/apps/SageAccountWeb/src/components/ProfileValidation/ReturnToAppButton.tsx index ed702a6c2c3..1618b7066e6 100644 --- a/apps/SageAccountWeb/src/components/ProfileValidation/ReturnToAppButton.tsx +++ b/apps/SageAccountWeb/src/components/ProfileValidation/ReturnToAppButton.tsx @@ -1,3 +1,4 @@ +import CloseIcon from '@mui/icons-material/Close' import { Box, Button, @@ -10,9 +11,8 @@ import { Typography, useTheme, } from '@mui/material' -import CloseIcon from '@mui/icons-material/Close' import { cloneElement, PropsWithChildren, ReactElement, useState } from 'react' -import { NavLink } from 'react-router-dom' +import { NavLink } from 'react-router' export function ReturnToAppButton({ children }: PropsWithChildren) { const theme = useTheme() diff --git a/apps/SageAccountWeb/src/components/RegisterAccount1.tsx b/apps/SageAccountWeb/src/components/RegisterAccount1.tsx index ccf44a4702f..9716327d7d1 100644 --- a/apps/SageAccountWeb/src/components/RegisterAccount1.tsx +++ b/apps/SageAccountWeb/src/components/RegisterAccount1.tsx @@ -1,4 +1,3 @@ -import { SyntheticEvent, useEffect, useMemo, useState } from 'react' import { Box, Button, @@ -7,6 +6,12 @@ import { Typography, useTheme, } from '@mui/material' +import { + AliasType, + isMembershipInvtnSignedToken, +} from '@sage-bionetworks/synapse-types' +import { SyntheticEvent, useEffect, useMemo, useState } from 'react' +import { Link as RouterLink, useLocation } from 'react-router' import { displayToast, IconSvg, @@ -18,16 +23,11 @@ import { useLastLoginInfo, useSynapseContext, } from 'synapse-react-client' -import { - AliasType, - isMembershipInvtnSignedToken, -} from '@sage-bionetworks/synapse-types' -import { SourceAppLogo } from './SourceApp' -import { Link as RouterLink, useLocation } from 'react-router-dom' -import { EmailConfirmationPage } from './EmailConfirmationPage' -import GoogleLogo from '../assets/g-logo.png' import { useAppContext } from '../AppContext' +import GoogleLogo from '../assets/g-logo.png' import { BackButton } from './BackButton' +import { EmailConfirmationPage } from './EmailConfirmationPage' +import { SourceAppLogo } from './SourceApp' import { StyledFormControl, StyledInnerContainer, diff --git a/apps/SageAccountWeb/src/components/ResetPassword.tsx b/apps/SageAccountWeb/src/components/ResetPassword.tsx index 795854658e1..e7199bf9775 100644 --- a/apps/SageAccountWeb/src/components/ResetPassword.tsx +++ b/apps/SageAccountWeb/src/components/ResetPassword.tsx @@ -1,13 +1,13 @@ import { Box, Button, SxProps, TextField, Typography } from '@mui/material' +import { PasswordResetSignedToken } from '@sage-bionetworks/synapse-types' import { FormEvent, useMemo, useState } from 'react' -import { useNavigate } from 'react-router-dom' +import { useNavigate } from 'react-router' import { ChangePasswordWithToken, displayToast, SynapseClientError, SynapseQueries, } from 'synapse-react-client' -import { PasswordResetSignedToken } from '@sage-bionetworks/synapse-types' import { getSearchParam, hexDecodeAndDeserialize } from '../URLUtils' import { BackButton } from './BackButton' import { LeftRightPanel } from './LeftRightPanel' diff --git a/apps/SageAccountWeb/src/components/SageResourcesPage.tsx b/apps/SageAccountWeb/src/components/SageResourcesPage.tsx index d22faa25826..8b0834e8ed9 100644 --- a/apps/SageAccountWeb/src/components/SageResourcesPage.tsx +++ b/apps/SageAccountWeb/src/components/SageResourcesPage.tsx @@ -2,20 +2,20 @@ import { Box, Button, Grid, + Link, Paper, Typography, useTheme, - Link, } from '@mui/material' +import { Link as RouterLink } from 'react-router' import { ShowMore, SynapseHookUtils } from 'synapse-react-client' +import { sourceAppConfigTableID } from '../resources' import { StyledOuterContainer } from './StyledComponents' -import { Link as RouterLink } from 'react-router-dom' import { - SYNAPSE_SOURCE_APP_ID, SourceAppProvider, + SYNAPSE_SOURCE_APP_ID, useSourceApp, } from './useSourceApp' -import { sourceAppConfigTableID } from '../resources' export function SageResourcesPageInternal() { const theme = useTheme() diff --git a/apps/SageAccountWeb/src/components/SignUpdatedTermsOfUsePage.tsx b/apps/SageAccountWeb/src/components/SignUpdatedTermsOfUsePage.tsx index 591ef2fbce2..1e4f65674d6 100644 --- a/apps/SageAccountWeb/src/components/SignUpdatedTermsOfUsePage.tsx +++ b/apps/SageAccountWeb/src/components/SignUpdatedTermsOfUsePage.tsx @@ -8,7 +8,7 @@ import { } from '@mui/material' import { TermsOfServiceState } from '@sage-bionetworks/synapse-types' import { SyntheticEvent, useState } from 'react' -import { useNavigate } from 'react-router-dom' +import { useNavigate } from 'react-router' import { displayToast, GovernanceMarkdownGithub, diff --git a/apps/SageAccountWeb/src/components/TwoFactorAuth/ResetTwoFactorAuth.tsx b/apps/SageAccountWeb/src/components/TwoFactorAuth/ResetTwoFactorAuth.tsx index 81054ce638c..f87d0d3dbc4 100644 --- a/apps/SageAccountWeb/src/components/TwoFactorAuth/ResetTwoFactorAuth.tsx +++ b/apps/SageAccountWeb/src/components/TwoFactorAuth/ResetTwoFactorAuth.tsx @@ -1,6 +1,8 @@ import { Alert, Box, Button, Typography } from '@mui/material' +import { TwoFactorAuthErrorResponse } from '@sage-bionetworks/synapse-client/generated/models/TwoFactorAuthErrorResponse' +import { TwoFactorAuthResetToken } from '@sage-bionetworks/synapse-types' import { useMemo, useState } from 'react' -import { useNavigate } from 'react-router-dom' +import { useNavigate } from 'react-router' import { displayToast, PasswordField, @@ -9,13 +11,11 @@ import { useApplicationSessionContext, useQuerySearchParam, } from 'synapse-react-client' -import { TwoFactorAuthResetToken } from '@sage-bionetworks/synapse-types' -import { TwoFactorAuthErrorResponse } from '@sage-bionetworks/synapse-client/generated/models/TwoFactorAuthErrorResponse' +import { RESET_2FA_SIGNED_TOKEN_PARAM } from '../../Constants' import { hexDecodeAndDeserialize } from '../../URLUtils' import { BackButton } from '../BackButton' import { LeftRightPanel } from '../LeftRightPanel' import { SourceAppLogo } from '../SourceApp' -import { RESET_2FA_SIGNED_TOKEN_PARAM } from '../../Constants' export function ResetTwoFactorAuth() { const navigate = useNavigate() diff --git a/apps/SageAccountWeb/src/components/TwoFactorAuth/TwoFactorAuthBackupCodesPage.tsx b/apps/SageAccountWeb/src/components/TwoFactorAuth/TwoFactorAuthBackupCodesPage.tsx index bf2ae50ab2a..a8f90bb9414 100644 --- a/apps/SageAccountWeb/src/components/TwoFactorAuth/TwoFactorAuthBackupCodesPage.tsx +++ b/apps/SageAccountWeb/src/components/TwoFactorAuth/TwoFactorAuthBackupCodesPage.tsx @@ -1,4 +1,4 @@ -import { useNavigate, useLocation } from 'react-router-dom' +import { useLocation, useNavigate } from 'react-router' import { TwoFactorBackupCodes } from 'synapse-react-client' /** diff --git a/apps/SageAccountWeb/src/components/TwoFactorAuth/TwoFactorAuthEnrollmentPage.tsx b/apps/SageAccountWeb/src/components/TwoFactorAuth/TwoFactorAuthEnrollmentPage.tsx index b0ce24a3cb9..ee1721df2b8 100644 --- a/apps/SageAccountWeb/src/components/TwoFactorAuth/TwoFactorAuthEnrollmentPage.tsx +++ b/apps/SageAccountWeb/src/components/TwoFactorAuth/TwoFactorAuthEnrollmentPage.tsx @@ -1,5 +1,5 @@ +import { useNavigate } from 'react-router' import { TwoFactorEnrollmentForm } from 'synapse-react-client' -import { useNavigate } from 'react-router-dom' export default function TwoFactorAuthEnrollmentPage() { const navigate = useNavigate() diff --git a/apps/SageAccountWeb/src/hooks/useMaybeRedirectToSignTermsOfService.ts b/apps/SageAccountWeb/src/hooks/useMaybeRedirectToSignTermsOfService.ts index 13e1a643b59..336c7d72e78 100644 --- a/apps/SageAccountWeb/src/hooks/useMaybeRedirectToSignTermsOfService.ts +++ b/apps/SageAccountWeb/src/hooks/useMaybeRedirectToSignTermsOfService.ts @@ -1,6 +1,6 @@ import { TermsOfServiceState } from '@sage-bionetworks/synapse-types' import { useEffect, useState } from 'react' -import { useNavigate, useLocation } from 'react-router-dom' +import { useLocation, useNavigate } from 'react-router' import { storeLastPlace, useApplicationSessionContext, diff --git a/apps/SageAccountWeb/src/index.tsx b/apps/SageAccountWeb/src/index.tsx index 6ed0ed837aa..6e396695d31 100644 --- a/apps/SageAccountWeb/src/index.tsx +++ b/apps/SageAccountWeb/src/index.tsx @@ -1,9 +1,9 @@ import { StrictMode } from 'react' import { createRoot } from 'react-dom/client' +import { BrowserRouter } from 'react-router' import App from './App' -import { BrowserRouter } from 'react-router-dom' -import * as serviceWorker from './serviceWorker' import AppWrapper from './AppWrapper' +import * as serviceWorker from './serviceWorker' // KaTeX CSS is not included in the SRC style bundle since it includes many large font files. import 'katex/dist/katex.css' @@ -14,9 +14,7 @@ const root = createRoot(container!) root.render( - + diff --git a/apps/SageAccountWeb/src/tests/AppInitialization.test.tsx b/apps/SageAccountWeb/src/tests/AppInitialization.test.tsx index 73fd1338c24..fade995bc09 100644 --- a/apps/SageAccountWeb/src/tests/AppInitialization.test.tsx +++ b/apps/SageAccountWeb/src/tests/AppInitialization.test.tsx @@ -1,8 +1,8 @@ import { render, screen } from '@testing-library/react' +import { MemoryRouter } from 'react-router' +import { FullContextProvider } from 'synapse-react-client' import { AppContextProvider } from '../AppContext' import LoginPage from '../LoginPage' -import { MemoryRouter } from 'react-router-dom' -import { FullContextProvider } from 'synapse-react-client' describe('App initialization tests', () => { it.skip('renders a branded experience', async () => { diff --git a/apps/SageAccountWeb/src/tests/TestWrapper.tsx b/apps/SageAccountWeb/src/tests/TestWrapper.tsx index 3dc2b72d3f4..031ccda8204 100644 --- a/apps/SageAccountWeb/src/tests/TestWrapper.tsx +++ b/apps/SageAccountWeb/src/tests/TestWrapper.tsx @@ -1,5 +1,5 @@ import { PropsWithChildren } from 'react' -import { MemoryRouter, MemoryRouterProps } from 'react-router-dom' +import { MemoryRouter, MemoryRouterProps } from 'react-router' import AppWrapper from '../AppWrapper' export type TestWrapperProps = PropsWithChildren<{ diff --git a/apps/portals/adknowledgeportal/package.json b/apps/portals/adknowledgeportal/package.json index 1b4dc637231..8cb1079eeab 100644 --- a/apps/portals/adknowledgeportal/package.json +++ b/apps/portals/adknowledgeportal/package.json @@ -9,7 +9,7 @@ "katex": "^0.16.10", "react": "^18.2.0", "react-dom": "^18.2.0", - "react-router-dom": "^6.28.1", + "react-router": "^7.1.1", "synapse-react-client": "workspace:*", "vite": "^5.4.3" }, diff --git a/apps/portals/adknowledgeportal/src/config/explorePageRoutes.tsx b/apps/portals/adknowledgeportal/src/config/explorePageRoutes.tsx index 72fa1a46e5a..737abf4d1b5 100644 --- a/apps/portals/adknowledgeportal/src/config/explorePageRoutes.tsx +++ b/apps/portals/adknowledgeportal/src/config/explorePageRoutes.tsx @@ -1,4 +1,9 @@ -import { RouteObject } from 'react-router-dom' +import { RouteObject } from 'react-router' +import { + CardContainerLogic, + MarkdownSynapse, + QueryWrapperPlotNav, +} from 'synapse-react-client' import { programsSql } from './resources' import { computationalToolsQueryWrapperPlotNavProps } from './synapseConfigs/computational_tools' import { dataQueryWrapperPlotNavProps } from './synapseConfigs/data' @@ -10,11 +15,6 @@ import { publicationsQueryWrapperPlotNavProps } from './synapseConfigs/publicati import { results } from './synapseConfigs/results' import { studiesQueryWrapperPlotNavProps } from './synapseConfigs/studies' import { targetEnablingResourcesQueryWrapperPlotNavProps } from './synapseConfigs/target_enabling_resources' -import { - CardContainerLogic, - MarkdownSynapse, - QueryWrapperPlotNav, -} from 'synapse-react-client' export const explorePageRoutes: RouteObject[] = [ { diff --git a/apps/portals/adknowledgeportal/src/config/routesConfig.tsx b/apps/portals/adknowledgeportal/src/config/routesConfig.tsx index a64043ea92d..3179324896a 100644 --- a/apps/portals/adknowledgeportal/src/config/routesConfig.tsx +++ b/apps/portals/adknowledgeportal/src/config/routesConfig.tsx @@ -5,7 +5,7 @@ import RedirectWithQuery from '@sage-bionetworks/synapse-portal-framework/compon import { SectionLayout } from '@sage-bionetworks/synapse-portal-framework/components/SectionLayout' import SurveyToast from '@sage-bionetworks/synapse-portal-framework/components/SurveyToast' import sharedRoutes from '@sage-bionetworks/synapse-portal-framework/shared-config/sharedRoutes' -import { Navigate, RouteObject } from 'react-router-dom' +import { Navigate, RouteObject } from 'react-router' import HomePage from 'src/pages/HomePage' import ProgramDetailsPage from 'src/pages/ProgramDetailsPage' import ProjectDetailsPage from 'src/pages/ProjectDetailsPage' diff --git a/apps/portals/adknowledgeportal/src/pages/StudyDetailsPage.tsx b/apps/portals/adknowledgeportal/src/pages/StudyDetailsPage.tsx index e01f209707f..946264df0ef 100644 --- a/apps/portals/adknowledgeportal/src/pages/StudyDetailsPage.tsx +++ b/apps/portals/adknowledgeportal/src/pages/StudyDetailsPage.tsx @@ -16,7 +16,7 @@ import { ColumnMultiValueFunction, ColumnSingleValueFilterOperator, } from '@sage-bionetworks/synapse-types' -import { Outlet, RouteObject } from 'react-router-dom' +import { Outlet, RouteObject } from 'react-router' import { dataOnStudiesPageSql, dataSql, studiesSql } from 'src/config/resources' import { DATA_TABLE_COLUMN_NAMES } from 'src/config/synapseConfigs/data' import { diff --git a/apps/portals/arkportal/package.json b/apps/portals/arkportal/package.json index 0dd28ad5e9d..7323c2e59d7 100644 --- a/apps/portals/arkportal/package.json +++ b/apps/portals/arkportal/package.json @@ -9,7 +9,7 @@ "katex": "^0.16.10", "react": "^18.2.0", "react-dom": "^18.2.0", - "react-router-dom": "^6.28.1", + "react-router": "^7.1.1", "synapse-react-client": "workspace:*", "vite": "^5.4.3" }, diff --git a/apps/portals/arkportal/src/config/explorePageRoutes.tsx b/apps/portals/arkportal/src/config/explorePageRoutes.tsx index 280f97dd2e7..a2153c328b4 100644 --- a/apps/portals/arkportal/src/config/explorePageRoutes.tsx +++ b/apps/portals/arkportal/src/config/explorePageRoutes.tsx @@ -1,4 +1,4 @@ -import { RouteObject } from 'react-router-dom' +import { RouteObject } from 'react-router' import { CardContainerLogic, QueryWrapperPlotNav } from 'synapse-react-client' import { dataQueryWrapperPlotNavProps } from './synapseConfigs/data' import { datasetCollectionsCardContainerLogicProps } from './synapseConfigs/datasetcollections' diff --git a/apps/portals/arkportal/src/config/routesConfig.tsx b/apps/portals/arkportal/src/config/routesConfig.tsx index 11b7bdcd6f7..f655691b863 100644 --- a/apps/portals/arkportal/src/config/routesConfig.tsx +++ b/apps/portals/arkportal/src/config/routesConfig.tsx @@ -3,7 +3,7 @@ import ARKWelcomePage from '@sage-bionetworks/synapse-portal-framework/component import ExploreWrapper from '@sage-bionetworks/synapse-portal-framework/components/Explore/ExploreWrapper' import { SectionLayout } from '@sage-bionetworks/synapse-portal-framework/components/SectionLayout' import sharedRoutes from '@sage-bionetworks/synapse-portal-framework/shared-config/sharedRoutes' -import { RouteObject } from 'react-router-dom' +import { RouteObject } from 'react-router' import { Goals, JsonLdScript, MarkdownSynapse } from 'synapse-react-client' import { DatasetDetailsPage } from '../pages/DatasetDetailsPage' import { ProgramsDetailPage } from '../pages/ProgramDetailsPage' diff --git a/apps/portals/bsmn/package.json b/apps/portals/bsmn/package.json index aa8009db213..576e1004c67 100644 --- a/apps/portals/bsmn/package.json +++ b/apps/portals/bsmn/package.json @@ -9,7 +9,7 @@ "katex": "^0.16.10", "react": "^18.2.0", "react-dom": "^18.2.0", - "react-router-dom": "^6.28.1", + "react-router": "^7.1.1", "synapse-react-client": "workspace:*", "vite": "^5.4.3" }, diff --git a/apps/portals/bsmn/src/config/explorePageRoutes.tsx b/apps/portals/bsmn/src/config/explorePageRoutes.tsx index ed90dad814d..da01b7398a6 100644 --- a/apps/portals/bsmn/src/config/explorePageRoutes.tsx +++ b/apps/portals/bsmn/src/config/explorePageRoutes.tsx @@ -1,4 +1,4 @@ -import { RouteObject } from 'react-router-dom' +import { RouteObject } from 'react-router' import { QueryWrapperPlotNav } from 'synapse-react-client' import { individualsQueryWrapperPlotNavProps } from './synapseConfigs/people' import { projectsQueryWrapperPlotNavProps } from './synapseConfigs/projects' diff --git a/apps/portals/bsmn/src/config/routesConfig.tsx b/apps/portals/bsmn/src/config/routesConfig.tsx index 0213db43186..056beb6dffe 100644 --- a/apps/portals/bsmn/src/config/routesConfig.tsx +++ b/apps/portals/bsmn/src/config/routesConfig.tsx @@ -3,7 +3,7 @@ import ExploreWrapper from '@sage-bionetworks/synapse-portal-framework/component import Header from '@sage-bionetworks/synapse-portal-framework/components/Header' import { SectionLayout } from '@sage-bionetworks/synapse-portal-framework/components/SectionLayout' import sharedRoutes from '@sage-bionetworks/synapse-portal-framework/shared-config/sharedRoutes' -import { RouteObject } from 'react-router-dom' +import { RouteObject } from 'react-router' import { Goals, MarkdownSynapse, diff --git a/apps/portals/cancercomplexity/package.json b/apps/portals/cancercomplexity/package.json index d7733f216b8..204786affe1 100644 --- a/apps/portals/cancercomplexity/package.json +++ b/apps/portals/cancercomplexity/package.json @@ -9,7 +9,7 @@ "katex": "^0.16.10", "react": "^18.2.0", "react-dom": "^18.2.0", - "react-router-dom": "^6.28.1", + "react-router": "^7.1.1", "synapse-react-client": "workspace:*", "vite": "^5.4.3" }, diff --git a/apps/portals/cancercomplexity/src/config/explorePageRoutes.tsx b/apps/portals/cancercomplexity/src/config/explorePageRoutes.tsx index 05fb8e4683b..014ac23f0aa 100644 --- a/apps/portals/cancercomplexity/src/config/explorePageRoutes.tsx +++ b/apps/portals/cancercomplexity/src/config/explorePageRoutes.tsx @@ -1,4 +1,4 @@ -import { RouteObject } from 'react-router-dom' +import { RouteObject } from 'react-router' import { QueryWrapperPlotNav } from 'synapse-react-client' import { datasetsQueryWrapperPlotNavProps, diff --git a/apps/portals/cancercomplexity/src/config/routesConfig.tsx b/apps/portals/cancercomplexity/src/config/routesConfig.tsx index dc800aeed13..c5abdc3dc22 100644 --- a/apps/portals/cancercomplexity/src/config/routesConfig.tsx +++ b/apps/portals/cancercomplexity/src/config/routesConfig.tsx @@ -7,7 +7,7 @@ import ExploreWrapper from '@sage-bionetworks/synapse-portal-framework/component import Header from '@sage-bionetworks/synapse-portal-framework/components/Header' import { SectionLayout } from '@sage-bionetworks/synapse-portal-framework/components/SectionLayout' import sharedRoutes from '@sage-bionetworks/synapse-portal-framework/shared-config/sharedRoutes' -import { RouteObject } from 'react-router-dom' +import { RouteObject } from 'react-router' import { Programs, RssFeedCards, ThemesPlot } from 'synapse-react-client' import DatasetsDetailsPage from '../pages/DatasetsDetailsPage' import EducationalResourcesDetailsPage from '../pages/EducationalResourcesDetailsPage' diff --git a/apps/portals/challengeportal/package.json b/apps/portals/challengeportal/package.json index 4076c6f30a0..95cb420eac2 100644 --- a/apps/portals/challengeportal/package.json +++ b/apps/portals/challengeportal/package.json @@ -10,7 +10,7 @@ "katex": "^0.16.10", "react": "^18.2.0", "react-dom": "^18.2.0", - "react-router-dom": "^6.28.1", + "react-router": "^7.1.1", "synapse-react-client": "workspace:*", "vite": "^5.4.3" }, diff --git a/apps/portals/challengeportal/src/config/pages/ChallengeDetailsPage.tsx b/apps/portals/challengeportal/src/config/pages/ChallengeDetailsPage.tsx index f955566c67e..360b165f430 100644 --- a/apps/portals/challengeportal/src/config/pages/ChallengeDetailsPage.tsx +++ b/apps/portals/challengeportal/src/config/pages/ChallengeDetailsPage.tsx @@ -17,7 +17,7 @@ import { ColumnSingleValueFilterOperator, EntityType, } from '@sage-bionetworks/synapse-types' -import { RouteObject } from 'react-router-dom' +import { RouteObject } from 'react-router' import { CardConfiguration, CardContainerLogic, diff --git a/apps/portals/challengeportal/src/config/routesConfig.tsx b/apps/portals/challengeportal/src/config/routesConfig.tsx index b7c934e73db..47c1c9ba71b 100644 --- a/apps/portals/challengeportal/src/config/routesConfig.tsx +++ b/apps/portals/challengeportal/src/config/routesConfig.tsx @@ -3,7 +3,8 @@ import Header from '@sage-bionetworks/synapse-portal-framework/components/Header import { SectionLayout } from '@sage-bionetworks/synapse-portal-framework/components/SectionLayout' import TabbedSynapseObjects from '@sage-bionetworks/synapse-portal-framework/components/TabbedSynapseObjects' import sharedRoutes from '@sage-bionetworks/synapse-portal-framework/shared-config/sharedRoutes' -import { RouteObject } from 'react-router-dom' +import { RouteObject } from 'react-router' +import { CardContainerLogic } from 'synapse-react-client' import { challengeCardConfiguration, ChallengeDetailsPage, @@ -11,7 +12,6 @@ import { challengeTitleLinkConfig, } from './pages/ChallengeDetailsPage' import { challengeProjectsSql } from './resources' -import { CardContainerLogic } from 'synapse-react-client' const routes: RouteObject[] = [ { diff --git a/apps/portals/digitalhealth/package.json b/apps/portals/digitalhealth/package.json index fc0f367a046..44ab1920e8f 100644 --- a/apps/portals/digitalhealth/package.json +++ b/apps/portals/digitalhealth/package.json @@ -10,7 +10,7 @@ "pluralize": "^8.0.0", "react": "^18.2.0", "react-dom": "^18.2.0", - "react-router-dom": "^6.28.1", + "react-router": "^7.1.1", "synapse-react-client": "workspace:*", "vite": "^5.4.3" }, diff --git a/apps/portals/digitalhealth/src/config/explorePageRoutes.tsx b/apps/portals/digitalhealth/src/config/explorePageRoutes.tsx index 8096af59250..ffb0dec8b7a 100644 --- a/apps/portals/digitalhealth/src/config/explorePageRoutes.tsx +++ b/apps/portals/digitalhealth/src/config/explorePageRoutes.tsx @@ -1,4 +1,4 @@ -import { RouteObject } from 'react-router-dom' +import { RouteObject } from 'react-router' import { QueryWrapperPlotNav } from 'synapse-react-client' import { dataQueryWrapperPlotNavProps, diff --git a/apps/portals/digitalhealth/src/config/routesConfig.tsx b/apps/portals/digitalhealth/src/config/routesConfig.tsx index 573a9f99baf..1d2dcb0c059 100644 --- a/apps/portals/digitalhealth/src/config/routesConfig.tsx +++ b/apps/portals/digitalhealth/src/config/routesConfig.tsx @@ -2,7 +2,7 @@ import App from '@sage-bionetworks/synapse-portal-framework/App' import ExploreWrapper from '@sage-bionetworks/synapse-portal-framework/components/Explore/ExploreWrapper' import { SectionLayout } from '@sage-bionetworks/synapse-portal-framework/components/SectionLayout' import sharedRoutes from '@sage-bionetworks/synapse-portal-framework/shared-config/sharedRoutes' -import { RouteObject } from 'react-router-dom' +import { RouteObject } from 'react-router' import CollectionsDetailsPage from 'src/pages/CollectionsDetailsPage' import { MarkdownSynapse } from 'synapse-react-client' import HomePage from '../pages/HomePage' diff --git a/apps/portals/elportal/package.json b/apps/portals/elportal/package.json index 9630a989fca..dd15012b9f6 100644 --- a/apps/portals/elportal/package.json +++ b/apps/portals/elportal/package.json @@ -13,7 +13,7 @@ "pluralize": "^8.0.0", "react": "^18.2.0", "react-dom": "^18.2.0", - "react-router-dom": "^6.28.1", + "react-router": "^7.1.1", "synapse-react-client": "workspace:*", "vite": "^5.4.3" }, diff --git a/apps/portals/elportal/src/config/routesConfig.tsx b/apps/portals/elportal/src/config/routesConfig.tsx index 3738b054cd6..9eb24259621 100644 --- a/apps/portals/elportal/src/config/routesConfig.tsx +++ b/apps/portals/elportal/src/config/routesConfig.tsx @@ -4,7 +4,8 @@ import ELBrowseToolsPage from '@sage-bionetworks/synapse-portal-framework/compon import ExploreWrapper from '@sage-bionetworks/synapse-portal-framework/components/Explore/ExploreWrapper' import { SectionLayout } from '@sage-bionetworks/synapse-portal-framework/components/SectionLayout' import sharedRoutes from '@sage-bionetworks/synapse-portal-framework/shared-config/sharedRoutes' -import { RouteObject } from 'react-router-dom' +import { RouteObject } from 'react-router' +import { HomePageThemeProvider } from 'src/themes/HomePageThemeProvider' import { Markdown } from 'synapse-react-client' import HomePage from '../pages/HomePage' import HomePageV2 from '../pages/HomePageV2' @@ -14,7 +15,6 @@ import StudyDetailsPage, { } from '../pages/StudyDetailsPage' import explorePageRoutes from './explorePageRoutes' import { computationalSql } from './resources' -import { HomePageThemeProvider } from 'src/themes/HomePageThemeProvider' const routes: RouteObject[] = [ { diff --git a/apps/portals/elportal/src/pages/StudyDetailsPage.tsx b/apps/portals/elportal/src/pages/StudyDetailsPage.tsx index d31225af84c..80a2162806a 100644 --- a/apps/portals/elportal/src/pages/StudyDetailsPage.tsx +++ b/apps/portals/elportal/src/pages/StudyDetailsPage.tsx @@ -6,11 +6,11 @@ import { } from '@sage-bionetworks/synapse-portal-framework/components/DetailsPage/DetailsPageTabs' import DetailsPage from '@sage-bionetworks/synapse-portal-framework/components/DetailsPage/index' import { MarkdownSynapseFromColumnData } from '@sage-bionetworks/synapse-portal-framework/components/DetailsPage/markdown/MarkdownSynapseFromColumnData' -import RedirectWithQuery from '@sage-bionetworks/synapse-portal-framework/components/RedirectWithQuery' import RedirectToURL from '@sage-bionetworks/synapse-portal-framework/components/RedirectToURL' +import RedirectWithQuery from '@sage-bionetworks/synapse-portal-framework/components/RedirectWithQuery' import { useGetPortalComponentSearchParams } from '@sage-bionetworks/synapse-portal-framework/utils/UseGetPortalComponentSearchParams' import { ColumnSingleValueFilterOperator } from '@sage-bionetworks/synapse-types' -import { Outlet, RouteObject } from 'react-router-dom' +import { Outlet, RouteObject } from 'react-router' import { CardContainerLogic, QueryWrapperPlotNav } from 'synapse-react-client' import { cavaticaConnectAccountURL, diff --git a/apps/portals/genie/package.json b/apps/portals/genie/package.json index 741d4e0b297..81308648397 100644 --- a/apps/portals/genie/package.json +++ b/apps/portals/genie/package.json @@ -9,7 +9,7 @@ "katex": "^0.16.10", "react": "^18.2.0", "react-dom": "^18.2.0", - "react-router-dom": "^6.28.1", + "react-router": "^7.1.1", "synapse-react-client": "workspace:*", "vite": "^5.4.3" }, diff --git a/apps/portals/genie/src/config/explorePageRoutes.tsx b/apps/portals/genie/src/config/explorePageRoutes.tsx index 500c9ed306b..d8bb8d0963d 100644 --- a/apps/portals/genie/src/config/explorePageRoutes.tsx +++ b/apps/portals/genie/src/config/explorePageRoutes.tsx @@ -1,4 +1,4 @@ -import { RouteObject } from 'react-router-dom' +import { RouteObject } from 'react-router' import { CardContainerLogic, QueryWrapperPlotNav } from 'synapse-react-client' import { contributorsQueryWrapperPlotNavProps, diff --git a/apps/portals/genie/src/config/routesConfig.tsx b/apps/portals/genie/src/config/routesConfig.tsx index a2711d44522..e90fd400558 100644 --- a/apps/portals/genie/src/config/routesConfig.tsx +++ b/apps/portals/genie/src/config/routesConfig.tsx @@ -4,7 +4,7 @@ import ExploreWrapper from '@sage-bionetworks/synapse-portal-framework/component import { SectionLayout } from '@sage-bionetworks/synapse-portal-framework/components/SectionLayout' import SurveyToast from '@sage-bionetworks/synapse-portal-framework/components/SurveyToast' import sharedRoutes from '@sage-bionetworks/synapse-portal-framework/shared-config/sharedRoutes' -import { RouteObject } from 'react-router-dom' +import { RouteObject } from 'react-router' import { CardContainerLogic, Markdown, diff --git a/apps/portals/nf/package.json b/apps/portals/nf/package.json index 152f421b75d..67954ea0260 100644 --- a/apps/portals/nf/package.json +++ b/apps/portals/nf/package.json @@ -12,7 +12,7 @@ "pluralize": "^8.0.0", "react": "^18.2.0", "react-dom": "^18.2.0", - "react-router-dom": "^6.28.1", + "react-router": "^7.1.1", "synapse-react-client": "workspace:*", "vite": "^5.4.3" }, diff --git a/apps/portals/nf/src/config/routesConfig.tsx b/apps/portals/nf/src/config/routesConfig.tsx index bcfb2ab5072..a8bf11b0458 100644 --- a/apps/portals/nf/src/config/routesConfig.tsx +++ b/apps/portals/nf/src/config/routesConfig.tsx @@ -6,7 +6,7 @@ import { SectionLayout } from '@sage-bionetworks/synapse-portal-framework/compon import SurveyToast from '@sage-bionetworks/synapse-portal-framework/components/SurveyToast' import sharedRoutes from '@sage-bionetworks/synapse-portal-framework/shared-config/sharedRoutes' import { sharePageLinkExplorePageButtonProps } from '@sage-bionetworks/synapse-portal-framework/shared-config/SharePageLinkButtonConfig' -import { RouteObject } from 'react-router-dom' +import { RouteObject } from 'react-router' import DatasetDetailsPage from 'src/pages/DatasetDetailsPage' import { hackathonDetailsPageRoutesConfig } from 'src/pages/HackathonDetailsPage/HackathonDetailsPage' import { organizationsDetailsPageRoute } from 'src/pages/OrganizationDetailsPage/OrganizationDetailsPage' diff --git a/apps/portals/nf/src/pages/HackathonDetailsPage/HackathonDetailsPage.tsx b/apps/portals/nf/src/pages/HackathonDetailsPage/HackathonDetailsPage.tsx index 4ee1174dff7..ae4378eab3e 100644 --- a/apps/portals/nf/src/pages/HackathonDetailsPage/HackathonDetailsPage.tsx +++ b/apps/portals/nf/src/pages/HackathonDetailsPage/HackathonDetailsPage.tsx @@ -6,7 +6,7 @@ import { import RedirectWithQuery from '@sage-bionetworks/synapse-portal-framework/components/RedirectWithQuery' import { useGetPortalComponentSearchParams } from '@sage-bionetworks/synapse-portal-framework/utils/UseGetPortalComponentSearchParams' import { ColumnSingleValueFilterOperator } from '@sage-bionetworks/synapse-types' -import { Outlet } from 'react-router-dom' +import { Outlet } from 'react-router' import { hackathonsSql } from 'src/config/resources' import { columnAliases } from 'src/config/synapseConfigs/commonProps' import { hackathonCardConfiguration } from 'src/config/synapseConfigs/hackathons' diff --git a/apps/portals/nf/src/pages/OrganizationDetailsPage/OrganizationDetailsPage.tsx b/apps/portals/nf/src/pages/OrganizationDetailsPage/OrganizationDetailsPage.tsx index afde03c6920..d6155c9a0f1 100644 --- a/apps/portals/nf/src/pages/OrganizationDetailsPage/OrganizationDetailsPage.tsx +++ b/apps/portals/nf/src/pages/OrganizationDetailsPage/OrganizationDetailsPage.tsx @@ -5,12 +5,12 @@ import { } from '@sage-bionetworks/synapse-portal-framework/components/DetailsPage/DetailsPageTabs' import RedirectWithQuery from '@sage-bionetworks/synapse-portal-framework/components/RedirectWithQuery' import { useGetPortalComponentSearchParams } from '@sage-bionetworks/synapse-portal-framework/utils/UseGetPortalComponentSearchParams' -import { Outlet, RouteObject } from 'react-router-dom' +import { Outlet, RouteObject } from 'react-router' import { fundersSql } from 'src/config/resources' import { organizationCardSchema } from 'src/config/synapseConfigs/organizations' import { CardContainerLogic, SynapseConstants } from 'synapse-react-client' -import OrganizationDetailsTab from './OrganizationDetailsTab' import OrganizationDataTab from './OrganizationDataTab' +import OrganizationDetailsTab from './OrganizationDetailsTab' const tabConfig: DetailsPageTabConfig[] = [ { diff --git a/apps/portals/nf/src/pages/StudyDetailsPage/StudyDetailsPage.tsx b/apps/portals/nf/src/pages/StudyDetailsPage/StudyDetailsPage.tsx index 42afedca2e6..50a6ce4b2f2 100644 --- a/apps/portals/nf/src/pages/StudyDetailsPage/StudyDetailsPage.tsx +++ b/apps/portals/nf/src/pages/StudyDetailsPage/StudyDetailsPage.tsx @@ -7,7 +7,7 @@ import RedirectWithQuery from '@sage-bionetworks/synapse-portal-framework/compon import { sharePageLinkButtonDetailPageProps } from '@sage-bionetworks/synapse-portal-framework/shared-config/SharePageLinkButtonConfig' import { useGetPortalComponentSearchParams } from '@sage-bionetworks/synapse-portal-framework/utils/UseGetPortalComponentSearchParams' import { ColumnSingleValueFilterOperator } from '@sage-bionetworks/synapse-types' -import { Outlet, RouteObject } from 'react-router-dom' +import { Outlet, RouteObject } from 'react-router' import { CardContainerLogic, ErrorPage, diff --git a/apps/portals/nf/src/pages/ToolDetailsPage/ToolDetailsPage.tsx b/apps/portals/nf/src/pages/ToolDetailsPage/ToolDetailsPage.tsx index fa140cd06a9..2bf605aaf58 100644 --- a/apps/portals/nf/src/pages/ToolDetailsPage/ToolDetailsPage.tsx +++ b/apps/portals/nf/src/pages/ToolDetailsPage/ToolDetailsPage.tsx @@ -7,7 +7,7 @@ import RedirectWithQuery from '@sage-bionetworks/synapse-portal-framework/compon import { sharePageLinkButtonDetailPageProps } from '@sage-bionetworks/synapse-portal-framework/shared-config/SharePageLinkButtonConfig' import { useGetPortalComponentSearchParams } from '@sage-bionetworks/synapse-portal-framework/utils/UseGetPortalComponentSearchParams' import { ColumnSingleValueFilterOperator } from '@sage-bionetworks/synapse-types' -import { Outlet, RouteObject } from 'react-router-dom' +import { Outlet, RouteObject } from 'react-router' import { toolsSql } from 'src/config/resources' import { toolsSchema } from 'src/config/synapseConfigs/tools' import { diff --git a/apps/portals/nf/src/pages/ToolDetailsPage/ToolDetailsPageDataTab.tsx b/apps/portals/nf/src/pages/ToolDetailsPage/ToolDetailsPageDataTab.tsx index ed0cccdded3..8cf8806483a 100644 --- a/apps/portals/nf/src/pages/ToolDetailsPage/ToolDetailsPageDataTab.tsx +++ b/apps/portals/nf/src/pages/ToolDetailsPage/ToolDetailsPageDataTab.tsx @@ -2,7 +2,7 @@ import { DetailsPageContent } from '@sage-bionetworks/synapse-portal-framework/c import { useDetailsPageContext } from '@sage-bionetworks/synapse-portal-framework/components/DetailsPage/DetailsPageContext' import { DetailsPageTabs } from '@sage-bionetworks/synapse-portal-framework/components/DetailsPage/DetailsPageTabs' import { ColumnMultiValueFunction } from '@sage-bionetworks/synapse-types' -import { Outlet, RouteObject } from 'react-router-dom' +import { Outlet, RouteObject } from 'react-router' import { filesSql, studiesSql } from 'src/config/resources' import { columnAliases } from 'src/config/synapseConfigs/commonProps' import { datasetsRgbIndex } from 'src/config/synapseConfigs/datasets' diff --git a/apps/portals/stopadportal/package.json b/apps/portals/stopadportal/package.json index b44fb2d80cd..4cd648bb2e6 100644 --- a/apps/portals/stopadportal/package.json +++ b/apps/portals/stopadportal/package.json @@ -10,7 +10,7 @@ "pluralize": "^8.0.0", "react": "^18.2.0", "react-dom": "^18.2.0", - "react-router-dom": "^6.28.1", + "react-router": "^7.1.1", "synapse-react-client": "workspace:*", "vite": "^5.4.3" }, diff --git a/apps/portals/stopadportal/src/config/routesConfig.tsx b/apps/portals/stopadportal/src/config/routesConfig.tsx index 7a8cba0e828..4073a1fa9e2 100644 --- a/apps/portals/stopadportal/src/config/routesConfig.tsx +++ b/apps/portals/stopadportal/src/config/routesConfig.tsx @@ -1,7 +1,7 @@ import App from '@sage-bionetworks/synapse-portal-framework/App' import Header from '@sage-bionetworks/synapse-portal-framework/components/Header' import { SectionLayout } from '@sage-bionetworks/synapse-portal-framework/components/SectionLayout' -import { RouteObject } from 'react-router-dom' +import { RouteObject } from 'react-router' import { Markdown, SynapseFormSubmissionGrid, diff --git a/apps/synapse-oauth-signin/package.json b/apps/synapse-oauth-signin/package.json index 63d6b71aada..8199976026e 100644 --- a/apps/synapse-oauth-signin/package.json +++ b/apps/synapse-oauth-signin/package.json @@ -18,7 +18,7 @@ "react-bootstrap": "^1.6.8", "react-cookie": "4.0.0", "react-dom": "^18.2.0", - "react-router-dom": "^6.28.1", + "react-router": "^7.1.1", "sass": "^1.71.1", "synapse-react-client": "workspace:*", "universal-cookie": "^4.0.4" diff --git a/apps/synapse-oauth-signin/src/App.tsx b/apps/synapse-oauth-signin/src/App.tsx index 056a31186a0..ceea2117e03 100644 --- a/apps/synapse-oauth-signin/src/App.tsx +++ b/apps/synapse-oauth-signin/src/App.tsx @@ -1,7 +1,7 @@ import { ThemeProvider } from '@mui/material' import { createTheme, StyledEngineProvider } from '@mui/material/styles' import { QueryClient, QueryClientProvider } from '@tanstack/react-query' -import { Outlet } from 'react-router-dom' +import { Outlet } from 'react-router' import { defaultQueryClientConfig, SynapseErrorBoundary, diff --git a/apps/synapse-oauth-signin/src/AppInitializer.tsx b/apps/synapse-oauth-signin/src/AppInitializer.tsx index 21f72a084b7..f77203f6741 100644 --- a/apps/synapse-oauth-signin/src/AppInitializer.tsx +++ b/apps/synapse-oauth-signin/src/AppInitializer.tsx @@ -1,13 +1,13 @@ -import { useSearchParams } from 'react-router-dom' -import { OAuthClientError } from './OAuthClientError' import { PropsWithChildren, useCallback, useEffect } from 'react' +import { useSearchParams } from 'react-router' import { ApplicationSessionManager, - useFramebuster, SynapseConstants, + useFramebuster, } from 'synapse-react-client' -import { handleErrorRedirect } from './URLUtils' import UniversalCookies from 'universal-cookie' +import { OAuthClientError } from './OAuthClientError' +import { handleErrorRedirect } from './URLUtils' const cookies = new UniversalCookies() function AppInitializer(props: PropsWithChildren>) { diff --git a/apps/synapse-oauth-signin/src/LoginComponent.tsx b/apps/synapse-oauth-signin/src/LoginComponent.tsx index 7e10b46b303..dcef77521f2 100644 --- a/apps/synapse-oauth-signin/src/LoginComponent.tsx +++ b/apps/synapse-oauth-signin/src/LoginComponent.tsx @@ -1,5 +1,5 @@ import { useEffect } from 'react' -import { useSearchParams } from 'react-router-dom' +import { useSearchParams } from 'react-router' import { SynapseClient, useSynapseContext } from 'synapse-react-client' export function LoginComponent() { diff --git a/apps/synapse-oauth-signin/src/OAuth2Form.tsx b/apps/synapse-oauth-signin/src/OAuth2Form.tsx index 0c9c9e5a7cc..4c5a72b97c6 100644 --- a/apps/synapse-oauth-signin/src/OAuth2Form.tsx +++ b/apps/synapse-oauth-signin/src/OAuth2Form.tsx @@ -11,7 +11,7 @@ import { OIDCAuthorizationRequest, } from '@sage-bionetworks/synapse-types' import { useCallback, useEffect, useMemo, useState } from 'react' -import { useSearchParams } from 'react-router-dom' +import { useSearchParams } from 'react-router' import { AppUtils, FullWidthAlert, diff --git a/apps/synapse-oauth-signin/src/index.tsx b/apps/synapse-oauth-signin/src/index.tsx index fd064b4c94b..6b108982484 100644 --- a/apps/synapse-oauth-signin/src/index.tsx +++ b/apps/synapse-oauth-signin/src/index.tsx @@ -1,6 +1,7 @@ import { StrictMode } from 'react' import { createRoot } from 'react-dom/client' -import { createBrowserRouter, RouterProvider } from 'react-router-dom' +import { createBrowserRouter } from 'react-router' +import { RouterProvider } from 'react-router/dom' import { getRoutes } from './routes' import * as serviceWorker from './serviceWorker' @@ -9,24 +10,11 @@ import 'katex/dist/katex.css' const container = document.getElementById('rootPanel') const root = createRoot(container!) -const router = createBrowserRouter(getRoutes(), { - future: { - v7_relativeSplatPath: true, - v7_fetcherPersist: true, - v7_normalizeFormMethod: true, - v7_partialHydration: true, - v7_skipActionErrorRevalidation: true, - }, -}) +const router = createBrowserRouter(getRoutes()) root.render( - + , ) diff --git a/apps/synapse-oauth-signin/src/test/App.test.tsx b/apps/synapse-oauth-signin/src/test/App.test.tsx index 6c3c73a3e39..e381ba56bf6 100644 --- a/apps/synapse-oauth-signin/src/test/App.test.tsx +++ b/apps/synapse-oauth-signin/src/test/App.test.tsx @@ -9,7 +9,7 @@ import { } from '@testing-library/react' import userEvent from '@testing-library/user-event' import { rest } from 'msw' -import { createMemoryRouter, RouterProvider } from 'react-router-dom' +import { createMemoryRouter, RouterProvider } from 'react-router' import { defaultQueryClientConfig, SynapseConstants, diff --git a/apps/synapse-portal-framework/package.json b/apps/synapse-portal-framework/package.json index a3474db2a6e..f02c3870bdb 100644 --- a/apps/synapse-portal-framework/package.json +++ b/apps/synapse-portal-framework/package.json @@ -21,7 +21,7 @@ "react-bootstrap": "^1.6.8", "react-cookie": "4.0.0", "react-plotly.js": "^2.6.0", - "react-router-dom": "^6.28.1", + "react-router": "^7.1.1", "react-spinners": "^0.13.8", "react-switch": "^7.0.0", "sass": "^1.71.1", diff --git a/apps/synapse-portal-framework/src/App.tsx b/apps/synapse-portal-framework/src/App.tsx index c859cbc83bf..8552e7edbee 100644 --- a/apps/synapse-portal-framework/src/App.tsx +++ b/apps/synapse-portal-framework/src/App.tsx @@ -1,5 +1,5 @@ import { PropsWithChildren } from 'react' -import { Outlet } from 'react-router-dom' +import { Outlet } from 'react-router' import { CookiesNotification, SynapseToastContainer, diff --git a/apps/synapse-portal-framework/src/Portal.tsx b/apps/synapse-portal-framework/src/Portal.tsx index 56148edd83c..498791f62b0 100644 --- a/apps/synapse-portal-framework/src/Portal.tsx +++ b/apps/synapse-portal-framework/src/Portal.tsx @@ -2,7 +2,8 @@ import { createTheme, ThemeProvider } from '@mui/material' import { QueryClient, QueryClientProvider } from '@tanstack/react-query' import { useMemo } from 'react' import { CookiesProvider } from 'react-cookie' -import { createBrowserRouter, RouterProvider } from 'react-router-dom' +import { createBrowserRouter } from 'react-router' +import { RouterProvider } from 'react-router/dom' import { defaultQueryClientConfig, SynapseTheme } from 'synapse-react-client' import { PortalContextProvider } from './components/PortalContext' import { PortalProps } from './components/PortalProps' @@ -11,15 +12,7 @@ const queryClient = new QueryClient(defaultQueryClientConfig) function Portal(props: PortalProps) { const { palette, ...context } = props - const router = createBrowserRouter(props.routeConfig, { - future: { - v7_relativeSplatPath: true, - v7_fetcherPersist: true, - v7_normalizeFormMethod: true, - v7_partialHydration: true, - v7_skipActionErrorRevalidation: true, - }, - }) + const router = createBrowserRouter(props.routeConfig) const theme = useMemo( () => createTheme(SynapseTheme.mergeTheme({ palette })), [palette], @@ -30,12 +23,7 @@ function Portal(props: PortalProps) { - + diff --git a/apps/synapse-portal-framework/src/components/DetailsPage/DetailsPage.tsx b/apps/synapse-portal-framework/src/components/DetailsPage/DetailsPage.tsx index df6daa1b30c..1426cf0757b 100644 --- a/apps/synapse-portal-framework/src/components/DetailsPage/DetailsPage.tsx +++ b/apps/synapse-portal-framework/src/components/DetailsPage/DetailsPage.tsx @@ -9,7 +9,7 @@ import { import { QueryBundleRequest } from '@sage-bionetworks/synapse-types' import pluralize from 'pluralize' import { useMemo } from 'react' -import { Outlet, useLocation } from 'react-router-dom' +import { Outlet, useLocation } from 'react-router' import { BarLoader } from 'react-spinners' import { SynapseConstants, diff --git a/apps/synapse-portal-framework/src/components/DetailsPage/DetailsPageContentLayout.tsx b/apps/synapse-portal-framework/src/components/DetailsPage/DetailsPageContentLayout.tsx index 017ed7cd185..b0b686a6116 100644 --- a/apps/synapse-portal-framework/src/components/DetailsPage/DetailsPageContentLayout.tsx +++ b/apps/synapse-portal-framework/src/components/DetailsPage/DetailsPageContentLayout.tsx @@ -1,4 +1,4 @@ -import { useLocation, useNavigate } from 'react-router-dom' +import { useLocation, useNavigate } from 'react-router' import { scrollToWithOffset } from '../../utils' import { DetailsPageSectionLayout, diff --git a/apps/synapse-portal-framework/src/components/DetailsPage/DetailsPageDocumentMetadata.tsx b/apps/synapse-portal-framework/src/components/DetailsPage/DetailsPageDocumentMetadata.tsx index 98e6df43eb1..e756d7a7d6c 100644 --- a/apps/synapse-portal-framework/src/components/DetailsPage/DetailsPageDocumentMetadata.tsx +++ b/apps/synapse-portal-framework/src/components/DetailsPage/DetailsPageDocumentMetadata.tsx @@ -1,5 +1,5 @@ import { Row, RowSet } from '@sage-bionetworks/synapse-types' -import { useLocation } from 'react-router-dom' +import { useLocation } from 'react-router' import { getColumnIndex } from 'synapse-react-client' import { useSetCanonicalUrl } from '../../utils/useSetCanonicalUrl' import { useDetailsPageContext } from './DetailsPageContext' diff --git a/apps/synapse-portal-framework/src/components/DetailsPage/DetailsPageTabs.tsx b/apps/synapse-portal-framework/src/components/DetailsPage/DetailsPageTabs.tsx index d7527cf2911..659aa624879 100644 --- a/apps/synapse-portal-framework/src/components/DetailsPage/DetailsPageTabs.tsx +++ b/apps/synapse-portal-framework/src/components/DetailsPage/DetailsPageTabs.tsx @@ -1,5 +1,5 @@ import { Tooltip } from '@mui/material' -import { NavLink, useLocation } from 'react-router-dom' +import { NavLink, useLocation } from 'react-router' import { SynapseComponents } from 'synapse-react-client' import { useDetailsPageContext } from './DetailsPageContext' diff --git a/apps/synapse-portal-framework/src/components/DetailsPage/utils.ts b/apps/synapse-portal-framework/src/components/DetailsPage/utils.ts index d4b4b8d1087..902b15d1ca6 100644 --- a/apps/synapse-portal-framework/src/components/DetailsPage/utils.ts +++ b/apps/synapse-portal-framework/src/components/DetailsPage/utils.ts @@ -1,5 +1,5 @@ -import { useRef, useEffect } from 'react' -import { useLocation } from 'react-router-dom' +import { useEffect, useRef } from 'react' +import { useLocation } from 'react-router' import { scrollToWithOffset } from '../../utils' export function useScrollOnMount() { diff --git a/apps/synapse-portal-framework/src/components/Explore/ExploreWrapper.test.tsx b/apps/synapse-portal-framework/src/components/Explore/ExploreWrapper.test.tsx index 17bf395d7f5..4a5adf9dada 100644 --- a/apps/synapse-portal-framework/src/components/Explore/ExploreWrapper.test.tsx +++ b/apps/synapse-portal-framework/src/components/Explore/ExploreWrapper.test.tsx @@ -1,8 +1,8 @@ import { render, screen } from '@testing-library/react' +import { createMemoryRouter, RouterProvider } from 'react-router' import { describe, expect, it } from 'vitest' import ExploreWrapper from './ExploreWrapper' import { ExploreWrapperProps } from './ExploreWrapperProps' -import { createMemoryRouter, RouterProvider } from 'react-router-dom' describe('ExploreWrapper', () => { const props = { diff --git a/apps/synapse-portal-framework/src/components/Explore/ExploreWrapper.tsx b/apps/synapse-portal-framework/src/components/Explore/ExploreWrapper.tsx index 0c239143c90..bb7996f0dd8 100644 --- a/apps/synapse-portal-framework/src/components/Explore/ExploreWrapper.tsx +++ b/apps/synapse-portal-framework/src/components/Explore/ExploreWrapper.tsx @@ -1,7 +1,7 @@ import { ArrowDropDown, ArrowDropUp } from '@mui/icons-material' import { Box, Typography, useMediaQuery, useTheme } from '@mui/material' import { useEffect, useState } from 'react' -import { Outlet, useLocation, useMatch } from 'react-router-dom' +import { Outlet, useLocation, useMatch } from 'react-router' import { OrientationBanner } from 'synapse-react-client' import { NEGATIVE_RESPONSIVE_SIDE_MARGIN, diff --git a/apps/synapse-portal-framework/src/components/Explore/ExploreWrapperProps.ts b/apps/synapse-portal-framework/src/components/Explore/ExploreWrapperProps.ts index fe3b154f0d1..bab677b5aa5 100644 --- a/apps/synapse-portal-framework/src/components/Explore/ExploreWrapperProps.ts +++ b/apps/synapse-portal-framework/src/components/Explore/ExploreWrapperProps.ts @@ -1,4 +1,4 @@ -import { RouteObject } from 'react-router-dom' +import { RouteObject } from 'react-router' import { OrientationBannerProps } from 'synapse-react-client' export type ExplorePageRoute = RouteObject & { diff --git a/apps/synapse-portal-framework/src/components/Explore/ExploreWrapperTabs.tsx b/apps/synapse-portal-framework/src/components/Explore/ExploreWrapperTabs.tsx index 0b8f28e92b2..b54b206db2a 100644 --- a/apps/synapse-portal-framework/src/components/Explore/ExploreWrapperTabs.tsx +++ b/apps/synapse-portal-framework/src/components/Explore/ExploreWrapperTabs.tsx @@ -6,7 +6,7 @@ import { useMediaQuery, useTheme, } from '@mui/material' -import { useLocation, useNavigate } from 'react-router-dom' +import { useLocation, useNavigate } from 'react-router' import { ExploreWrapperProps } from './ExploreWrapperProps' function CustomScrollButton(props: TabScrollButtonProps) { @@ -64,7 +64,9 @@ export function ExploreWrapperTabs(props: ExploreWrapperProps) { key={path} value={encodeURI(path)} label={displayName} - onClick={() => navigate(path)} + onClick={() => { + void navigate(path) + }} sx={{ transition: 'all 400ms', fontSize: '16px', diff --git a/apps/synapse-portal-framework/src/components/NavLink.tsx b/apps/synapse-portal-framework/src/components/NavLink.tsx index 60257f65759..f8d5f65fab6 100644 --- a/apps/synapse-portal-framework/src/components/NavLink.tsx +++ b/apps/synapse-portal-framework/src/components/NavLink.tsx @@ -1,6 +1,6 @@ import { Link as MuiLink } from '@mui/material' import { CSSProperties, ReactNode } from 'react' -import { NavLink as ReactRouterNavLink } from 'react-router-dom' +import { NavLink as ReactRouterNavLink } from 'react-router' /* diff --git a/apps/synapse-portal-framework/src/components/PortalContext.tsx b/apps/synapse-portal-framework/src/components/PortalContext.tsx index f31c1b33163..25c7288c13b 100644 --- a/apps/synapse-portal-framework/src/components/PortalContext.tsx +++ b/apps/synapse-portal-framework/src/components/PortalContext.tsx @@ -1,5 +1,5 @@ import { createContext, PropsWithChildren, useContext } from 'react' -import { RouteObject } from 'react-router-dom' +import { RouteObject } from 'react-router' import { FooterConfig, HomePageHeaderConfig, diff --git a/apps/synapse-portal-framework/src/components/ProjectDiscussionForum.tsx b/apps/synapse-portal-framework/src/components/ProjectDiscussionForum.tsx index 3cb28d51b5a..d437a623703 100644 --- a/apps/synapse-portal-framework/src/components/ProjectDiscussionForum.tsx +++ b/apps/synapse-portal-framework/src/components/ProjectDiscussionForum.tsx @@ -1,12 +1,12 @@ +import ArrowBackIcon from '@mui/icons-material/ArrowBack' +import { Box, IconButton } from '@mui/material' +import { useLocation, useNavigate } from 'react-router' import { - SynapseQueries, DiscussionThread, ForumPage, + SynapseQueries, SynapseUtilityFunctions, } from 'synapse-react-client' -import ArrowBackIcon from '@mui/icons-material/ArrowBack' -import { useNavigate, useLocation } from 'react-router-dom' -import { Box, IconButton } from '@mui/material' const ProjectDiscussionForum = () => { const urlSearchParams = new URLSearchParams(window.location.search) diff --git a/apps/synapse-portal-framework/src/components/RedirectToURL.tsx b/apps/synapse-portal-framework/src/components/RedirectToURL.tsx index d8a64321d25..956cacae3b5 100644 --- a/apps/synapse-portal-framework/src/components/RedirectToURL.tsx +++ b/apps/synapse-portal-framework/src/components/RedirectToURL.tsx @@ -1,4 +1,4 @@ -import { useLocation } from 'react-router-dom' +import { useLocation } from 'react-router' export type RedirectToURLProps = { toURL: string diff --git a/apps/synapse-portal-framework/src/components/RedirectWithQuery.tsx b/apps/synapse-portal-framework/src/components/RedirectWithQuery.tsx index a5559ff851b..c20b2b19323 100644 --- a/apps/synapse-portal-framework/src/components/RedirectWithQuery.tsx +++ b/apps/synapse-portal-framework/src/components/RedirectWithQuery.tsx @@ -1,4 +1,4 @@ -import { Navigate, NavigateProps, useLocation } from 'react-router-dom' +import { Navigate, NavigateProps, useLocation } from 'react-router' /** * Allows us to use react-router's Redirect as a portal component without losing the query params. diff --git a/apps/synapse-portal-framework/src/components/SectionLayout.tsx b/apps/synapse-portal-framework/src/components/SectionLayout.tsx index 370c9460e06..3ee5907f9b2 100644 --- a/apps/synapse-portal-framework/src/components/SectionLayout.tsx +++ b/apps/synapse-portal-framework/src/components/SectionLayout.tsx @@ -1,6 +1,6 @@ import { Box, Container, ContainerProps } from '@mui/material' import { PropsWithChildren, useRef } from 'react' -import { useLocation } from 'react-router-dom' +import { useLocation } from 'react-router' import { HelpPopover } from 'synapse-react-client' import { scrollToWithOffset } from '../utils' diff --git a/apps/synapse-portal-framework/src/components/csbc-home-page/HomePageLinks.tsx b/apps/synapse-portal-framework/src/components/csbc-home-page/HomePageLinks.tsx index d1c18d3b398..400925eb807 100644 --- a/apps/synapse-portal-framework/src/components/csbc-home-page/HomePageLinks.tsx +++ b/apps/synapse-portal-framework/src/components/csbc-home-page/HomePageLinks.tsx @@ -1,5 +1,5 @@ import { ComponentType, SVGProps } from 'react' -import { Link } from 'react-router-dom' +import { Link } from 'react-router' import { ReactComponent as DataIconSvg } from './assets/data-icon.svg' import { ReactComponent as InsightIconSvg } from './assets/insight-icon.svg' import { ReactComponent as MethodsIconSvg } from './assets/methods-icon.svg' diff --git a/apps/synapse-portal-framework/src/components/index.ts b/apps/synapse-portal-framework/src/components/index.ts index b8672a045c9..21b334bb431 100644 --- a/apps/synapse-portal-framework/src/components/index.ts +++ b/apps/synapse-portal-framework/src/components/index.ts @@ -1,33 +1,33 @@ -import ExploreWrapper from './Explore/ExploreWrapper' -import DetailsPage from './DetailsPage' -import TabbedSynapseObjects from './TabbedSynapseObjects' -import ConsortiaGoals from './csbc-home-page/ConsortiaGoals' -import HomePageCardContainer from './csbc-home-page/HomePageCardContainer' -import Ecosystem from './csbc-home-page/Ecosystem' +import { Navigate as Redirect } from 'react-router' +import ARKWelcomePage from './arkportal/ARKWelcomePage' +import ChallengeDataDownloadWrapper from './challengeportal/ChallengeDataDownloadWrapper' +import ChallengeDetailPageWrapper from './challengeportal/ChallengeDetailPageWrapper' +import ChallengeParticipantGoogleMap from './challengeportal/ChallengeParticipantGoogleMap' +import ChallengeSubmissionWrapper from './challengeportal/ChallengeSubmissionWrapper' +import ComponentCollapse from './ComponentCollapse' +import ParticipantsBarPlot from './crc-researcher/ParticipantsBarPlot' +import StatusLineChart from './crc-researcher/StatusLineChart' +import SurveysCompletedPlots from './crc-researcher/SurveysCompletedPlots' import AboutPortal from './csbc-home-page/AboutPortal' +import ConsortiaGoals from './csbc-home-page/ConsortiaGoals' import DevelopedBySage from './csbc-home-page/DevelopedBySage' -import NFBrowseToolsPage from './nf/NFBrowseToolsPage' -import ELBrowseToolsPage from './elportal/ELBrowseToolsPage' +import Ecosystem from './csbc-home-page/Ecosystem' +import HomePageCardContainer from './csbc-home-page/HomePageCardContainer' +import DetailsPage from './DetailsPage' import ELBetaLaunchBanner from './elportal/ELBetaLaunchBanner' +import ELBrowseToolsPage from './elportal/ELBrowseToolsPage' import ELContributeYourData from './elportal/ELContributeYourData' import ELGettingStarted from './elportal/ELGettingStarted' -import ARKWelcomePage from './arkportal/ARKWelcomePage' +import ExploreWrapper from './Explore/ExploreWrapper' import GenieHomePageHeader from './genie/GenieHomePageHeader' -import ParticipantsBarPlot from './crc-researcher/ParticipantsBarPlot' -import StatusLineChart from './crc-researcher/StatusLineChart' -import SurveysCompletedPlots from './crc-researcher/SurveysCompletedPlots' -import Image from './Image' -import RedirectWithQuery from './RedirectWithQuery' -import RedirectToURL from './RedirectToURL' -import { Navigate as Redirect } from 'react-router-dom' import Header from './Header' -import ChallengeParticipantGoogleMap from './challengeportal/ChallengeParticipantGoogleMap' -import ChallengeDetailPageWrapper from './challengeportal/ChallengeDetailPageWrapper' -import ChallengeSubmissionWrapper from './challengeportal/ChallengeSubmissionWrapper' -import ChallengeDataDownloadWrapper from './challengeportal/ChallengeDataDownloadWrapper' +import Image from './Image' +import NFBrowseToolsPage from './nf/NFBrowseToolsPage' import ProjectDiscussionForum from './ProjectDiscussionForum' -import ComponentCollapse from './ComponentCollapse' +import RedirectToURL from './RedirectToURL' +import RedirectWithQuery from './RedirectWithQuery' import SurveyToast from './SurveyToast' +import TabbedSynapseObjects from './TabbedSynapseObjects' const PortalComponents = { RouteControlWrapper: ExploreWrapper, diff --git a/apps/synapse-portal-framework/src/components/navbar/DropdownNavButton.tsx b/apps/synapse-portal-framework/src/components/navbar/DropdownNavButton.tsx index 71938282881..2d461ce6b73 100644 --- a/apps/synapse-portal-framework/src/components/navbar/DropdownNavButton.tsx +++ b/apps/synapse-portal-framework/src/components/navbar/DropdownNavButton.tsx @@ -9,8 +9,8 @@ import { useMediaQuery, useTheme, } from '@mui/material' -import { useState, MouseEvent } from 'react' -import { useMatch } from 'react-router-dom' +import { MouseEvent, useState } from 'react' +import { useMatch } from 'react-router' import NavLink from '../NavLink' export function DropdownNavButton(props) { diff --git a/apps/synapse-portal-framework/src/components/navbar/Navbar.tsx b/apps/synapse-portal-framework/src/components/navbar/Navbar.tsx index 2ab5fd196d3..eed62f68428 100644 --- a/apps/synapse-portal-framework/src/components/navbar/Navbar.tsx +++ b/apps/synapse-portal-framework/src/components/navbar/Navbar.tsx @@ -1,8 +1,8 @@ import { Box, Button } from '@mui/material' import { FeatureFlagEnum } from '@sage-bionetworks/synapse-types' -import { useRef, useEffect, useState } from 'react' +import { useEffect, useRef, useState } from 'react' import Dropdown from 'react-bootstrap/Dropdown' -import { useNavigate } from 'react-router-dom' +import { useNavigate } from 'react-router' import { AppUtils, storeRedirectURLForOneSageLoginAndGotoURL, diff --git a/apps/synapse-portal-framework/src/shared-config/sharedRoutes.tsx b/apps/synapse-portal-framework/src/shared-config/sharedRoutes.tsx index ccfed8a6966..17e2b5918ef 100644 --- a/apps/synapse-portal-framework/src/shared-config/sharedRoutes.tsx +++ b/apps/synapse-portal-framework/src/shared-config/sharedRoutes.tsx @@ -1,4 +1,4 @@ -import { RouteObject } from 'react-router-dom' +import { RouteObject } from 'react-router' import { DownloadCartPage, ErrorPage, diff --git a/apps/synapse-portal-framework/src/utils/UseGetPortalComponentSearchParams.ts b/apps/synapse-portal-framework/src/utils/UseGetPortalComponentSearchParams.ts index ec8d9623e46..df8675eedef 100644 --- a/apps/synapse-portal-framework/src/utils/UseGetPortalComponentSearchParams.ts +++ b/apps/synapse-portal-framework/src/utils/UseGetPortalComponentSearchParams.ts @@ -1,4 +1,4 @@ -import { useLocation } from 'react-router-dom' +import { useLocation } from 'react-router' const ignoreSearchParamsSet: Set = new Set([ 'utm_source', diff --git a/apps/synapse-portal-framework/src/utils/useDocumentTitleFromRoutes.ts b/apps/synapse-portal-framework/src/utils/useDocumentTitleFromRoutes.ts index ba64bb99dba..a0db7b3ca28 100644 --- a/apps/synapse-portal-framework/src/utils/useDocumentTitleFromRoutes.ts +++ b/apps/synapse-portal-framework/src/utils/useDocumentTitleFromRoutes.ts @@ -1,5 +1,5 @@ import { useEffect } from 'react' -import { useMatches } from 'react-router-dom' +import { useMatches } from 'react-router' /** * Uses the current routes to set the document title. The title will only be set when routes change, so if placed high diff --git a/packages/synapse-react-client/package.json b/packages/synapse-react-client/package.json index 982dedd4faa..d2579d67c6f 100644 --- a/packages/synapse-react-client/package.json +++ b/packages/synapse-react-client/package.json @@ -103,7 +103,7 @@ "react-plotly.js": "^2.6.0", "react-popper": "^2.3.0", "react-reflex": "^4.2.6", - "react-router-dom": "^6.28.1", + "react-router": "^7.1.1", "react-select": "^5.8.0", "react-sizeme": "^3.0.2", "react-switch": "^7.0.0", @@ -249,8 +249,8 @@ "build:umd": "vite build -c vite.config.umd.ts", "storybook:build": "pnpm storybook build", "type-check": "tsc --build", - "link-src": "pnpm link && cd ./node_modules/react && pnpm link && cd ../react-router && pnpm link && cd ../react-router-dom && pnpm link && cd ../../", - "unlink-src": "pnpm unlink && cd ./node_modules/react && pnpm unlink && cd ../react-router && pnpm unlink && cd ../react-router-dom && pnpm unlink && cd ../../", + "link-src": "pnpm link && cd ./node_modules/react && pnpm link && cd ../react-router && pnpm link && cd ../react-router && pnpm link && cd ../../", + "unlink-src": "pnpm unlink && cd ./node_modules/react && pnpm unlink && cd ../react-router && pnpm unlink && cd ../react-router && pnpm unlink && cd ../../", "lint": "eslint src", "watch:js": "tsc --watch" }, diff --git a/packages/synapse-react-client/src/components/ChallengeSubmission/SubmissionDirectoryList.tsx b/packages/synapse-react-client/src/components/ChallengeSubmission/SubmissionDirectoryList.tsx index ce36ea9223d..d217162e0d3 100644 --- a/packages/synapse-react-client/src/components/ChallengeSubmission/SubmissionDirectoryList.tsx +++ b/packages/synapse-react-client/src/components/ChallengeSubmission/SubmissionDirectoryList.tsx @@ -1,6 +1,7 @@ -import { useEffect, useMemo, useState } from 'react' +import { InfoTwoTone } from '@mui/icons-material' import { Box, Button, Radio, Typography } from '@mui/material' import { DataGrid, GridCellParams, GridColDef } from '@mui/x-data-grid' +import { SynapseClientError } from '@sage-bionetworks/synapse-client/util/SynapseClientError' import { Direction, Entity, @@ -9,34 +10,33 @@ import { EntityLookupRequest, EntityType, FILE_ENTITY_CONCRETE_TYPE_VALUE, + FileEntity, FileUploadComplete, SortBy, + UploadCallbackResp, } from '@sage-bionetworks/synapse-types' -import { Link } from 'react-router-dom' -import { - BackendDestinationEnum, - getEndpoint, -} from '../../utils/functions/getEndpoint' +import { useQueryClient } from '@tanstack/react-query' +import dayjs from 'dayjs' +import { useEffect, useMemo, useState } from 'react' +import { Link } from 'react-router' +import SynapseClient from '../../synapse-client' import { invalidateAllQueriesForEntity, useGetEntities, useGetEntityChildren, } from '../../synapse-queries' +import { useSynapseContext } from '../../utils' import { formatDate } from '../../utils/functions/DateFormatter' -import dayjs from 'dayjs' +import { + BackendDestinationEnum, + getEndpoint, +} from '../../utils/functions/getEndpoint' +import ConfirmationDialog from '../ConfirmationDialog' import CopyToClipboardIcon from '../CopyToClipboardIcon' -import { InfoTwoTone } from '@mui/icons-material' -import SynapseClient from '../../synapse-client' -import { useSynapseContext } from '../../utils' import { ErrorBanner } from '../error/ErrorBanner' import FileUpload from '../FileUpload' import IconSvg from '../IconSvg' -import { UploadCallbackResp } from '@sage-bionetworks/synapse-types' -import { FileEntity } from '@sage-bionetworks/synapse-types' -import { SynapseClientError } from '@sage-bionetworks/synapse-client/util/SynapseClientError' import { EntityItem } from './ChallengeSubmission' -import ConfirmationDialog from '../ConfirmationDialog' -import { useQueryClient } from '@tanstack/react-query' type SubmissionDirectoryRow = { id: string diff --git a/packages/synapse-react-client/src/components/ChangePassword/ChangePassword.integration.test.tsx b/packages/synapse-react-client/src/components/ChangePassword/ChangePassword.integration.test.tsx index fac80b2a53c..18f7353c44c 100644 --- a/packages/synapse-react-client/src/components/ChangePassword/ChangePassword.integration.test.tsx +++ b/packages/synapse-react-client/src/components/ChangePassword/ChangePassword.integration.test.tsx @@ -1,40 +1,40 @@ -import ChangePassword, { - ChangePasswordProps, - PASSWORD_CHANGED_SUCCESS_MESSAGE, -} from './ChangePassword' import { render, screen, waitFor, within } from '@testing-library/react' -import { createWrapper } from '../../testutils/TestingLibraryUtils' import userEvent from '@testing-library/user-event' -import { server } from '../../mocks/msw/server' import { noop } from 'lodash-es' -import * as ToastMessage from '../ToastMessage/ToastMessage' -import SynapseClient from '../../synapse-client' -import { - MOCK_USER_ID, - mockUserProfileData, -} from '../../mocks/user/mock_user_profile' import { getBadRequestChangePasswordHandler, getRequires2FAChangePasswordHandler, getSuccessfulChangePasswordHandler, } from '../../mocks/msw/handlers/changePasswordHandlers' -import { BackendDestinationEnum, getEndpoint } from '../../utils/functions' import { getFeatureFlagsOverride } from '../../mocks/msw/handlers/featureFlagHandlers' -import { SynapseContextType } from '../../utils' -import { KeyFactory } from '../../synapse-queries' import { getResetTwoFactorAuthHandlers } from '../../mocks/msw/handlers/resetTwoFactorAuthHandlers' +import { server } from '../../mocks/msw/server' +import { + MOCK_USER_ID, + mockUserProfileData, +} from '../../mocks/user/mock_user_profile' +import SynapseClient from '../../synapse-client' +import { KeyFactory } from '../../synapse-queries' +import { createWrapper } from '../../testutils/TestingLibraryUtils' +import { SynapseContextType } from '../../utils' +import { BackendDestinationEnum, getEndpoint } from '../../utils/functions' import { BEGIN_RESET_2FA_BUTTON_TEXT, SEND_RESET_2FA_EMAIL_BUTTON_TEXT, TWO_FACTOR_RESET_CONFIRMATION_TEXT, } from '../Authentication/OneTimePasswordForm' +import * as ToastMessage from '../ToastMessage/ToastMessage' +import ChangePassword, { + ChangePasswordProps, + PASSWORD_CHANGED_SUCCESS_MESSAGE, +} from './ChangePassword' import { TWO_FACTOR_AUTH_CHANGE_PASSWORD_PROMPT } from './useChangePasswordFormState' const mockDisplayToast = jest .spyOn(ToastMessage, 'displayToast') .mockImplementation(() => noop) -jest.mock('react-router-dom', () => { +jest.mock('react-router', () => { return { Navigate: jest.fn(({ to }) => `Redirected to ${to}`), } diff --git a/packages/synapse-react-client/src/components/ChangePassword/ChangePassword.tsx b/packages/synapse-react-client/src/components/ChangePassword/ChangePassword.tsx index 3f672e61352..44ebee4d327 100644 --- a/packages/synapse-react-client/src/components/ChangePassword/ChangePassword.tsx +++ b/packages/synapse-react-client/src/components/ChangePassword/ChangePassword.tsx @@ -1,11 +1,11 @@ -import { FormEvent, useEffect, useState } from 'react' import { Alert, Button, Link, TextField } from '@mui/material' -import { Link as RouterLink, Navigate } from 'react-router-dom' +import { FormEvent, useEffect, useState } from 'react' +import { Link as RouterLink, Navigate } from 'react-router' import { useGetCurrentUserProfile } from '../../synapse-queries' -import { displayToast } from '../ToastMessage' -import useChangePasswordFormState from './useChangePasswordFormState' import { useSynapseContext } from '../../utils' import { validatePassword } from '../../utils/functions/StringUtils' +import { displayToast } from '../ToastMessage' +import useChangePasswordFormState from './useChangePasswordFormState' export const PASSWORD_CHANGED_SUCCESS_MESSAGE = 'Your password was successfully changed.' diff --git a/packages/synapse-react-client/src/components/ChangePassword/ChangePasswordWithToken.integration.test.tsx b/packages/synapse-react-client/src/components/ChangePassword/ChangePasswordWithToken.integration.test.tsx index 7aff316be31..e561960b82b 100644 --- a/packages/synapse-react-client/src/components/ChangePassword/ChangePasswordWithToken.integration.test.tsx +++ b/packages/synapse-react-client/src/components/ChangePassword/ChangePasswordWithToken.integration.test.tsx @@ -1,21 +1,21 @@ +import { PasswordResetSignedToken } from '@sage-bionetworks/synapse-types' import { render, screen, waitFor, within } from '@testing-library/react' -import { createWrapper } from '../../testutils/TestingLibraryUtils' import userEvent from '@testing-library/user-event' -import { server } from '../../mocks/msw/server' import { noop } from 'lodash-es' -import * as ToastMessage from '../ToastMessage/ToastMessage' -import { MemoryRouter } from 'react-router-dom' -import SynapseClient from '../../synapse-client' -import { MOCK_USER_ID } from '../../mocks/user/mock_user_profile' +import { MemoryRouter } from 'react-router' import { getBadRequestChangePasswordHandler, getRequires2FAChangePasswordHandler, getSuccessfulChangePasswordHandler, } from '../../mocks/msw/handlers/changePasswordHandlers' +import { getFeatureFlagsOverride } from '../../mocks/msw/handlers/featureFlagHandlers' +import { server } from '../../mocks/msw/server' +import { MOCK_USER_ID } from '../../mocks/user/mock_user_profile' +import SynapseClient from '../../synapse-client' +import { createWrapper } from '../../testutils/TestingLibraryUtils' import { BackendDestinationEnum, getEndpoint } from '../../utils/functions' +import * as ToastMessage from '../ToastMessage/ToastMessage' import ChangePasswordWithToken from './ChangePasswordWithToken' -import { PasswordResetSignedToken } from '@sage-bionetworks/synapse-types' -import { getFeatureFlagsOverride } from '../../mocks/msw/handlers/featureFlagHandlers' import { TWO_FACTOR_AUTH_CHANGE_PASSWORD_PROMPT } from './useChangePasswordFormState' const mockDisplayToast = jest diff --git a/packages/synapse-react-client/src/components/DownloadCart/ShowDownloadV2.tsx b/packages/synapse-react-client/src/components/DownloadCart/ShowDownloadV2.tsx index 9d8bc214e24..486c1db3945 100644 --- a/packages/synapse-react-client/src/components/DownloadCart/ShowDownloadV2.tsx +++ b/packages/synapse-react-client/src/components/DownloadCart/ShowDownloadV2.tsx @@ -1,11 +1,11 @@ +import { Link as MuiLink, Tooltip } from '@mui/material' import { useEffect } from 'react' -import { TOOLTIP_DELAY_SHOW } from '../SynapseTable/SynapseTableConstants' -import { useSynapseContext } from '../../utils/context/SynapseContext' import { useErrorHandler } from 'react-error-boundary' +import { Link } from 'react-router' import { useGetDownloadListStatistics } from '../../synapse-queries/download/useDownloadList' +import { useSynapseContext } from '../../utils/context/SynapseContext' import IconSvg from '../IconSvg/IconSvg' -import { Tooltip, Link as MuiLink } from '@mui/material' -import { Link } from 'react-router-dom' +import { TOOLTIP_DELAY_SHOW } from '../SynapseTable/SynapseTableConstants' export type ShowDownloadV2Props = { to: string diff --git a/packages/synapse-react-client/src/components/ImageCardGridWithLinks/ImageCardGridWithLinks.stories.tsx b/packages/synapse-react-client/src/components/ImageCardGridWithLinks/ImageCardGridWithLinks.stories.tsx index d603bb6e7dd..80bf5bfd83a 100644 --- a/packages/synapse-react-client/src/components/ImageCardGridWithLinks/ImageCardGridWithLinks.stories.tsx +++ b/packages/synapse-react-client/src/components/ImageCardGridWithLinks/ImageCardGridWithLinks.stories.tsx @@ -1,6 +1,6 @@ import { Meta, StoryObj } from '@storybook/react' +import { MemoryRouter } from 'react-router' import ImageCardGridWithLinks from './ImageCardGridWithLinks' -import { MemoryRouter } from 'react-router-dom' const meta = { title: 'Home Page/ImageCardGridWithLinks', diff --git a/packages/synapse-react-client/src/components/ImageCardGridWithLinks/ImageCardGridWithLinks.test.tsx b/packages/synapse-react-client/src/components/ImageCardGridWithLinks/ImageCardGridWithLinks.test.tsx index ef6a153ebbc..cd4c5fdb859 100644 --- a/packages/synapse-react-client/src/components/ImageCardGridWithLinks/ImageCardGridWithLinks.test.tsx +++ b/packages/synapse-react-client/src/components/ImageCardGridWithLinks/ImageCardGridWithLinks.test.tsx @@ -1,17 +1,17 @@ -import ImageCardGridWithLinks, { - ImageCardGridWithLinksProps, -} from './ImageCardGridWithLinks' -import useGetQueryResultBundle from '../../synapse-queries/entity/useGetQueryResultBundle' -import { createMemoryRouter, RouterProvider } from 'react-router-dom' -import { screen, render, waitFor } from '@testing-library/react' -import { createWrapper } from '../../testutils/TestingLibraryUtils' import { BatchFileResult, ColumnTypeEnum, QueryResultBundle, } from '@sage-bionetworks/synapse-types' -import { getUseQuerySuccessMock } from '../../testutils/ReactQueryMockUtils' +import { render, screen, waitFor } from '@testing-library/react' +import { createMemoryRouter, RouterProvider } from 'react-router' import { SynapseClient } from '../../index' +import useGetQueryResultBundle from '../../synapse-queries/entity/useGetQueryResultBundle' +import { getUseQuerySuccessMock } from '../../testutils/ReactQueryMockUtils' +import { createWrapper } from '../../testutils/TestingLibraryUtils' +import ImageCardGridWithLinks, { + ImageCardGridWithLinksProps, +} from './ImageCardGridWithLinks' jest.mock('../../synapse-queries/entity/useGetQueryResultBundle') const mockUseGetQueryResultBundle = jest.mocked(useGetQueryResultBundle) diff --git a/packages/synapse-react-client/src/components/ImageCardGridWithLinks/ImageCardGridWithLinks.tsx b/packages/synapse-react-client/src/components/ImageCardGridWithLinks/ImageCardGridWithLinks.tsx index 551dfc6a14f..e98e6ace2a7 100644 --- a/packages/synapse-react-client/src/components/ImageCardGridWithLinks/ImageCardGridWithLinks.tsx +++ b/packages/synapse-react-client/src/components/ImageCardGridWithLinks/ImageCardGridWithLinks.tsx @@ -1,25 +1,25 @@ +import ArrowForwardIosIcon from '@mui/icons-material/ArrowForwardIos' import { Box, + Card, CardMedia, Grid, Link, - Typography, Skeleton, - Card, + Typography, } from '@mui/material' -import { Link as RouterLink } from 'react-router-dom' -import { SynapseConstants } from '../../utils' import { FileHandleAssociateType, FileHandleAssociation, QueryBundleRequest, Row, } from '@sage-bionetworks/synapse-types' +import { Link as RouterLink } from 'react-router' +import { useGetStablePresignedUrl } from '../../synapse-queries' import useGetQueryResultBundle from '../../synapse-queries/entity/useGetQueryResultBundle' +import { SynapseConstants } from '../../utils' import { getFieldIndex } from '../../utils/functions/queryUtils' import { parseEntityIdFromSqlStatement } from '../../utils/functions/SqlFunctions' -import ArrowForwardIosIcon from '@mui/icons-material/ArrowForwardIos' -import { useGetStablePresignedUrl } from '../../synapse-queries' const BORDER_RADIUS = '6px' diff --git a/packages/synapse-react-client/src/components/PortalFeatureHighlights/PortalFeatureHighlights.stories.tsx b/packages/synapse-react-client/src/components/PortalFeatureHighlights/PortalFeatureHighlights.stories.tsx index 240eba2cccf..ba926dbf3f5 100644 --- a/packages/synapse-react-client/src/components/PortalFeatureHighlights/PortalFeatureHighlights.stories.tsx +++ b/packages/synapse-react-client/src/components/PortalFeatureHighlights/PortalFeatureHighlights.stories.tsx @@ -1,6 +1,6 @@ import { Meta, StoryObj } from '@storybook/react' +import { MemoryRouter } from 'react-router' import PortalFeatureHighlights from './PortalFeatureHighlights' -import { MemoryRouter } from 'react-router-dom' const meta = { title: 'Home Page/PortalFeatureHighlights', diff --git a/packages/synapse-react-client/src/components/PortalFeatureHighlights/PortalFeatureHighlights.test.tsx b/packages/synapse-react-client/src/components/PortalFeatureHighlights/PortalFeatureHighlights.test.tsx index c75dd1cf979..f9e083b8ee7 100644 --- a/packages/synapse-react-client/src/components/PortalFeatureHighlights/PortalFeatureHighlights.test.tsx +++ b/packages/synapse-react-client/src/components/PortalFeatureHighlights/PortalFeatureHighlights.test.tsx @@ -1,8 +1,8 @@ +import { render, screen } from '@testing-library/react' +import { MemoryRouter } from 'react-router' import PortalFeatureHighlights, { PortalFeatureHighlightsProps, } from './PortalFeatureHighlights' -import { MemoryRouter } from 'react-router-dom' -import { render, screen } from '@testing-library/react' describe('PortalFeatureHighlights component', () => { const props: PortalFeatureHighlightsProps = { diff --git a/packages/synapse-react-client/src/components/PortalFeatureHighlights/PortalFeatureHighlights.tsx b/packages/synapse-react-client/src/components/PortalFeatureHighlights/PortalFeatureHighlights.tsx index 1ae94ed8279..12f7e821d12 100644 --- a/packages/synapse-react-client/src/components/PortalFeatureHighlights/PortalFeatureHighlights.tsx +++ b/packages/synapse-react-client/src/components/PortalFeatureHighlights/PortalFeatureHighlights.tsx @@ -1,6 +1,6 @@ -import { Typography, Button, CardMedia, Stack, Box } from '@mui/material' +import { Box, Button, CardMedia, Stack, Typography } from '@mui/material' import React from 'react' -import { Link } from 'react-router-dom' +import { Link } from 'react-router' export type PortalFeatureHighlightsProps = { reverseOrder?: boolean diff --git a/packages/synapse-react-client/src/components/RecentPublicationsGrid/RecentPublicationsGrid.test.tsx b/packages/synapse-react-client/src/components/RecentPublicationsGrid/RecentPublicationsGrid.test.tsx index 5aab55aa805..7bdaa413118 100644 --- a/packages/synapse-react-client/src/components/RecentPublicationsGrid/RecentPublicationsGrid.test.tsx +++ b/packages/synapse-react-client/src/components/RecentPublicationsGrid/RecentPublicationsGrid.test.tsx @@ -1,15 +1,15 @@ -import { render, screen, waitFor } from '@testing-library/react' -import RecentPublicationsGrid, { - RecentPublicationsGridProps, -} from './RecentPublicationsGrid' -import { createWrapper } from '../../testutils/TestingLibraryUtils' -import useGetQueryResultBundle from '../../synapse-queries/entity/useGetQueryResultBundle' import { ColumnTypeEnum, QueryResultBundle, } from '@sage-bionetworks/synapse-types' -import { createMemoryRouter, RouterProvider } from 'react-router-dom' +import { render, screen, waitFor } from '@testing-library/react' +import { createMemoryRouter, RouterProvider } from 'react-router' +import useGetQueryResultBundle from '../../synapse-queries/entity/useGetQueryResultBundle' import { getUseQuerySuccessMock } from '../../testutils/ReactQueryMockUtils' +import { createWrapper } from '../../testutils/TestingLibraryUtils' +import RecentPublicationsGrid, { + RecentPublicationsGridProps, +} from './RecentPublicationsGrid' jest.mock('../../synapse-queries/entity/useGetQueryResultBundle') const mockUseGetQueryResultBundle = jest.mocked(useGetQueryResultBundle) diff --git a/packages/synapse-react-client/src/components/RecentPublicationsGrid/RecentPublicationsGrid.tsx b/packages/synapse-react-client/src/components/RecentPublicationsGrid/RecentPublicationsGrid.tsx index 911f6fc1a42..42d51dbcb72 100644 --- a/packages/synapse-react-client/src/components/RecentPublicationsGrid/RecentPublicationsGrid.tsx +++ b/packages/synapse-react-client/src/components/RecentPublicationsGrid/RecentPublicationsGrid.tsx @@ -1,19 +1,18 @@ import { - Typography, - Button, Box, - Skeleton, + Button, Link as MuiLink, + Skeleton, + Typography, } from '@mui/material' import Grid from '@mui/material/Unstable_Grid2' -import { SynapseConstants, SynapseUtilityFunctions } from '../../utils' -import { QueryBundleRequest } from '@sage-bionetworks/synapse-types' -import { getFieldIndex } from '../../utils/functions/queryUtils' -import useGetQueryResultBundle from '../../synapse-queries/entity/useGetQueryResultBundle' +import { QueryBundleRequest, Row } from '@sage-bionetworks/synapse-types' import dayjs from 'dayjs' +import { Link } from 'react-router' +import useGetQueryResultBundle from '../../synapse-queries/entity/useGetQueryResultBundle' +import { SynapseConstants, SynapseUtilityFunctions } from '../../utils' import { formatDate } from '../../utils/functions/DateFormatter' -import { Row } from '@sage-bionetworks/synapse-types' -import { Link } from 'react-router-dom' +import { getFieldIndex } from '../../utils/functions/queryUtils' import { convertDoiToLink } from '../../utils/functions/RegularExpressions' export type RecentPublicationsGridProps = { diff --git a/packages/synapse-react-client/src/components/ReleaseCard/ReleaseCard.test.tsx b/packages/synapse-react-client/src/components/ReleaseCard/ReleaseCard.test.tsx index 6e6173ce607..2fcf77f0961 100644 --- a/packages/synapse-react-client/src/components/ReleaseCard/ReleaseCard.test.tsx +++ b/packages/synapse-react-client/src/components/ReleaseCard/ReleaseCard.test.tsx @@ -1,6 +1,6 @@ import { Query } from '@sage-bionetworks/synapse-types' import { render, screen, within } from '@testing-library/react' -import { createMemoryRouter, RouterProvider } from 'react-router-dom' +import { createMemoryRouter, RouterProvider } from 'react-router' import { createWrapper } from '../../testutils/TestingLibraryUtils' import { SelectedFacet } from '../QueryWrapper/generateEncodedPathAndQueryForSelectedFacetURL' import { ReleaseCard, ReleaseCardProps, ReleaseCardSchema } from './ReleaseCard' diff --git a/packages/synapse-react-client/src/components/ReleaseCard/ReleaseCardLarge.tsx b/packages/synapse-react-client/src/components/ReleaseCard/ReleaseCardLarge.tsx index 1a124f03fef..73136d80d65 100644 --- a/packages/synapse-react-client/src/components/ReleaseCard/ReleaseCardLarge.tsx +++ b/packages/synapse-react-client/src/components/ReleaseCard/ReleaseCardLarge.tsx @@ -1,7 +1,7 @@ import { CalendarTodayTwoTone } from '@mui/icons-material' import { Box, Button, Divider, Stack, Typography } from '@mui/material' import { Fragment } from 'react' -import { Link as ReactRouterLink } from 'react-router-dom' +import { Link as ReactRouterLink } from 'react-router' import { ReleaseCardProps } from './ReleaseCard' import { ReleaseCardLargeConfig, ReleaseCardStat } from './ReleaseCardTypes' import { diff --git a/packages/synapse-react-client/src/components/ReleaseCard/ReleaseCardMedium.tsx b/packages/synapse-react-client/src/components/ReleaseCard/ReleaseCardMedium.tsx index 380bb3e1d37..818f5e5aeb4 100644 --- a/packages/synapse-react-client/src/components/ReleaseCard/ReleaseCardMedium.tsx +++ b/packages/synapse-react-client/src/components/ReleaseCard/ReleaseCardMedium.tsx @@ -1,5 +1,5 @@ import { Box, Button, Link, Typography } from '@mui/material' -import { Link as ReactRouterLink } from 'react-router-dom' +import { Link as ReactRouterLink } from 'react-router' import { PRODUCTION_ENDPOINT_CONFIG } from '../../utils/functions/getEndpoint' import { ReleaseCardProps } from './ReleaseCard' import { ReleaseCardMediumConfig, ReleaseCardStat } from './ReleaseCardTypes' diff --git a/packages/synapse-react-client/src/components/StorybookComponentWrapper.tsx b/packages/synapse-react-client/src/components/StorybookComponentWrapper.tsx index 35c6d8595d4..0cf9401f8cb 100644 --- a/packages/synapse-react-client/src/components/StorybookComponentWrapper.tsx +++ b/packages/synapse-react-client/src/components/StorybookComponentWrapper.tsx @@ -2,7 +2,8 @@ import { QueryClient, QueryClientProvider } from '@tanstack/react-query' import { ReactQueryDevtools } from '@tanstack/react-query-devtools' import dayjs from 'dayjs' import { ReactNode, Suspense, useEffect, useMemo, useState } from 'react' -import { createMemoryRouter, RouterProvider } from 'react-router-dom' +import { createMemoryRouter } from 'react-router' +import { RouterProvider } from 'react-router/dom' import SynapseClient, { getAccessTokenFromCookie, getAuthenticatedOn, diff --git a/packages/synapse-react-client/src/components/SynapseForm/SynapseForm.test.tsx b/packages/synapse-react-client/src/components/SynapseForm/SynapseForm.test.tsx index e2497f2e9bd..14c96b86eaa 100644 --- a/packages/synapse-react-client/src/components/SynapseForm/SynapseForm.test.tsx +++ b/packages/synapse-react-client/src/components/SynapseForm/SynapseForm.test.tsx @@ -1,15 +1,15 @@ import $RefParser from '@apidevtools/json-schema-ref-parser' import { render, screen } from '@testing-library/react' import userEvent from '@testing-library/user-event' -import { createMemoryRouter, RouterProvider } from 'react-router-dom' -import SynapseForm, { SynapseFormProps } from './SynapseForm' -import { createWrapper } from '../../testutils/TestingLibraryUtils' +import { createMemoryRouter, RouterProvider } from 'react-router' import { mockFormData as submissionData, mockFormSchema as formSchema, mockNavSchema as formNavSchema, mockUiSchema as formUiSchema, } from '../../mocks/mock_drug_tool_data' +import { createWrapper } from '../../testutils/TestingLibraryUtils' +import SynapseForm, { SynapseFormProps } from './SynapseForm' // import { Engine } from 'json-rules-engine' diff --git a/packages/synapse-react-client/src/components/dataaccess/AccessHistoryDashboard.integration.test.tsx b/packages/synapse-react-client/src/components/dataaccess/AccessHistoryDashboard.integration.test.tsx index 8c0f0826d8b..ea69bc3973e 100644 --- a/packages/synapse-react-client/src/components/dataaccess/AccessHistoryDashboard.integration.test.tsx +++ b/packages/synapse-react-client/src/components/dataaccess/AccessHistoryDashboard.integration.test.tsx @@ -1,7 +1,7 @@ import { UserBundle } from '@sage-bionetworks/synapse-types' import { act, render, screen, waitFor } from '@testing-library/react' import userEvent from '@testing-library/user-event' -import { createMemoryRouter, RouterProvider } from 'react-router-dom' +import { createMemoryRouter, RouterProvider } from 'react-router' import selectEvent from 'react-select-event' import { mockManagedACTAccessRequirement as mockAccessRequirement, diff --git a/packages/synapse-react-client/src/components/dataaccess/AccessHistoryDashboard.tsx b/packages/synapse-react-client/src/components/dataaccess/AccessHistoryDashboard.tsx index 2d1f67a8bb4..b0be766ac4b 100644 --- a/packages/synapse-react-client/src/components/dataaccess/AccessHistoryDashboard.tsx +++ b/packages/synapse-react-client/src/components/dataaccess/AccessHistoryDashboard.tsx @@ -1,9 +1,13 @@ +import { Typography } from '@mui/material' +import { TYPE_FILTER } from '@sage-bionetworks/synapse-types' import { omitBy } from 'lodash-es' import { useCallback, useEffect, useState } from 'react' -import { useNavigate, useLocation } from 'react-router-dom' +import { useLocation, useNavigate } from 'react-router' +import SearchImage from '../../assets/icons/SearchImage' +import { useGetCurrentUserBundle } from '../../synapse-queries' import { useDebouncedEffect } from '../../utils/hooks/useDebouncedEffect' -import { TYPE_FILTER } from '@sage-bionetworks/synapse-types' -import { Typography } from '@mui/material' +import UserOrTeamBadge from '../UserOrTeamBadge/UserOrTeamBadge' +import UserSearchBoxV2 from '../UserSearchBox/UserSearchBoxV2' import { AccessApprovalsTable, AccessApprovalsTableProps, @@ -12,11 +16,7 @@ import { AccessRequestSubmissionTable, AccessRequestSubmissionTableProps, } from './AccessRequestSubmissionTable' -import UserOrTeamBadge from '../UserOrTeamBadge/UserOrTeamBadge' -import UserSearchBoxV2 from '../UserSearchBox/UserSearchBoxV2' import AccessRequirementSearchBox from './AccessRequirementSearchBox/AccessRequirementSearchBox' -import { useGetCurrentUserBundle } from '../../synapse-queries' -import SearchImage from '../../assets/icons/SearchImage' const SearchStartComponent = () => { return ( diff --git a/packages/synapse-react-client/src/components/dataaccess/AccessRequestSubmissionTable.integration.test.tsx b/packages/synapse-react-client/src/components/dataaccess/AccessRequestSubmissionTable.integration.test.tsx index a96d763a496..c5d6f87f27f 100644 --- a/packages/synapse-react-client/src/components/dataaccess/AccessRequestSubmissionTable.integration.test.tsx +++ b/packages/synapse-react-client/src/components/dataaccess/AccessRequestSubmissionTable.integration.test.tsx @@ -9,7 +9,7 @@ import { render, screen, waitFor } from '@testing-library/react' import userEvent from '@testing-library/user-event' import dayjs from 'dayjs' import { upperFirst } from 'lodash-es' -import { createMemoryRouter, RouterProvider } from 'react-router-dom' +import { createMemoryRouter, RouterProvider } from 'react-router' import { mockSubmissionSearchResponse } from '../../mocks/dataaccess/mockAccessRequest' import { rest, server } from '../../mocks/msw/server' import { mockActTeam } from '../../mocks/team/mockTeam' diff --git a/packages/synapse-react-client/src/components/dataaccess/AccessRequestSubmissionTable.tsx b/packages/synapse-react-client/src/components/dataaccess/AccessRequestSubmissionTable.tsx index 6b54bb3d197..db02b815b8b 100644 --- a/packages/synapse-react-client/src/components/dataaccess/AccessRequestSubmissionTable.tsx +++ b/packages/synapse-react-client/src/components/dataaccess/AccessRequestSubmissionTable.tsx @@ -1,12 +1,4 @@ -import { upperFirst } from 'lodash-es' -import dayjs from 'dayjs' -import { useMemo, useState } from 'react' -import { Table } from 'react-bootstrap' -import { Link } from 'react-router-dom' -import SortIcon from '../../assets/icons/Sort' -import { formatDate } from '../../utils/functions/DateFormatter' -import { useSearchAccessSubmissionsInfinite } from '../../synapse-queries/dataaccess/useDataAccessSubmission' -import { ACT_TEAM_ID } from '../../utils/SynapseConstants' +import { Button, Stack, Typography } from '@mui/material' import { Direction, SubmissionReviewerFilterType, @@ -15,10 +7,18 @@ import { SubmissionSortField, SubmissionState, } from '@sage-bionetworks/synapse-types' +import dayjs from 'dayjs' +import { upperFirst } from 'lodash-es' +import { useMemo, useState } from 'react' +import { Table } from 'react-bootstrap' +import { Link } from 'react-router' +import SortIcon from '../../assets/icons/Sort' +import { useSearchAccessSubmissionsInfinite } from '../../synapse-queries/dataaccess/useDataAccessSubmission' +import { formatDate } from '../../utils/functions/DateFormatter' +import { ACT_TEAM_ID } from '../../utils/SynapseConstants' import { SynapseSpinner } from '../LoadingScreen/LoadingScreen' -import { Button, Stack, Typography } from '@mui/material' -import UserOrTeamBadge from '../UserOrTeamBadge/UserOrTeamBadge' import { UserBadge } from '../UserCard/UserBadge' +import UserOrTeamBadge from '../UserOrTeamBadge/UserOrTeamBadge' export type AccessRequestSubmissionTableProps = { showSubmitter?: boolean diff --git a/packages/synapse-react-client/src/components/dataaccess/AccessRequirementDashboard.integration.test.tsx b/packages/synapse-react-client/src/components/dataaccess/AccessRequirementDashboard.integration.test.tsx index c3077475202..3ad00ecdb80 100644 --- a/packages/synapse-react-client/src/components/dataaccess/AccessRequirementDashboard.integration.test.tsx +++ b/packages/synapse-react-client/src/components/dataaccess/AccessRequirementDashboard.integration.test.tsx @@ -1,6 +1,6 @@ import { render, screen, waitFor } from '@testing-library/react' import userEvent from '@testing-library/user-event' -import { createMemoryRouter, RouterProvider } from 'react-router-dom' +import { createMemoryRouter, RouterProvider } from 'react-router' import selectEvent from 'react-select-event' import { MOCK_ACCESS_TOKEN } from '../../mocks/MockSynapseContext' import { server } from '../../mocks/msw/server' diff --git a/packages/synapse-react-client/src/components/dataaccess/AccessRequirementDashboard.tsx b/packages/synapse-react-client/src/components/dataaccess/AccessRequirementDashboard.tsx index c1b8a2d17ee..6489b90ae75 100644 --- a/packages/synapse-react-client/src/components/dataaccess/AccessRequirementDashboard.tsx +++ b/packages/synapse-react-client/src/components/dataaccess/AccessRequirementDashboard.tsx @@ -1,16 +1,16 @@ -import { omitBy } from 'lodash-es' -import { useCallback, useEffect, useMemo, useState } from 'react' -import { Box, InputAdornment, TextField, Typography } from '@mui/material' import { SearchOutlined } from '@mui/icons-material' -import { useLocation, useNavigate } from 'react-router-dom' +import { Box, InputAdornment, TextField, Typography } from '@mui/material' +import { useDebouncedState } from '@react-hookz/web' import { EntityType } from '@sage-bionetworks/synapse-types' +import { omitBy } from 'lodash-es' +import { useCallback, useEffect, useMemo, useState } from 'react' +import { useLocation, useNavigate } from 'react-router' +import { SYNAPSE_ENTITY_ID_REGEX } from '../../utils/functions/RegularExpressions' import { EntityFinderModal } from '../EntityFinder/EntityFinderModal' import { FinderScope } from '../EntityFinder/tree/EntityTree' +import { InputSizedButton } from '../styled/InputSizedButton' import UserSearchBoxV2 from '../UserSearchBox/UserSearchBoxV2' import { AccessRequirementTable } from './AccessRequirementTable' -import { SYNAPSE_ENTITY_ID_REGEX } from '../../utils/functions/RegularExpressions' -import { InputSizedButton } from '../styled/InputSizedButton' -import { useDebouncedState } from '@react-hookz/web' export const AR_NAME_OR_ID_SEARCH_PARAM_KEY = 'nameOrID' export const RELATED_PROJECT_ID_SEARCH_PARAM_KEY = 'relatedProjectId' diff --git a/packages/synapse-react-client/src/components/dataaccess/AccessSubmissionDashboard.integration.test.tsx b/packages/synapse-react-client/src/components/dataaccess/AccessSubmissionDashboard.integration.test.tsx index 2160d8e8e48..7d11a18ee7c 100644 --- a/packages/synapse-react-client/src/components/dataaccess/AccessSubmissionDashboard.integration.test.tsx +++ b/packages/synapse-react-client/src/components/dataaccess/AccessSubmissionDashboard.integration.test.tsx @@ -1,6 +1,6 @@ import { act, render, screen, waitFor } from '@testing-library/react' import userEvent from '@testing-library/user-event' -import { createMemoryRouter, RouterProvider } from 'react-router-dom' +import { createMemoryRouter, RouterProvider } from 'react-router' import selectEvent from 'react-select-event' import { mockManagedACTAccessRequirement as mockAccessRequirement, diff --git a/packages/synapse-react-client/src/components/dataaccess/AccessSubmissionDashboard.tsx b/packages/synapse-react-client/src/components/dataaccess/AccessSubmissionDashboard.tsx index c1cb116f996..dacf18018c4 100644 --- a/packages/synapse-react-client/src/components/dataaccess/AccessSubmissionDashboard.tsx +++ b/packages/synapse-react-client/src/components/dataaccess/AccessSubmissionDashboard.tsx @@ -1,17 +1,16 @@ +import { Typography } from '@mui/material' +import { SubmissionState, TYPE_FILTER } from '@sage-bionetworks/synapse-types' import { omitBy } from 'lodash-es' import { useCallback, useEffect, useState } from 'react' -import { useNavigate, useLocation } from 'react-router-dom' +import { useLocation, useNavigate } from 'react-router' import { useDebouncedEffect } from '../../utils/hooks/useDebouncedEffect' -import { SubmissionState } from '@sage-bionetworks/synapse-types' -import { TYPE_FILTER } from '@sage-bionetworks/synapse-types' -import { Typography } from '@mui/material' +import { ACT_TEAM_ID } from '../../utils/SynapseConstants' +import UserSearchBoxV2 from '../UserSearchBox/UserSearchBoxV2' import { AccessRequestSubmissionTable, AccessRequestSubmissionTableProps, } from './AccessRequestSubmissionTable' -import UserSearchBoxV2 from '../UserSearchBox/UserSearchBoxV2' import AccessRequirementSearchBox from './AccessRequirementSearchBox/AccessRequirementSearchBox' -import { ACT_TEAM_ID } from '../../utils/SynapseConstants' export const getReviewerFilterID = (selected: string | null) => { if (selected && selected !== ACT_TEAM_ID.toString()) { diff --git a/packages/synapse-react-client/src/components/dataaccess/ReviewerDashboard.tsx b/packages/synapse-react-client/src/components/dataaccess/ReviewerDashboard.tsx index e8466247663..ea8741ac9b2 100644 --- a/packages/synapse-react-client/src/components/dataaccess/ReviewerDashboard.tsx +++ b/packages/synapse-react-client/src/components/dataaccess/ReviewerDashboard.tsx @@ -7,9 +7,9 @@ import { NavLink, Outlet, RouteObject, - RouterProvider, useParams, -} from 'react-router-dom' +} from 'react-router' +import { RouterProvider } from 'react-router/dom' import { useGetCurrentUserBundle } from '../../synapse-queries/user/useUserBundle' import { SynapseErrorBoundary } from '../error/ErrorBanner' import IconSvg, { IconName } from '../IconSvg/IconSvg' @@ -128,24 +128,10 @@ export function ReviewerDashboard(props: ReviewerDashboardProps) { if (useMemoryRouter) { return createMemoryRouter(routes, { basename: routerBaseName, - future: { - v7_relativeSplatPath: true, - v7_fetcherPersist: true, - v7_normalizeFormMethod: true, - v7_partialHydration: true, - v7_skipActionErrorRevalidation: true, - }, }) } else { return createBrowserRouter(routes, { basename: routerBaseName, - future: { - v7_relativeSplatPath: true, - v7_fetcherPersist: true, - v7_normalizeFormMethod: true, - v7_partialHydration: true, - v7_skipActionErrorRevalidation: true, - }, }) } }, [useMemoryRouter, routes, routerBaseName]) @@ -154,9 +140,7 @@ export function ReviewerDashboard(props: ReviewerDashboardProps) { return } - return ( - - ) + return } function SubmissionPageRouteRenderer() { diff --git a/packages/synapse-react-client/src/components/utils/Blocker.tsx b/packages/synapse-react-client/src/components/utils/Blocker.tsx index f499dc15742..c7d7efdefa6 100644 --- a/packages/synapse-react-client/src/components/utils/Blocker.tsx +++ b/packages/synapse-react-client/src/components/utils/Blocker.tsx @@ -1,5 +1,5 @@ import { ReactNode } from 'react' -import { useBlocker } from 'react-router-dom' +import { useBlocker } from 'react-router' /** * Component wrapper for react-router `useBlocker` hook where the blocker is passed as a render prop. Use the hook when possible. diff --git a/packages/synapse-react-client/src/components/widgets/LoginAwareButton.test.tsx b/packages/synapse-react-client/src/components/widgets/LoginAwareButton.test.tsx index ec22428f528..4d6db3cef4d 100644 --- a/packages/synapse-react-client/src/components/widgets/LoginAwareButton.test.tsx +++ b/packages/synapse-react-client/src/components/widgets/LoginAwareButton.test.tsx @@ -1,11 +1,11 @@ import { render, screen, waitFor } from '@testing-library/react' -import { LoginAwareButton, LoginAwareButtonProps } from './LoginAwareButton' -import { SRC_SIGN_IN_CLASS } from '../../utils/SynapseConstants' -import { ApplicationSessionManager } from '../../utils' -import { MemoryRouter } from 'react-router-dom' -import SynapseClient from '../../synapse-client' +import { MemoryRouter } from 'react-router' import { MOCK_ACCESS_TOKEN } from '../../mocks/MockSynapseContext' +import SynapseClient from '../../synapse-client' import { createWrapper } from '../../testutils/TestingLibraryUtils' +import { ApplicationSessionManager } from '../../utils' +import { SRC_SIGN_IN_CLASS } from '../../utils/SynapseConstants' +import { LoginAwareButton, LoginAwareButtonProps } from './LoginAwareButton' const defaultProps: LoginAwareButtonProps = { children: 'Register for this Challenge', diff --git a/packages/synapse-react-client/src/components/widgets/LoginAwareButton.tsx b/packages/synapse-react-client/src/components/widgets/LoginAwareButton.tsx index 40501d2d9ec..2d11144305b 100644 --- a/packages/synapse-react-client/src/components/widgets/LoginAwareButton.tsx +++ b/packages/synapse-react-client/src/components/widgets/LoginAwareButton.tsx @@ -1,7 +1,7 @@ import { Button, ButtonProps } from '@mui/material' -import { Link, LinkProps } from 'react-router-dom' -import { SRC_SIGN_IN_CLASS } from '../../utils/SynapseConstants' +import { Link, LinkProps } from 'react-router' import { useSynapseContext } from '../../utils' +import { SRC_SIGN_IN_CLASS } from '../../utils/SynapseConstants' /* Allow component to behave as a MUI Button or a React Router Link */ export type LoginAwareButtonProps = ButtonProps & diff --git a/packages/synapse-react-client/src/testutils/LocationTracker.tsx b/packages/synapse-react-client/src/testutils/LocationTracker.tsx index c74c98401a2..b3aaeabbd12 100644 --- a/packages/synapse-react-client/src/testutils/LocationTracker.tsx +++ b/packages/synapse-react-client/src/testutils/LocationTracker.tsx @@ -1,4 +1,4 @@ -import { useLocation } from 'react-router-dom' +import { useLocation } from 'react-router' /** * Simple component that writes the current React Router location to an object to be used in tests. diff --git a/packages/synapse-react-client/src/utils/AppUtils/AppUtils.ts b/packages/synapse-react-client/src/utils/AppUtils/AppUtils.ts index b1eed280385..84cd095ae6c 100644 --- a/packages/synapse-react-client/src/utils/AppUtils/AppUtils.ts +++ b/packages/synapse-react-client/src/utils/AppUtils/AppUtils.ts @@ -1,5 +1,5 @@ import { useEffect, useState } from 'react' -import { NavigateFunction } from 'react-router-dom' +import { NavigateFunction } from 'react-router' import UniversalCookies from 'universal-cookie' import { ACCOUNT_SITE_PROMPTED_FOR_LOGIN_COOKIE_KEY, diff --git a/packages/synapse-react-client/src/utils/AppUtils/session/ApplicationSession.test.tsx b/packages/synapse-react-client/src/utils/AppUtils/session/ApplicationSession.test.tsx index a97680fb2ad..22993194e5f 100644 --- a/packages/synapse-react-client/src/utils/AppUtils/session/ApplicationSession.test.tsx +++ b/packages/synapse-react-client/src/utils/AppUtils/session/ApplicationSession.test.tsx @@ -1,33 +1,33 @@ -import { renderHook, waitFor } from '@testing-library/react' -import ApplicationSessionManager, { - ApplicationSessionManagerProps, -} from './ApplicationSessionManager' -import { - ApplicationSessionContextType, - useApplicationSessionContext, -} from './ApplicationSessionContext' -import { - defaultQueryClientConfig, - FullContextProvider, - SynapseClient, -} from '../../../index' -import { MOCK_USER_ID } from '../../../mocks/user/mock_user_profile' import { SynapseClientError } from '@sage-bionetworks/synapse-client/util/SynapseClientError' -import { MemoryRouter } from 'react-router-dom' -import * as UseDetectSSOCodeModule from '../../hooks/useDetectSSOCode' -import { UseDetectSSOCodeOptions } from '../../hooks/useDetectSSOCode' import { ErrorResponseCode, TermsOfServiceState, TermsOfServiceStatus, TwoFactorAuthErrorResponse, } from '@sage-bionetworks/synapse-types' +import { QueryClient } from '@tanstack/query-core' +import { renderHook, waitFor } from '@testing-library/react' import dayjs from 'dayjs' +import { MemoryRouter } from 'react-router' +import { + defaultQueryClientConfig, + FullContextProvider, + SynapseClient, +} from '../../../index' import { MOCK_ACCESS_TOKEN, MOCK_CONTEXT_VALUE, } from '../../../mocks/MockSynapseContext' -import { QueryClient } from '@tanstack/query-core' +import { MOCK_USER_ID } from '../../../mocks/user/mock_user_profile' +import * as UseDetectSSOCodeModule from '../../hooks/useDetectSSOCode' +import { UseDetectSSOCodeOptions } from '../../hooks/useDetectSSOCode' +import { + ApplicationSessionContextType, + useApplicationSessionContext, +} from './ApplicationSessionContext' +import ApplicationSessionManager, { + ApplicationSessionManagerProps, +} from './ApplicationSessionManager' function render(props?: ApplicationSessionManagerProps) { const queryClient = new QueryClient(defaultQueryClientConfig) diff --git a/packages/synapse-react-client/src/utils/AppUtils/session/ApplicationSessionManager.tsx b/packages/synapse-react-client/src/utils/AppUtils/session/ApplicationSessionManager.tsx index 58a1d4cf63e..b4425206c17 100644 --- a/packages/synapse-react-client/src/utils/AppUtils/session/ApplicationSessionManager.tsx +++ b/packages/synapse-react-client/src/utils/AppUtils/session/ApplicationSessionManager.tsx @@ -1,7 +1,7 @@ import { TwoFactorAuthErrorResponse } from '@sage-bionetworks/synapse-client/generated/models/TwoFactorAuthErrorResponse' import dayjs from 'dayjs' import { PropsWithChildren, useCallback, useEffect, useState } from 'react' -import { useNavigate } from 'react-router-dom' +import { useNavigate } from 'react-router' import SynapseClient from '../../../synapse-client' import { useTermsOfServiceStatus } from '../../../synapse-queries/termsOfService/useTermsOfService' import { SynapseContextProvider, SynapseContextType } from '../../context' diff --git a/packages/synapse-react-client/src/utils/hooks/useQuerySearchParam.ts b/packages/synapse-react-client/src/utils/hooks/useQuerySearchParam.ts index a0b8eb1a79c..9ac7497fd24 100644 --- a/packages/synapse-react-client/src/utils/hooks/useQuerySearchParam.ts +++ b/packages/synapse-react-client/src/utils/hooks/useQuerySearchParam.ts @@ -1,4 +1,4 @@ -import { useLocation } from 'react-router-dom' +import { useLocation } from 'react-router' /** * If defined, get the query search parameter value for the given parameter name diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 182dca0747c..b84e79e92f3 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -136,9 +136,9 @@ importers: react-easy-crop: specifier: ^5.0.7 version: 5.0.7(react-dom@18.2.0(react@18.2.0))(react@18.2.0) - react-router-dom: - specifier: ^6.28.1 - version: 6.28.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0) + react-router: + specifier: ^7.1.1 + version: 7.1.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0) sass: specifier: ^1.71.1 version: 1.77.6 @@ -299,9 +299,9 @@ importers: react-dom: specifier: ^18.2.0 version: 18.2.0(react@18.2.0) - react-router-dom: - specifier: ^6.28.1 - version: 6.28.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0) + react-router: + specifier: ^7.1.1 + version: 7.1.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0) synapse-react-client: specifier: workspace:* version: link:../../../packages/synapse-react-client @@ -348,9 +348,9 @@ importers: react-dom: specifier: ^18.2.0 version: 18.2.0(react@18.2.0) - react-router-dom: - specifier: ^6.28.1 - version: 6.28.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0) + react-router: + specifier: ^7.1.1 + version: 7.1.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0) synapse-react-client: specifier: workspace:* version: link:../../../packages/synapse-react-client @@ -397,9 +397,9 @@ importers: react-dom: specifier: ^18.2.0 version: 18.2.0(react@18.2.0) - react-router-dom: - specifier: ^6.28.1 - version: 6.28.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0) + react-router: + specifier: ^7.1.1 + version: 7.1.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0) synapse-react-client: specifier: workspace:* version: link:../../../packages/synapse-react-client @@ -446,9 +446,9 @@ importers: react-dom: specifier: ^18.2.0 version: 18.2.0(react@18.2.0) - react-router-dom: - specifier: ^6.28.1 - version: 6.28.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0) + react-router: + specifier: ^7.1.1 + version: 7.1.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0) synapse-react-client: specifier: workspace:* version: link:../../../packages/synapse-react-client @@ -498,9 +498,9 @@ importers: react-dom: specifier: ^18.2.0 version: 18.2.0(react@18.2.0) - react-router-dom: - specifier: ^6.28.1 - version: 6.28.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0) + react-router: + specifier: ^7.1.1 + version: 7.1.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0) synapse-react-client: specifier: workspace:* version: link:../../../packages/synapse-react-client @@ -550,9 +550,9 @@ importers: react-dom: specifier: ^18.2.0 version: 18.2.0(react@18.2.0) - react-router-dom: - specifier: ^6.28.1 - version: 6.28.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0) + react-router: + specifier: ^7.1.1 + version: 7.1.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0) synapse-react-client: specifier: workspace:* version: link:../../../packages/synapse-react-client @@ -611,9 +611,9 @@ importers: react-dom: specifier: ^18.2.0 version: 18.2.0(react@18.2.0) - react-router-dom: - specifier: ^6.28.1 - version: 6.28.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0) + react-router: + specifier: ^7.1.1 + version: 7.1.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0) synapse-react-client: specifier: workspace:* version: link:../../../packages/synapse-react-client @@ -660,9 +660,9 @@ importers: react-dom: specifier: ^18.2.0 version: 18.2.0(react@18.2.0) - react-router-dom: - specifier: ^6.28.1 - version: 6.28.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0) + react-router: + specifier: ^7.1.1 + version: 7.1.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0) synapse-react-client: specifier: workspace:* version: link:../../../packages/synapse-react-client @@ -718,9 +718,9 @@ importers: react-dom: specifier: ^18.2.0 version: 18.2.0(react@18.2.0) - react-router-dom: - specifier: ^6.28.1 - version: 6.28.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0) + react-router: + specifier: ^7.1.1 + version: 7.1.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0) synapse-react-client: specifier: workspace:* version: link:../../../packages/synapse-react-client @@ -770,9 +770,9 @@ importers: react-dom: specifier: ^18.2.0 version: 18.2.0(react@18.2.0) - react-router-dom: - specifier: ^6.28.1 - version: 6.28.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0) + react-router: + specifier: ^7.1.1 + version: 7.1.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0) synapse-react-client: specifier: workspace:* version: link:../../../packages/synapse-react-client @@ -846,9 +846,9 @@ importers: react-dom: specifier: ^18.2.0 version: 18.2.0(react@18.2.0) - react-router-dom: - specifier: ^6.28.1 - version: 6.28.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0) + react-router: + specifier: ^7.1.1 + version: 7.1.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0) sass: specifier: ^1.71.1 version: 1.77.6 @@ -1036,9 +1036,9 @@ importers: react-plotly.js: specifier: ^2.6.0 version: 2.6.0(plotly.js@2.33.0(mapbox-gl@1.13.3))(react@18.2.0) - react-router-dom: - specifier: ^6.28.1 - version: 6.28.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0) + react-router: + specifier: ^7.1.1 + version: 7.1.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0) react-spinners: specifier: ^0.13.8 version: 0.13.8(react-dom@18.2.0(react@18.2.0))(react@18.2.0) @@ -1523,9 +1523,9 @@ importers: react-reflex: specifier: ^4.2.6 version: 4.2.6(react-dom@18.2.0(react@18.2.0))(react@18.2.0) - react-router-dom: - specifier: ^6.28.1 - version: 6.28.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0) + react-router: + specifier: ^7.1.1 + version: 7.1.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0) react-select: specifier: ^5.8.0 version: 5.8.0(@types/react@18.3.12)(react-dom@18.2.0(react@18.2.0))(react@18.2.0) @@ -1853,7 +1853,7 @@ importers: version: 1.0.1 postcss-normalize: specifier: ^10.0.1 - version: 10.0.1(browserslist@4.23.3)(postcss@8.4.39) + version: 10.0.1(browserslist@4.23.2)(postcss@8.4.39) prettier: specifier: ^2.8.8 version: 2.8.8 @@ -1922,7 +1922,7 @@ importers: dependencies: '@vitest/coverage-v8': specifier: ^1.6.0 - version: 1.6.0(vitest@1.6.0(@types/node@20.14.10)(@vitest/ui@1.6.0)(jsdom@21.1.2)(sass@1.77.6)(terser@5.31.2)) + version: 1.6.0(vitest@1.6.0(@types/node@20.17.12)(@vitest/ui@1.6.0)(jsdom@21.1.2)(sass@1.77.6)(terser@5.37.0)) '@vitest/ui': specifier: ^1.6.0 version: 1.6.0(vitest@1.6.0) @@ -4328,10 +4328,6 @@ packages: peerDependencies: redux: ^3.1.0 || ^4.0.0 || ^5.0.0 - '@remix-run/router@1.21.0': - resolution: {integrity: sha512-xfSkCAchbdG5PnbrKqFWwia4Bi61nH+wm8wLEqfHDyp7Y3dZzgqS2itV8i4gAq9pC2HsTpwyBC6Ds8VHZ96JlA==} - engines: {node: '>=14.0.0'} - '@restart/context@2.1.4': resolution: {integrity: sha512-INJYZQJP7g+IoDUh/475NlGiTeMfwTXUEr3tmRneckHIxNolGOW9CTq83S8cxq0CgJwwcMzMJFchxvlwe7Rk8Q==} peerDependencies: @@ -6711,6 +6707,10 @@ packages: resolution: {integrity: sha512-YZ3GUyn/o8gfKJlnlX7g7xq4gyO6OSuhGPKaaGssGB2qgDUS0gPgtTvoyZLTt9Ab6dC4hfc9dV5arkvc/OCmrw==} engines: {node: '>= 0.6'} + cookie@1.0.2: + resolution: {integrity: sha512-9Kr/j4O16ISv8zBBhJoi4bXOYNTkFLOqSL3UDB0njXxCXNezjeyVrJyGOWtgfs/q2km1gwBcfH8q1yEGoMYunA==} + engines: {node: '>=18'} + copyfiles@2.4.1: resolution: {integrity: sha512-fereAvAvxDrQDOXybk3Qu3dPbOoKoysFMWtkY3mv5BsL8//OSZVL5DCLYqgRfY5cWirgRzlC+WSrxp6Bo3eNZg==} hasBin: true @@ -9963,18 +9963,15 @@ packages: react: ^16.14.0 || ^17.0.0 || ^18.0.0 react-dom: ^16.14.0 || ^17.0.0 || ^18.0.0 - react-router-dom@6.28.1: - resolution: {integrity: sha512-YraE27C/RdjcZwl5UCqF/ffXnZDxpJdk9Q6jw38SZHjXs7NNdpViq2l2c7fO7+4uWaEfcwfGCv3RSg4e1By/fQ==} - engines: {node: '>=14.0.0'} - peerDependencies: - react: '>=16.8' - react-dom: '>=16.8' - - react-router@6.28.1: - resolution: {integrity: sha512-2omQTA3rkMljmrvvo6WtewGdVh45SpL9hGiCI9uUrwGGfNFDIvGK4gYJsKlJoNVi6AQZcopSCballL+QGOm7fA==} - engines: {node: '>=14.0.0'} + react-router@7.1.1: + resolution: {integrity: sha512-39sXJkftkKWRZ2oJtHhCxmoCrBCULr/HAH4IT5DHlgu/Q0FCPV0S4Lx+abjDTx/74xoZzNYDYbOZWlJjruyuDQ==} + engines: {node: '>=20.0.0'} peerDependencies: - react: '>=16.8' + react: '>=18' + react-dom: '>=18' + peerDependenciesMeta: + react-dom: + optional: true react-select-event@5.5.1: resolution: {integrity: sha512-goAx28y0+iYrbqZA2FeRTreHHs/ZtSuKxtA+J5jpKT5RHPCbVZJ4MqACfPnWyFXsEec+3dP5bCrNTxIX8oYe9A==} @@ -10364,6 +10361,9 @@ packages: set-cookie-parser@2.6.0: resolution: {integrity: sha512-RVnVQxTXuerk653XfuliOxBP81Sf0+qfQE73LIYKcyMYHG94AuH0kgrQpRDuTZnSmjpysHmzxJXKNfa6PjFhyQ==} + set-cookie-parser@2.7.1: + resolution: {integrity: sha512-IOc8uWeOZgnb3ptbCURJWNjWUPcO3ZnTTdzsurqERrP6nPyv+paC55vJM0LpOlT2ne+Ix+9+CRG1MNLlyZ4GjQ==} + set-function-length@1.2.2: resolution: {integrity: sha512-pgRc4hJ4/sNjWCSS9AmnS40x3bNMDTknHgL5UaMBTMyJnU90EgWh1Rz+MC9eFu4BuN/UwZjKQuY/1v3rM7HMfg==} engines: {node: '>= 0.4'} @@ -10732,11 +10732,6 @@ packages: engines: {node: '>=10'} hasBin: true - terser@5.31.2: - resolution: {integrity: sha512-LGyRZVFm/QElZHy/CPr/O4eNZOZIzsrQ92y4v9UJe/pFJjypje2yI3C2FmPtvUEnhadlSbmG2nXtdcjHOjCfxw==} - engines: {node: '>=10'} - hasBin: true - terser@5.37.0: resolution: {integrity: sha512-B8wRRkmre4ERucLM/uXx4MOV5cbnOlVAqUst+1+iLKPI0dOgFO28f84ptoQt9HEI537PMzfYa/d+GEPKTRXmYA==} engines: {node: '>=10'} @@ -10940,6 +10935,9 @@ packages: tty-browserify@0.0.1: resolution: {integrity: sha512-C3TaO7K81YvjCgQH9Q1S3R3P3BtN3RIM8n+OvX4il1K1zgE8ZhI0op7kClgkxtutIE8hQrcrHBXvIheqKUUCxw==} + turbo-stream@2.4.0: + resolution: {integrity: sha512-FHncC10WpBd2eOmGwpmQsWLDoK4cqsA/UT/GqNoaKOQnT8uzhtCbg3EoUDMvqpOSAI0S26mr0rkjzbOO6S3v1g==} + type-check@0.4.0: resolution: {integrity: sha512-XleUoc9uwGXqjWwXaUTZAmzMcFZ5858QA2vvx1Ur5xIcixXIP+8LnFDgRplU30us6teqdlskFfu+ae4K79Ooew==} engines: {node: '>= 0.8.0'} @@ -14605,8 +14603,6 @@ snapshots: immutable: 4.3.5 redux: 5.0.1 - '@remix-run/router@1.21.0': {} - '@restart/context@2.1.4(react@18.2.0)': dependencies: react: 18.2.0 @@ -16262,7 +16258,7 @@ snapshots: transitivePeerDependencies: - supports-color - '@vitest/coverage-v8@1.6.0(vitest@1.6.0(@types/node@20.14.10)(@vitest/ui@1.6.0)(jsdom@21.1.2)(sass@1.77.6)(terser@5.31.2))': + '@vitest/coverage-v8@1.6.0(vitest@1.6.0(@types/node@20.14.10)(@vitest/ui@1.6.0)(jsdom@21.1.2)(sass@1.77.6)(terser@5.37.0))': dependencies: '@ampproject/remapping': 2.3.0 '@bcoe/v8-coverage': 0.2.3 @@ -16277,11 +16273,11 @@ snapshots: std-env: 3.7.0 strip-literal: 2.1.0 test-exclude: 6.0.0 - vitest: 1.6.0(@types/node@20.14.10)(@vitest/ui@1.6.0)(jsdom@21.1.2)(sass@1.77.6)(terser@5.31.2) + vitest: 1.6.0(@types/node@20.14.10)(@vitest/ui@1.6.0)(jsdom@21.1.2)(sass@1.77.6)(terser@5.37.0) transitivePeerDependencies: - supports-color - '@vitest/coverage-v8@1.6.0(vitest@1.6.0(@types/node@20.14.10)(@vitest/ui@1.6.0)(jsdom@21.1.2)(sass@1.77.6)(terser@5.37.0))': + '@vitest/coverage-v8@1.6.0(vitest@1.6.0(@types/node@20.17.12)(@vitest/ui@1.6.0)(jsdom@21.1.2)(sass@1.77.6)(terser@5.37.0))': dependencies: '@ampproject/remapping': 2.3.0 '@bcoe/v8-coverage': 0.2.3 @@ -16296,7 +16292,7 @@ snapshots: std-env: 3.7.0 strip-literal: 2.1.0 test-exclude: 6.0.0 - vitest: 1.6.0(@types/node@20.14.10)(@vitest/ui@1.6.0)(jsdom@21.1.2)(sass@1.77.6)(terser@5.37.0) + vitest: 1.6.0(@types/node@20.17.12)(@vitest/ui@1.6.0)(jsdom@21.1.2)(sass@1.77.6)(terser@5.37.0) transitivePeerDependencies: - supports-color @@ -17441,6 +17437,8 @@ snapshots: cookie@0.5.0: {} + cookie@1.0.2: {} + copyfiles@2.4.1: dependencies: glob: 7.2.3 @@ -21239,6 +21237,11 @@ snapshots: possible-typed-array-names@1.0.0: {} + postcss-browser-comments@4.0.0(browserslist@4.23.2)(postcss@8.4.39): + dependencies: + browserslist: 4.23.2 + postcss: 8.4.39 + postcss-browser-comments@4.0.0(browserslist@4.23.3)(postcss@8.4.39): dependencies: browserslist: 4.23.3 @@ -21252,6 +21255,14 @@ snapshots: postcss: 8.4.39 ts-node: 10.9.2(@types/node@20.14.10)(typescript@5.5.2) + postcss-normalize@10.0.1(browserslist@4.23.2)(postcss@8.4.39): + dependencies: + '@csstools/normalize.css': 12.1.1 + browserslist: 4.23.2 + postcss: 8.4.39 + postcss-browser-comments: 4.0.0(browserslist@4.23.2)(postcss@8.4.39) + sanitize.css: 13.0.0 + postcss-normalize@10.0.1(browserslist@4.23.3)(postcss@8.4.39): dependencies: '@csstools/normalize.css': 12.1.1 @@ -21597,17 +21608,15 @@ snapshots: react: 18.2.0 react-dom: 18.2.0(react@18.2.0) - react-router-dom@6.28.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0): + react-router@7.1.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0): dependencies: - '@remix-run/router': 1.21.0 + '@types/cookie': 0.6.0 + cookie: 1.0.2 react: 18.2.0 + set-cookie-parser: 2.7.1 + turbo-stream: 2.4.0 + optionalDependencies: react-dom: 18.2.0(react@18.2.0) - react-router: 6.28.1(react@18.2.0) - - react-router@6.28.1(react@18.2.0): - dependencies: - '@remix-run/router': 1.21.0 - react: 18.2.0 react-select-event@5.5.1: dependencies: @@ -22144,6 +22153,8 @@ snapshots: set-cookie-parser@2.6.0: {} + set-cookie-parser@2.7.1: {} + set-function-length@1.2.2: dependencies: define-data-property: 1.1.4 @@ -22555,14 +22566,6 @@ snapshots: commander: 2.20.3 source-map-support: 0.5.21 - terser@5.31.2: - dependencies: - '@jridgewell/source-map': 0.3.6 - acorn: 8.14.0 - commander: 2.20.3 - source-map-support: 0.5.21 - optional: true - terser@5.37.0: dependencies: '@jridgewell/source-map': 0.3.6 @@ -22773,6 +22776,8 @@ snapshots: tty-browserify@0.0.1: {} + turbo-stream@2.4.0: {} + type-check@0.4.0: dependencies: prelude-ls: 1.2.1 @@ -23025,24 +23030,6 @@ snapshots: validate.io-number@1.0.3: {} - vite-node@1.6.0(@types/node@20.14.10)(sass@1.77.6)(terser@5.31.2): - dependencies: - cac: 6.7.14 - debug: 4.3.5 - pathe: 1.1.2 - picocolors: 1.0.1 - vite: 5.4.3(@types/node@20.14.10)(sass@1.77.6)(terser@5.31.2) - transitivePeerDependencies: - - '@types/node' - - less - - lightningcss - - sass - - sass-embedded - - stylus - - sugarss - - supports-color - - terser - vite-node@1.6.0(@types/node@20.14.10)(sass@1.77.6)(terser@5.37.0): dependencies: cac: 6.7.14 @@ -23150,17 +23137,6 @@ snapshots: - supports-color - typescript - vite@5.4.3(@types/node@20.14.10)(sass@1.77.6)(terser@5.31.2): - dependencies: - esbuild: 0.21.5 - postcss: 8.4.39 - rollup: 4.21.2 - optionalDependencies: - '@types/node': 20.14.10 - fsevents: 2.3.3 - sass: 1.77.6 - terser: 5.31.2 - vite@5.4.3(@types/node@20.14.10)(sass@1.77.6)(terser@5.37.0): dependencies: esbuild: 0.21.5 @@ -23183,42 +23159,6 @@ snapshots: sass: 1.77.6 terser: 5.37.0 - vitest@1.6.0(@types/node@20.14.10)(@vitest/ui@1.6.0)(jsdom@21.1.2)(sass@1.77.6)(terser@5.31.2): - dependencies: - '@vitest/expect': 1.6.0 - '@vitest/runner': 1.6.0 - '@vitest/snapshot': 1.6.0 - '@vitest/spy': 1.6.0 - '@vitest/utils': 1.6.0 - acorn-walk: 8.3.3 - chai: 4.4.1 - debug: 4.3.5 - execa: 8.0.1 - local-pkg: 0.5.0 - magic-string: 0.30.10 - pathe: 1.1.2 - picocolors: 1.0.1 - std-env: 3.7.0 - strip-literal: 2.1.0 - tinybench: 2.8.0 - tinypool: 0.8.4 - vite: 5.4.3(@types/node@20.14.10)(sass@1.77.6)(terser@5.31.2) - vite-node: 1.6.0(@types/node@20.14.10)(sass@1.77.6)(terser@5.31.2) - why-is-node-running: 2.2.2 - optionalDependencies: - '@types/node': 20.14.10 - '@vitest/ui': 1.6.0(vitest@1.6.0) - jsdom: 21.1.2 - transitivePeerDependencies: - - less - - lightningcss - - sass - - sass-embedded - - stylus - - sugarss - - supports-color - - terser - vitest@1.6.0(@types/node@20.14.10)(@vitest/ui@1.6.0)(jsdom@21.1.2)(sass@1.77.6)(terser@5.37.0): dependencies: '@vitest/expect': 1.6.0