Merge pull request #501 from IntersectMBO/fix/sign-up-modal-always-di…

…splayed-if-there-is-no-username fix: Sign up modal always displayed if there is no username
IntersectMBO · Dec 17, 2024 · 13de216 · 13de216
2 parents a3325f5 + bfe3db7
commit 13de216
Show file tree

Hide file tree

Showing 2 changed files with 38 additions and 24 deletions.
diff --git a/frontend/src/app/[locale]/verify/register/page.tsx b/frontend/src/app/[locale]/verify/register/page.tsx
@@ -16,7 +16,6 @@ import { useTranslations } from "next-intl";
 export default function VerifyRegister({ searchParams }) {
   const router = useRouter();
   const { setUserSession } = useAppContext();
-  const { openModal } = useModal<SignupModalState>();
   const { addErrorAlert } = useSnackbar();
   const t = useTranslations();
   const accessToken = useMemo(() => Cookies.get(cookieStore.token), []);
@@ -32,16 +31,16 @@ export default function VerifyRegister({ searchParams }) {
         setUserSession(session);
         const redirectURL = getRoleBasedHomeRedirectURL(response?.user.role);
         router.push(redirectURL);
-        if (!isAnyAdminRole(session.role)) {
-          openModal({
-            type: "signUpModal",
-            state: {
-              showCloseButton: false,
-              title: t("Modals.signUp.headline"),
-              description: t("Modals.signUp.description"),
-            },
-          });
-        }
+        // if (!isAnyAdminRole(session.role)) {
+        //   openModal({
+        //     type: "signUpModal",
+        //     state: {
+        //       showCloseButton: false,
+        //       title: t("Modals.signUp.headline"),
+        //       description: t("Modals.signUp.description"),
+        //     },
+        //   });
+        // }
       }
     };
 

diff --git a/frontend/src/components/organisms/TopNavigation/TopNav.tsx b/frontend/src/components/organisms/TopNavigation/TopNav.tsx
@@ -1,5 +1,5 @@
 "use client";
-import { useState } from "react";
+import { useEffect, useState } from "react";
 
 import { Box, ButtonBase, Grid, IconButton } from "@mui/material";
 
@@ -10,18 +10,21 @@ import {
   IMAGES,
   NAV_ITEMS,
   PATHS,
-  PROTECTED_NAV_ITEMS
+  PROTECTED_NAV_ITEMS,
 } from "@consts";
-import { useAppContext } from "@context";
+import { useAppContext, useModal } from "@context";
 import { isAnyAdminRole, isUserRole } from "@utils";
 import { useTranslations } from "next-intl";
 import { DrawerMobile } from "./DrawerMobile";
 import { TopNavWrapper } from "./TopNavWrapper";
+import { SignupModalState } from "../types";
 
 export const TopNav = () => {
   const { userSession, user } = useAppContext();
-  const t = useTranslations("Navigation");
+
+  const t = useTranslations();
   const [isDrawerOpen, setIsDrawerOpen] = useState<boolean>(false);
+  const { openModal } = useModal<SignupModalState>();
 
   const openDrawer = () => {
     setIsDrawerOpen(true);
@@ -35,8 +38,8 @@ export const TopNav = () => {
           sx={{
             // Change ripple color
             ".MuiTouchRipple-rippleVisible": {
-              color: `${customPalette.ripple}`
-            }
+              color: `${customPalette.ripple}`,
+            },
           }}
         >
           <Link
@@ -63,7 +66,7 @@ export const TopNav = () => {
               data-testid="top-nav-admin-dashboard-button"
               sx={{ width: "100%;" }}
             >
-              {t("adminDashboard")}
+              {t("Navigation.adminDashboard")}
             </Button>
           </Box>
         )} */}
@@ -74,15 +77,27 @@ export const TopNav = () => {
   const renderUserProfileDropdown = () => {
     return (
       <>
-        {isUserRole(userSession.role) ||
-          (isAnyAdminRole(userSession.role) && (
-            <Box ml={{ md: 3 }}>
-              <UserProfileButton user={user} />
-            </Box>
-          ))}
+        {(isUserRole(userSession.role) || isAnyAdminRole(userSession.role)) && (
+          <Box ml={{ md: 3 }}>
+            <UserProfileButton user={user} />
+          </Box>
+        )}
       </>
     );
   };
+  useEffect(() => {
+    if (user && !user?.name && isUserRole(userSession.role)) {
+      openModal({
+        type: "signUpModal",
+        state: {
+          showCloseButton: false,
+          title: t("Modals.signUp.headline"),
+          description: t("Modals.signUp.description"),
+        },
+      });
+    }
+  }, [user]);
+
   return (
     <TopNavWrapper homeRedirectionPath={PATHS.home}>
       <Box sx={{ display: { xxs: "none", md: "block" } }}>