import { useTranslation } from '@/hooks/use-translation'; import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'; import { Button } from '@/components/ui/button'; import { Input } from '@/components/ui/input'; import { Label } from '@/components/ui/label'; import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select'; import AppLayout from '@/layouts/app-layout'; import { type BreadcrumbItem } from '@/types'; import { Head, router, usePage } from '@inertiajs/react'; import { Download, FileSpreadsheet, DollarSign } from 'lucide-react'; import { useState } from 'react'; const breadcrumbs: BreadcrumbItem[] = [ { title: 'Reports & Exports', href: '/admin/reports', }, ]; export default function ReportsIndex() { const { t } = useTranslation(); const { csrf_token } = usePage<{ csrf_token: string }>().props; const [memberFilters, setMemberFilters] = useState({ search: '', member_type: '', }); const [invoiceFilters, setInvoiceFilters] = useState({ status: '', start_date: '', end_date: '', }); const [studentFilters, setStudentFilters] = useState({ class_id: '', grade_level: '', }); const [financialFilters, setFinancialFilters] = useState({ start_date: '', end_date: '', }); const [yahrzeitFilters, setYahrzeitFilters] = useState({ month: '' }); const [glBatchFilters, setGlBatchFilters] = useState({ start_date: '', end_date: '', batch_number: '', }); const handleExport = (endpoint: string, filters: Record) => { // Use the fresh CSRF token from Inertia shared props if (!csrf_token) { console.error('CSRF token not available'); alert('Session error. Please refresh the page and try again.'); return; } // Create a form element const form = document.createElement('form'); form.method = 'POST'; form.action = `/admin/reports/${endpoint}`; form.style.display = 'none'; // Add CSRF token const csrfInput = document.createElement('input'); csrfInput.type = 'hidden'; csrfInput.name = '_token'; csrfInput.value = csrf_token; form.appendChild(csrfInput); // Add filters as hidden inputs Object.entries(filters).forEach(([key, value]) => { if (value) { const input = document.createElement('input'); input.type = 'hidden'; input.name = key; input.value = String(value); form.appendChild(input); } }); // Submit form document.body.appendChild(form); form.submit(); // Remove form after a delay to ensure submission completes setTimeout(() => form.remove(), 1000); }; return (

{/* Financial Reports Link */}

{t('Financial Reports Dashboard')}

{t('View comprehensive financial analytics including income summary, outstanding balances, aging reports, and revenue analysis')} {/* Members Export */}

{t('Members Export')}

{t('Export member data with optional filters')}

{t('Search')} setMemberFilters({ ...memberFilters, search: e.target.value }) } />

{t('Member Type')}

{/* Invoices Export */}

{t('Invoices Export')}

{t('Export invoice data by status and date range')}

{t('Status')}

{t('Start Date')} setInvoiceFilters({ ...invoiceFilters, start_date: e.target.value }) } />

{t('End Date')} setInvoiceFilters({ ...invoiceFilters, end_date: e.target.value }) } />

{/* Students Export */}

{t('Students Export')}

{t('Export student data with contact and parent information')}

{t('Grade Level')} setStudentFilters({ ...studentFilters, grade_level: e.target.value }) } />

{/* Financial Summary Export */}

{t('Financial Summary Report')}

{t('Comprehensive financial report with aging analysis')}

Start Date * setFinancialFilters({ ...financialFilters, start_date: e.target.value }) } />

End Date * setFinancialFilters({ ...financialFilters, end_date: e.target.value }) } />

{/* Yahrzeit Export */}

{t('Yahrzeit Calendar Export')}

{t('Export yahrzeit dates with member associations by Hebrew month')}

{t('Hebrew Month')}

{/* GL Batch Export */}

{t('GL Batch Export')}

{t('Export transactions by date range mapped to your Chart of Accounts for QuickBooks or other accounting software')}

Start Date * setGlBatchFilters({ ...glBatchFilters, start_date: e.target.value }) } />

End Date * setGlBatchFilters({ ...glBatchFilters, end_date: e.target.value }) } />

{t('Batch Number (Optional)')} setGlBatchFilters({ ...glBatchFilters, batch_number: e.target.value }) } />

Note: Only transactions with assigned GL account codes will be included in the export. Configure your Chart of Accounts and assign accounts to invoice items for accurate GL reporting.

); }