diff --git a/src/shared/components/HeaderUserMenu.tsx b/src/shared/components/HeaderUserMenu.tsx index e1588f3..990f715 100644 --- a/src/shared/components/HeaderUserMenu.tsx +++ b/src/shared/components/HeaderUserMenu.tsx @@ -2,15 +2,12 @@ import { removeRefreshToken, removeToken } from "@/config/func"; import { Paths } from "@/config/Paths"; import { useAuth } from "@/context/AuthContext"; import { useGetBusiness } from "@/pages/business/hooks/useBusinessData"; -import { - getAdminFullName, - type BusinessType, -} from "@/pages/business/types/Types"; +import { getAdminFullName, type BusinessType } from "@/pages/business/types/Types"; import { Popover, PopoverButton, PopoverPanel } from "@headlessui/react"; -import { ArrowDown2, CloseCircle, Logout } from "iconsax-react"; -import { useState, type FC } from "react"; +import { ArrowDown2, CloseCircle, DocumentText, Logout } from "iconsax-react"; +import { useEffect, useState, type FC } from "react"; import { useTranslation } from "react-i18next"; -import { Link } from "react-router-dom"; +import { Link, useLocation } from "react-router-dom"; type BusinessLogoProps = { business: BusinessType; @@ -23,25 +20,18 @@ const BusinessLogo: FC = ({ business, size = "sm" }) => { if (business.logoUrl) { return ( -
+
); } - return ( -
- {initial} -
- ); + return
{initial}
; }; const HeaderUserMenu: FC = () => { const [popoverKey, setPopoverKey] = useState(0); + const location = useLocation(); const { t } = useTranslation("global"); const { data: businessResponse } = useGetBusiness(); const { refreshAuth } = useAuth(); @@ -50,6 +40,12 @@ const HeaderUserMenu: FC = () => { const admin = business?.admin; const adminName = getAdminFullName(admin); + const closePopover = () => setPopoverKey((key) => key + 1); + + useEffect(() => { + setPopoverKey((key) => key + 1); + }, [location.pathname]); + if (!business) return null; const handleLogout = () => { @@ -59,8 +55,6 @@ const HeaderUserMenu: FC = () => { window.location.href = Paths.home; }; - const closeMobilePanel = () => setPopoverKey((key) => key + 1); - return ( @@ -78,32 +72,25 @@ const HeaderUserMenu: FC = () => { anchor="bottom" className="flex xl:ml-6 overflow-auto flex-col gap-3 bg-white boxShadow xl:mt-7 z-30 py-4 text-xs rounded-2.5 xl:w-[300px] -mt-[50px] w-full fixed xl:h-fit h-full shadow-md" > - - +
{adminName}
{business.name}
- {admin?.phone ? ( -
{admin.phone}
- ) : null} + {admin?.phone ?
{admin.phone}
: null}
-
+
+