From 20f81838bd21a87e28d5987cef8243d133a72e32 Mon Sep 17 00:00:00 2001 From: Julien Seren-Rosso Date: Thu, 9 Jan 2025 16:59:41 +0100 Subject: [PATCH] Reworks Header and routing --- back/src/routers/auth-router.ts | 2 +- front/src/Apps/Dashboard/DashboardRoutes.tsx | 4 +- .../Apps/common/Components/layout/Header.tsx | 285 +++++++++--------- .../Apps/common/Components/layout/Layout.tsx | 10 +- .../Components/layout/LayoutContainer.tsx | 64 ++-- front/src/graphql-client.ts | 10 +- 6 files changed, 198 insertions(+), 177 deletions(-) diff --git a/back/src/routers/auth-router.ts b/back/src/routers/auth-router.ts index a99ff2431fa..2f9e15fa998 100644 --- a/back/src/routers/auth-router.ts +++ b/back/src/routers/auth-router.ts @@ -44,7 +44,7 @@ authRouter.post( } req.logIn(user, () => { storeUserSessionsId(user.id, req.session.id); - const returnTo = req.body.returnTo || "/"; + const returnTo = req.body.returnTo || "/dashboard"; return res.redirect(`${UI_BASE_URL}${returnTo}`); }); })(req, res, next); diff --git a/front/src/Apps/Dashboard/DashboardRoutes.tsx b/front/src/Apps/Dashboard/DashboardRoutes.tsx index db9c7eb08d0..342cd2652de 100644 --- a/front/src/Apps/Dashboard/DashboardRoutes.tsx +++ b/front/src/Apps/Dashboard/DashboardRoutes.tsx @@ -65,7 +65,7 @@ const toRelative = route => { function DashboardRoutes() { const { siret } = useParams<{ siret: string }>(); - const { data } = useQuery>(GET_ME); + const { data, loading } = useQuery>(GET_ME); const { updatePermissions } = usePermissions(); const navigate = useNavigate(); @@ -108,7 +108,7 @@ function DashboardRoutes() { } }, [updatePermissions, data, siret]); - if (data?.me == null) { + if (loading || data?.me == null) { return ; } diff --git a/front/src/Apps/common/Components/layout/Header.tsx b/front/src/Apps/common/Components/layout/Header.tsx index 98c5402c492..6aa45db5199 100644 --- a/front/src/Apps/common/Components/layout/Header.tsx +++ b/front/src/Apps/common/Components/layout/Header.tsx @@ -673,7 +673,153 @@ export default function Header() { canViewNewRegistry ); - return !isAuthenticated ? ( + return ( + <> + + + {/* Company switcher on top of the page */} + {!!matchDashboard && companies && currentCompany && ( +
+
+ +
+
+ )} + + ); +} + +/** + * Main nav when logged out + * Contains External and internal links + * On mobile appear as a sliding panel and includes other items + */ +export function UnauthenticatedHeader() { + return ( - ) : ( - <> - - - {/* Company switcher on top of the page */} - {!!matchDashboard && companies && currentCompany && ( -
-
- -
-
- )} - ); } diff --git a/front/src/Apps/common/Components/layout/Layout.tsx b/front/src/Apps/common/Components/layout/Layout.tsx index ebd578f7a90..1577f251307 100644 --- a/front/src/Apps/common/Components/layout/Layout.tsx +++ b/front/src/Apps/common/Components/layout/Layout.tsx @@ -3,7 +3,7 @@ import { gql, useQuery } from "@apollo/client"; import Button from "@codegouvfr/react-dsfr/Button"; import { Query } from "@td/codegen-ui"; import { Outlet } from "react-router-dom"; -import Header from "./Header"; +import Header, { UnauthenticatedHeader } from "./Header"; import { Toaster } from "react-hot-toast"; import sandboxIcon from "./assets/code-sandbox.svg"; import downtimeIcon from "./assets/code-downtime.svg"; @@ -12,6 +12,7 @@ import A11ySkipLinks from "../A11ySkipLinks/A11ySkipLinks"; interface AuthProps { v2banner?: JSX.Element; + unauthenticatedRoutes?: boolean; } const { VITE_WARNING_MESSAGE, VITE_DOWNTIME_MESSAGE, VITE_API_ENDPOINT } = import.meta.env; @@ -25,7 +26,10 @@ const GET_WARNING_MESSAGE = gql` /** * Layout with common elements to all routes */ -export default function Layout({ v2banner }: AuthProps) { +export default function Layout({ + v2banner, + unauthenticatedRoutes = false +}: AuthProps) { const { data } = useQuery>(GET_WARNING_MESSAGE); const isIE11 = !!navigator.userAgent.match(/Trident.*rv:11\./); @@ -95,7 +99,7 @@ export default function Layout({ v2banner }: AuthProps) { )} -
+ {unauthenticatedRoutes ? :
} diff --git a/front/src/Apps/common/Components/layout/LayoutContainer.tsx b/front/src/Apps/common/Components/layout/LayoutContainer.tsx index 7df72177d04..4cc694d8e3c 100644 --- a/front/src/Apps/common/Components/layout/LayoutContainer.tsx +++ b/front/src/Apps/common/Components/layout/LayoutContainer.tsx @@ -7,8 +7,6 @@ import ResendActivationEmail from "../../../../login/ResendActivationEmail"; import Login from "../../../../login/Login"; import SurveyBanner from "../SurveyBanner/SurveyBanner"; import { RequireAuth, Redirect } from "../../../utils/routerUtils"; -import { getDefaultOrgId } from "../CompanySwitcher/CompanySwitcher"; -import { usePermissions } from "../../../../common/contexts/PermissionsContext"; import Exports from "../../../../dashboard/exports/Registry"; import { Oauth2Dialog, OidcDialog } from "../../../../oauth/AuthDialog"; import { MyImports } from "../../../../dashboard/registry/MyImports"; @@ -55,9 +53,6 @@ const BANNER_MESSAGES = [ ]; export default function LayoutContainer() { - // const { orgId } = usePermissions(); - // const defaultOrgId = orgId ?? getDefaultOrgId([]); - return ( }> @@ -78,6 +73,33 @@ export default function LayoutContainer() { } /> + + }> + } /> + + } /> + + } /> + + } /> + + } /> + + } + /> + + } /> + + } /> + + } + /> + + - } /> - - } /> - - } /> - - } /> - } + path={routes.company} + element={ + + + + } /> - } /> - - } /> - } + path={routes.wasteTree} + element={ + + + + } /> - } /> - - } /> - } diff --git a/front/src/graphql-client.ts b/front/src/graphql-client.ts index 336d5f276b6..f6339157307 100644 --- a/front/src/graphql-client.ts +++ b/front/src/graphql-client.ts @@ -53,14 +53,8 @@ const errorLink = onError(({ response, graphQLErrors }) => { // If we catch an UNAUTHENTICATED exception at this point, // the user session has probably expired. Redirect to login // page with a hint in the URL to display a message - if ( - window.location.pathname !== "/" && - window.location.pathname !== "/login" - ) { - // Logout - localAuthService.locallySignOut(); - window.location.href = "/login?session=expired"; - } + localAuthService.locallySignOut(); + window.location.href = "/login?session=expired"; } } }