enter login & navigate all menu

src/pages/account/manage-account/ManageAccount.tsx

@@ -5,6 +5,7 @@ import { useEffect, useState } from 'react';
 import { getData } from '@/utils';
 import { useCallApi } from '@/hooks';
 import { DataTable } from '@/components/ui/DataTable';
+import { Breadcrumbs, Link } from '@mui/material';
 
 const API_URL = apiConfig.service_dashboard;
 
@@ -75,7 +76,20 @@ const ManageAccount = () => {
   return (
     <div>
       <div className="container mx-auto p-5">
-        <h1 className="text-xl font-medium leading-none text-gray-900 p-5">Manage Account</h1>
+        <h1 className="text-xl font-medium leading-none text-gray-900 mb-3">Manage Account</h1>
+        <Breadcrumbs>
+          <Link underline="none" color="inherit" href="/">
+            <span className="text-sm hover:underline">Dashboard</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Accounts</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Manage Account</span>
+          </Link>
+        </Breadcrumbs>
         <DataTable
           columns={columns}
           data={dataAccount}

src/pages/account/manage-currency/ManageCurrency.tsx

@@ -1,11 +1,27 @@
 import { Container, DataGridInner } from '@/components';
 import { ManageCurrencyContextProvider } from './hooks/ManageCurrencyContext';
 import AddDialog from './blocks/AddDialog';
+import { Breadcrumbs, Link } from '@mui/material';
 
 const ManageCurrency = () => {
   return (
     <ManageCurrencyContextProvider>
       <Container>
+        <h1 className="text-xl font-medium leading-none text-gray-900 mb-3">Manage Currency</h1>
+        <Breadcrumbs sx={{ mb: 2 }}>
+          <Link underline="none" color="inherit" href="/">
+            <span className="text-sm hover:underline">Dashboard</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Accounts</span>
+          </Link>
+
+          <Link underline="none" color="inherit">
+            <span className="text-sm">Manage Currency</span>
+          </Link>
+        </Breadcrumbs>
+
         <div className="grid gap-5 lg:gap-7.5">
           <DataGridInner />
         </div>

src/pages/account/manage-currency/hooks/ManageCurrencyContext.tsx

@@ -220,9 +220,6 @@ const ManageCurrencyContextProvider = ({ children }: { children: React.ReactNode
   console.log(currencies);
   return (
     <div>
-      <div className="container mx-auto py-5">
-        <h1>Manage Currency</h1>
-      </div>
       <ManageCurrencyContext.Provider
         value={{
           showEditDialog,