Report Cash Flow

src/views/apps/report/ReportFinancialList.tsx

@@ -1,20 +1,30 @@
+'use client'
+
 import { Container, Typography } from '@mui/material'
 import Grid from '@mui/material/Grid2'
 import ReportCard from './ReportCard'
+import { getLocalizedUrl } from '@/utils/i18n'
+import { Locale } from '@/configs/i18n'
+import { useParams } from 'next/navigation'
 
 const ReportFinancialList: React.FC = () => {
+  const { lang: locale } = useParams()
+
   const financialReports = [
     {
       title: 'Arus Kas',
-      iconClass: 'tabler-cash'
+      iconClass: 'tabler-cash',
+      link: getLocalizedUrl(`/apps/report/cash-flow`, locale as Locale)
     },
     {
       title: 'Laba Rugi',
-      iconClass: 'tabler-cash'
+      iconClass: 'tabler-cash',
+      link: getLocalizedUrl(`/apps/report/profit-loss`, locale as Locale)
     },
     {
       title: 'Neraca',
-      iconClass: 'tabler-cash'
+      iconClass: 'tabler-cash',
+      link: getLocalizedUrl(`/apps/report/nerace`, locale as Locale)
     }
   ]
 
@@ -27,7 +37,7 @@ const ReportFinancialList: React.FC = () => {
       <Grid container spacing={3}>
         {financialReports.map((report, index) => (
           <Grid key={index} size={{ xs: 12, sm: 4, md: 3 }}>
-            <ReportCard title={report.title} avatarIcon={report.iconClass} />
+            <ReportCard title={report.title} avatarIcon={report.iconClass} href={report.link} />
           </Grid>
         ))}
       </Grid>