auth + companies + invoice

src/pages/home/Home.tsx

@@ -1,69 +1,53 @@
-import { FC } from 'react'
-import { useTranslation } from 'react-i18next'
-import { Element3, Messages3, NotificationStatus, People, Receipt2 } from 'iconsax-react'
-import ItemDashboard from './components/ItemDashboard'
-import { useGetDashboard } from './hooks/useHomeData'
-import { Pages } from '../../config/Pages'
-
+import { FC, useEffect, useState } from 'react'
+import { useWorkspaces } from './hooks/useHomeData'
+import { workspaceItem } from './types/HomeTypes'
+import moment from 'moment-jalaali'
 
 const Home: FC = () => {
 
-    const { t } = useTranslation('global')
-    const getDashboard = useGetDashboard()
+    const getWorkspaces = useWorkspaces()
+    const [selectedWorkspace, setSelectedWorkspace] = useState<string | null>(null)
+
+    useEffect(() => {
+        setSelectedWorkspace(localStorage.getItem(import.meta.env.VITE_WORKSPACE_ID))
+    }, [])
+
+    const handleChangeWorkspace = (id: string) => {
+        localStorage.setItem(import.meta.env.VITE_WORKSPACE_ID, id)
+        setSelectedWorkspace(id)
+        window.location.reload()
+    }
 
     return (
         <div className='w-full flex gap-6'>
             <div className='flex-1'>
 
                 <div className='mt-8 flex-wrap text-sm flex gap-6 items-center'>
-                    <ItemDashboard
-                        title={t('home.services')}
-                        icon={<Element3 size={20} color='black' />}
-                        color='#00D16C'
-                        count={getDashboard.data?.data?.danakServicesCount}
-                        description={t('home.service')}
-                        to={Pages.services.list}
-                    />
+                    {
+                        getWorkspaces.data?.data?.workspaces?.map((item: workspaceItem) => {
+                            return (
+                                <div className={`p-6 min-w-[40%] xl:min-w-[15%] flex flex-col items-center xl:items-start flex-1 h-[178px] bg-white rounded-3xl cursor-pointer transition-all duration-300 hover:shadow-lg ${selectedWorkspace === item.id ? 'border border-black' : ''}`}
+                                    onClick={() => handleChangeWorkspace(item.id)}
+                                >
+                                    <div className='mt-5'>
+                                        {item.businessName}
+                                    </div>
 
-                    <ItemDashboard
-                        title={t('home.customers')}
-                        icon={<People size={20} color='black' />}
-                        color='#00D16C'
-                        count={getDashboard.data?.data?.customersCount}
-                        description={t('home.customer')}
-                        to={Pages.customers.list}
-                    />
+                                    <div className='mt-5'>
+                                        {item.plan?.name}
+                                    </div>
 
-                    <ItemDashboard
-                        title={t('home.ticket')}
-                        icon={<Messages3 size={20} color='black' />}
-                        color='#FF7B00'
-                        count={getDashboard.data?.data?.unreadTickets}
-                        description={t('home.unread_messages')}
-                        to={Pages.ticket.list}
-                    />
-
-                    <ItemDashboard
-                        title={t('home.ads')}
-                        icon={<NotificationStatus size={20} color='black' />}
-                        color='#FF0000'
-                        count={getDashboard.data?.data?.adsCount}
-                        description={t('home.active_ads')}
-                        to={Pages.ads.list}
-                    />
-
-                    <ItemDashboard
-                        title={t('home.invoices')}
-                        icon={<Receipt2 size={20} color='black' />}
-                        color='#0047FF'
-                        count={getDashboard.data?.data?.invoicesCount}
-                        description={t('home.new_invoice')}
-                        to={Pages.receipts.index}
-                    />
+                                    <div className='mt-5 flex gap-1'>
+                                        <div>تاریخ پایان: </div>
+                                        <div className='text-description text-sm'>{moment(item?.endDate).format('jYYYY/jMM/jDD')}</div>
+                                    </div>
+                                </div>
+                            )
+                        })
+                    }
 
+                    <div className='px-6 min-w-[40%] xl:min-w-[15%] flex flex-col items-center xl:items-start flex-1 h-[178px]'></div>
                 </div>
-
-
             </div>
         </div>
     )