diff --git a/src/components/Layouts/Primary/TopBar/Items/NavMenu/NavMenu.tsx b/src/components/Layouts/Primary/TopBar/Items/NavMenu/NavMenu.tsx index 16e94d354a..f1f05a8cf3 100644 --- a/src/components/Layouts/Primary/TopBar/Items/NavMenu/NavMenu.tsx +++ b/src/components/Layouts/Primary/TopBar/Items/NavMenu/NavMenu.tsx @@ -129,25 +129,20 @@ const NavMenu: React.FC = () => { : 0; }, [loading]); - const [reportsMenuOpen, setReportsMenuOpen] = useState(false); - const [toolsMenuOpen, setToolsMenuOpen] = useState(false); + enum MenuId { + Reports = 'reports', + Tools = 'tools', + RequestForms = 'requestForms', + } - const handleReportsMenuToggle = () => { - setReportsMenuOpen((prevOpen) => !prevOpen); - handleToolsMenuClose(); - }; - - const handleReportsMenuClose = () => { - setReportsMenuOpen(false); - }; + const [openMenu, setOpenMenu] = useState(null); - const handleToolsMenuToggle = () => { - setToolsMenuOpen((prevOpen) => !prevOpen); - handleReportsMenuClose(); + const handleMenuToggle = (menu: MenuId) => { + setOpenMenu((prev) => (prev === menu ? null : menu)); }; - const handleToolsMenuClose = () => { - setToolsMenuOpen(false); + const handleMenuClose = () => { + setOpenMenu(null); }; const { pathname } = useRouter(); @@ -178,9 +173,9 @@ const NavMenu: React.FC = () => { handleMenuToggle(MenuId.Reports)} + handleMenuClose={handleMenuClose} testId="ReportMenuToggle" sum={sum} toolData={toolData} @@ -189,9 +184,9 @@ const NavMenu: React.FC = () => { /> handleMenuToggle(MenuId.Tools)} + handleMenuClose={handleMenuClose} testId="ToolsMenuToggle" sum={sum} toolData={toolData} @@ -199,6 +194,18 @@ const NavMenu: React.FC = () => { isTool={true} /> + handleMenuToggle(MenuId.RequestForms)} + handleMenuClose={handleMenuClose} + testId="RequestFormsMenuToggle" + sum={sum} + toolData={toolData} + loading={loading} + isTool={false} + /> + {isCoaching && ( ({ + ...item, + href: `/accountLists/${accountListId}/reports/${item.id}`, + searchIcon: , + searchName: t(`Request Forms - {{ title }}`, { title: item.title }), + showInSearchDialog: true, + })), + showInNav: true, + }, { id: 'settings-page', title: t('Preferences'), @@ -193,6 +208,13 @@ export function useNavPages(coachingAccountCount: boolean, isSearch = false) { } } + // get request forms sub items + if (page.id === 'request-forms-page' && page.items) { + page.items.forEach((item) => { + pages.push({ ...item, title: item.searchName ?? item.title }); + }); + } + // get settings sub items without granted access if (page.id === 'settings-page' && page.items) { page.items diff --git a/src/hooks/useReportNavItems.ts b/src/hooks/useReportNavItems.ts index 06148f0b9f..9a34e75839 100644 --- a/src/hooks/useReportNavItems.ts +++ b/src/hooks/useReportNavItems.ts @@ -45,17 +45,27 @@ export function useReportNavItems(): NavItems[] { id: 'coaching', title: t('Coaching'), }, - // Goal Calculator - // { - // id: 'goalCalculator', - // title: t('Goal Calculator'), - // subTitle: t('Reports - Goal Calculation'), - // }, - // { - // id: 'mpgaIncomeExpenses', - // title: t('MPGA Monthly Report'), - // subTitle: t('Income & Expenses'), - // }, + { + id: 'mpgaIncomeExpenses', + title: t('MPGA Monthly Report'), + subTitle: t('Income & Expenses'), + }, + { + id: 'staffSavingFund', + title: t('Staff Saving Fund'), + }, + { + id: 'staffExpense', + title: t('Staff Expense'), + }, + { + id: 'goalCalculator', + title: t('Goal Calculator'), + }, + { + id: 'mpReminders', + title: t('Ministry Partner Reminders'), + }, ]; return useMemo(() => reportNavItems, [t]); diff --git a/src/hooks/useRequestFormsNavItems.ts b/src/hooks/useRequestFormsNavItems.ts new file mode 100644 index 0000000000..695f5a46fc --- /dev/null +++ b/src/hooks/useRequestFormsNavItems.ts @@ -0,0 +1,24 @@ +import { useMemo } from 'react'; +import { useTranslation } from 'react-i18next'; +import { NavItems } from './useReportNavItems'; + +export function useRequestFormsNavItems(): NavItems[] { + const { t } = useTranslation(); + + const requestFormsNavItems: NavItems[] = [ + { + id: 'additionalSalaryRequest', + title: t('Additional Salary Request'), + }, + { + id: 'housingAllowance', + title: t('Housing Allowance'), + }, + { + id: 'salaryCalculator', + title: t('Salary Calculator'), + }, + ]; + + return useMemo(() => requestFormsNavItems, [t]); +}