customers and service

src/shared/SideBar.tsx

@@ -12,6 +12,7 @@ import ServicesSubMenu from './components/ServicesSubMenu'
 import { SideBarItemHasSubMenu } from '../config/SideBarSubMenu'
 import TransactionsSubMenu from './components/TransactionsSubMenu'
 import ReceiptSubMenu from './components/ReceiptSubMenu'
+import CustomerSubMenu from './components/CustomerSubMenu'
 
 const SideBar: FC = () => {
 
@@ -253,7 +254,9 @@ const SideBar: FC = () => {
                                 <TransactionsSubMenu />
                                 : subMenuName === 'receipts' ?
                                     <ReceiptSubMenu />
-                                    : null
+                                    : subMenuName === 'customers' ?
+                                        <CustomerSubMenu />
+                                        : null
                     }
                 </div>
             }

src/shared/components/CustomerSubMenu.tsx

@@ -0,0 +1,45 @@
+import { People } from 'iconsax-react'
+import { FC } from 'react'
+import { useTranslation } from 'react-i18next'
+import SubMenuItem from './SubMenuItem'
+import { Pages } from '../../config/Pages'
+
+const CustomerSubMenu: FC = () => {
+
+    const { t } = useTranslation('global')
+
+    const isActive = (name: string) => {
+        return location.pathname.includes(name)
+    }
+
+    return (
+        <div className='py-12'>
+            <div className='flex gap-3 items-center border-b pb-10 px-6'>
+                <People
+                    size={24}
+                    color='#000'
+                    variant='Bold'
+                />
+                <div className='text-xs'>
+                    {t('sidebar.customers')}
+                </div>
+            </div>
+
+            <div className='flex flex-col mt-10 gap-4'>
+                <SubMenuItem
+                    title={t('submenu.customer_list')}
+                    isActive={isActive('list')}
+                    link={Pages.customer.list}
+                />
+                <SubMenuItem
+                    title={t('submenu.create_customer')}
+                    isActive={isActive('create')}
+                    link={Pages.customer.create}
+                />
+            </div>
+
+        </div>
+    )
+}
+
+export default CustomerSubMenu

src/shared/components/ServicesSubMenu.tsx

@@ -32,13 +32,18 @@ const ServicesSubMenu: FC = () => {
                 <SubMenuItem
                     title={t('submenu.services_list')}
                     isActive={isActive('list')}
-                    link={Pages.services.mine}
+                    link={Pages.services.list}
                 />
                 <SubMenuItem
                     title={t('submenu.add_service')}
                     isActive={isActive('add')}
                     link={Pages.services.add}
                 />
+                <SubMenuItem
+                    title={t('submenu.service_category')}
+                    isActive={isActive('category')}
+                    link={Pages.services.category}
+                />
             </div>
         </div>
     )