import { useTranslation } from '@/hooks/use-translation'; import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'; import { Button } from '@/components/ui/button'; import { Badge } from '@/components/ui/badge'; import AppLayout from '@/layouts/app-layout'; import { type BreadcrumbItem } from '@/types'; import { Head, Link, router } from '@inertiajs/react'; import { Plus, Edit, Trash2, DollarSign } from 'lucide-react'; const breadcrumbs: BreadcrumbItem[] = [ { title: 'Settings', href: '/admin/settings', }, { title: 'Chart of Accounts', href: '/admin/chart-of-accounts', }, ]; interface ChartOfAccount { id: number; account_code: string; account_name: string; account_type: string; description: string | null; is_active: boolean; sort_order: number; } interface Props { accounts: ChartOfAccount[]; } const accountTypeColors = { asset: 'bg-blue-100 text-blue-800 dark:bg-blue-900 dark:text-blue-300', liability: 'bg-red-100 text-red-800 dark:bg-red-900 dark:text-red-300', equity: 'bg-purple-100 text-purple-800 dark:bg-purple-900 dark:text-purple-300', revenue: 'bg-green-100 text-green-800 dark:bg-green-900 dark:text-green-300', expense: 'bg-orange-100 text-orange-800 dark:bg-orange-900 dark:text-orange-300', }; export default function ChartOfAccountsIndex({ accounts }: Readonly) { const { t } = useTranslation(); const handleDelete = (account: ChartOfAccount) => { if (confirm(`Are you sure you want to delete GL Account ${account.account_code} - ${account.account_name}?`)) { router.delete(`/admin/chart-of-accounts/${account.id}`); } }; const groupedAccounts = accounts.reduce((acc, account) => { if (!acc[account.account_type]) { acc[account.account_type] = []; } acc[account.account_type].push(account); return acc; }, {} as Record); return (
{/* Header */}

{t('Chart of Accounts')}

{t('Manage GL account codes for financial reporting and exports')}

{/* Account Type Sections */} {(['revenue', 'asset', 'expense', 'liability', 'equity'] as const).map((type) => { const typeAccounts = groupedAccounts[type] || []; if (typeAccounts.length === 0) return null; return (
{type} Accounts
{typeAccounts.length} account{typeAccounts.length === 1 ? '' : 's'}
{typeAccounts.map((account) => ( ))}
{t('Code')} {t('Name')} {t('Description')} {t('Type')} {t('Status')} {t('Actions')}
{account.account_code} {account.account_name} {account.description || '—'} {account.account_type} {account.is_active ? ( {t('Active')} ) : ( {t('Inactive')} )}
); })} {accounts.length === 0 && (

{t('No GL Accounts')}

{t('Get started by creating your first GL account or run the seeder to populate default accounts.')}

)}
); }