MED-140: ui fixes (#69)

* MED-140: ui fixes

* make accountid optional in hook

app/home/(user)/_components/home-mobile-navigation.tsx

@@ -1,12 +1,16 @@
 'use client';
 
+import { useMemo } from 'react';
+
 import Link from 'next/link';
 
 import { StoreCart } from '@medusajs/types';
-import { LogOut, Menu, ShoppingCart } from 'lucide-react';
+import { Cross, LogOut, Menu, Shield, ShoppingCart } from 'lucide-react';
 
+import { usePersonalAccountData } from '@kit/accounts/hooks/use-personal-account-data';
+import { ApplicationRoleEnum } from '@kit/accounts/types/accounts';
 import {
-  featureFlagsConfig,
+  pathsConfig,
   personalAccountNavigationConfig,
 } from '@kit/shared/config';
 import { useSignOut } from '@kit/supabase/hooks/use-sign-out';
@@ -15,7 +19,6 @@ import {
   DropdownMenuContent,
   DropdownMenuGroup,
   DropdownMenuItem,
-  DropdownMenuLabel,
   DropdownMenuSeparator,
   DropdownMenuTrigger,
 } from '@kit/ui/dropdown-menu';
@@ -23,14 +26,16 @@ import { If } from '@kit/ui/if';
 import { Trans } from '@kit/ui/trans';
 
 // home imports
-import { HomeAccountSelector } from '../_components/home-account-selector';
 import type { UserWorkspace } from '../_lib/server/load-user-workspace';
 
 export function HomeMobileNavigation(props: {
   workspace: UserWorkspace;
   cart: StoreCart | null;
 }) {
+  const user = props.workspace.user;
+
   const signOut = useSignOut();
+  const { data: personalAccountData } = usePersonalAccountData(user.id);
 
   const Links = personalAccountNavigationConfig.routes.map((item, index) => {
     if ('children' in item) {
@@ -51,7 +56,29 @@ export function HomeMobileNavigation(props: {
     }
   });
 
-  const cartQuantityTotal = props.cart?.items?.reduce((acc, item) => acc + item.quantity, 0) ?? 0;
+  const hasTotpFactor = useMemo(() => {
+    const factors = user?.factors ?? [];
+    return factors.some(
+      (factor) => factor.factor_type === 'totp' && factor.status === 'verified',
+    );
+  }, [user?.factors]);
+
+  const isSuperAdmin = useMemo(() => {
+    const hasAdminRole =
+      personalAccountData?.application_role === ApplicationRoleEnum.SuperAdmin;
+
+    return hasAdminRole && hasTotpFactor;
+  }, [user, personalAccountData, hasTotpFactor]);
+
+  const isDoctor = useMemo(() => {
+    const hasDoctorRole =
+      personalAccountData?.application_role === ApplicationRoleEnum.Doctor;
+
+    return hasDoctorRole && hasTotpFactor;
+  }, [user, personalAccountData, hasTotpFactor]);
+
+  const cartQuantityTotal =
+    props.cart?.items?.reduce((acc, item) => acc + item.quantity, 0) ?? 0;
   const hasCartItems = cartQuantityTotal > 0;
 
   return (
@@ -61,22 +88,6 @@ export function HomeMobileNavigation(props: {
       </DropdownMenuTrigger>
 
       <DropdownMenuContent sideOffset={10} className={'w-screen rounded-none'}>
-        <If condition={featureFlagsConfig.enableTeamAccounts}>
-          <DropdownMenuGroup>
-            <DropdownMenuLabel>
-              <Trans i18nKey={'common:yourAccounts'} />
-            </DropdownMenuLabel>
-
-            <HomeAccountSelector
-              userId={props.workspace.user.id}
-              accounts={props.workspace.accounts}
-              collisionPadding={0}
-            />
-          </DropdownMenuGroup>
-
-          <DropdownMenuSeparator />
-        </If>
-
         <If condition={props.cart && hasCartItems}>
           <DropdownMenuGroup>
             <DropdownLink
@@ -91,6 +102,41 @@ export function HomeMobileNavigation(props: {
 
         <DropdownMenuGroup>{Links}</DropdownMenuGroup>
 
+        <If condition={isSuperAdmin}>
+          <DropdownMenuSeparator />
+
+          <DropdownMenuItem asChild>
+            <Link
+              className={
+                's-full flex cursor-pointer items-center space-x-2 text-yellow-700 dark:text-yellow-500'
+              }
+              href={pathsConfig.app.admin}
+            >
+              <Shield className={'h-5'} />
+
+              <span>Super Admin</span>
+            </Link>
+          </DropdownMenuItem>
+        </If>
+
+        <If condition={isDoctor}>
+          <DropdownMenuSeparator />
+
+          <DropdownMenuItem asChild>
+            <Link
+              className={
+                'flex h-full cursor-pointer items-center space-x-2 text-yellow-700 dark:text-yellow-500'
+              }
+              href={pathsConfig.app.doctor}
+            >
+              <Cross className={'h-5'} />
+
+              <span>
+                <Trans i18nKey="common:doctor" />
+              </span>
+            </Link>
+          </DropdownMenuItem>
+        </If>
         <DropdownMenuSeparator />
 
         <SignOutDropdownItem onSignOut={() => signOut.mutateAsync()} />