diff --git a/frontend/cypress/support/commands.ts b/frontend/cypress/support/commands.ts index fdbea23436..528146d5bc 100644 --- a/frontend/cypress/support/commands.ts +++ b/frontend/cypress/support/commands.ts @@ -30,7 +30,7 @@ const AUTH_PASSWORD = Cypress.env('AUTH_PASSWORD'); Cypress.Commands.add('login', (user = AUTH_USER, password = AUTH_PASSWORD) => cy.session(user, () => { cy.visit('/'); - cy.wait(1000); + cy.wait(1500); cy.get("[data-testid='LOGIN_EMAIL_ID']").type(user); if (AUTH_PASSWORD) { diff --git a/frontend/src/component/App.tsx b/frontend/src/component/App.tsx index 0b7ebc4e8e..d5b4f9162a 100644 --- a/frontend/src/component/App.tsx +++ b/frontend/src/component/App.tsx @@ -1,4 +1,4 @@ -import { Suspense } from 'react'; +import { Suspense, useCallback, useEffect, useState } from 'react'; import { Navigate, Route, Routes } from 'react-router-dom'; import { ErrorBoundary } from 'react-error-boundary'; import { Error } from 'component/layout/Error/Error'; @@ -17,14 +17,48 @@ import { useAuthUser } from 'hooks/api/getters/useAuth/useAuthUser'; import { SplashPageRedirect } from 'component/splash/SplashPageRedirect/SplashPageRedirect'; import { useStyles } from './App.styles'; import useUiConfig from 'hooks/api/getters/useUiConfig/useUiConfig'; +import useProjects from '../hooks/api/getters/useProjects/useProjects'; +import { useLastViewedProject } from '../hooks/useLastViewedProject'; + +const InitialRedirect = () => { + const { lastViewed } = useLastViewedProject(); + const { projects, loading } = useProjects(); + + const [redirectTo, setRedirectTo] = useState(); + + const getRedirect = useCallback(() => { + if (projects && lastViewed) { + return `/projects/${lastViewed}`; + } + + if (projects && !lastViewed && projects.length === 1) { + return `/projects/${projects[0].id}`; + } + + return '/projects'; + }, [lastViewed, projects]); + + useEffect(() => { + if (!loading) { + setRedirectTo(getRedirect()); + } + }, [loading, getRedirect]); + + if (loading || !redirectTo) { + return ; + } + + return ; +}; export const App = () => { - const { classes: styles } = useStyles(); const { authDetails } = useAuthDetails(); const { user } = useAuthUser(); - const { isOss } = useUiConfig(); const hasFetchedAuth = Boolean(authDetails || user); + const { classes: styles } = useStyles(); + const { isOss } = useUiConfig(); + const availableRoutes = isOss() ? routes.filter(route => !route.enterprise) : routes; @@ -38,44 +72,41 @@ export const App = () => { condition={!hasFetchedAuth} show={} elseShow={ -
- - - {availableRoutes.map(route => ( - - - - } - /> - ))} - +
+ + + {availableRoutes.map(route => ( + + + + } /> - } - /> - } - /> - - - -
+ ))} + } + /> + } + /> +
+ + +
+ } /> diff --git a/frontend/src/component/project/ProjectList/ProjectList.tsx b/frontend/src/component/project/ProjectList/ProjectList.tsx index dab56aaf1b..522ec04647 100644 --- a/frontend/src/component/project/ProjectList/ProjectList.tsx +++ b/frontend/src/component/project/ProjectList/ProjectList.tsx @@ -1,5 +1,5 @@ import { useContext, useEffect, useMemo, useState } from 'react'; -import { Link, Navigate, useNavigate, useSearchParams } from 'react-router-dom'; +import { Link, useNavigate, useSearchParams } from 'react-router-dom'; import { mutate } from 'swr'; import { getProjectFetcher } from 'hooks/api/getters/useProject/getProjectFetcher'; import useProjects from 'hooks/api/getters/useProjects/useProjects'; @@ -152,10 +152,6 @@ export const ProjectListNew = () => { ? `${filteredProjects.length} of ${projects.length}` : projects.length; - if (projects?.length === 1) { - return ; - } - return (
{ const { classes: styles } = useStyles(); const { authDetails } = useAuthDetails(); const { user } = useAuthUser(); - const { lastViewed } = useLastViewedProject(); const query = useQueryParams(); const resetPassword = query.get('reset') === 'true'; const invited = query.get('invited') === 'true'; - - const getRedirect = () => { - return lastViewed == null ? '/projects' : `/projects/${lastViewed}`; - }; - - const redirect = query.get('redirect') || getRedirect(); + const redirect = query.get('redirect') || '/'; if (user) { return ; diff --git a/frontend/src/hooks/useLastViewedProject.ts b/frontend/src/hooks/useLastViewedProject.ts index 12af31da6d..5b514e8c52 100644 --- a/frontend/src/hooks/useLastViewedProject.ts +++ b/frontend/src/hooks/useLastViewedProject.ts @@ -1,5 +1,5 @@ import { useEffect, useState } from 'react'; -import { setLocalStorageItem, getLocalStorageItem } from '../utils/storage'; +import { getLocalStorageItem, setLocalStorageItem } from '../utils/storage'; import useUiConfig from './api/getters/useUiConfig/useUiConfig'; export const useLastViewedProject = () => {