import { Head, usePage } from '@inertiajs/react'; import { Card, CardContent, CardDescription, CardHeader, CardTitle, } from '@/components/ui/card'; import { DashboardChartCard } from '@/features/dashboard/components/dashboard-chart-panel'; import { DashboardStatWidget } from '@/features/dashboard/components/dashboard-stat-widget'; import type { DashboardPayload } from '@/features/dashboard/types'; import { useI18n } from '@/hooks/use-i18n'; import type { ActivityLogItem, Auth } from '@/types'; export default function ClientDashboard({ dashboard, activity, }: { dashboard: DashboardPayload; activity: { subject: ActivityLogItem[]; }; }) { const { t, locale } = useI18n(); const { auth } = usePage<{ auth: Auth }>().props; const formatDateTick = (iso: string) => new Intl.DateTimeFormat(locale, { month: 'short', day: 'numeric' }).format( new Date(`${iso}T12:00:00`), ); const formatStatusLabel = (status: string) => t(`dashboard.charts.account_status.${status}`); return ( <>

{t(dashboard.title_key)} {auth?.user?.name ? ( , {auth.user.name} ) : null}

{t(dashboard.subtitle_key)}

{dashboard.widgets.map((w) => ( ))}
{dashboard.charts.map((chart) => ( ))}
{t('dashboard.activity.client_subject_title')} {t('dashboard.activity.client_subject_description')} {activity.subject.length === 0 && (

{t('dashboard.activity.empty')}

)} {activity.subject.map((item) => (

{item.description}

{t('dashboard.activity.log_prefix')}: {item.log_name} ยท{' '} {t('dashboard.activity.at_prefix')}{' '} {new Date(item.created_at).toLocaleString(locale)}

))}
); }