import { Head, Link, usePage } from '@inertiajs/react'; import { Plus } from 'lucide-react'; import { useMemo } from 'react'; import { create as deviceCreate, edit as deviceEdit, index as devicesIndex, } from '@/actions/App/Http/Controllers/AttendanceDeviceController'; import { AttendanceDevicesTable } from '@/components/attendance/attendance-devices-table'; import { Button } from '@/components/ui/button'; import { Card, CardContent, CardDescription, CardHeader, CardTitle, } from '@/components/ui/card'; import { useLanguage } from '@/contexts/language-context'; import AppLayout from '@/layouts/app-layout'; import { dashboard } from '@/routes'; export default function AttendanceDevicesIndex() { const { t } = useLanguage(); const p = t.attendancePage; const page = usePage(); const { devices, filters } = page.props; const breadcrumbs = useMemo( () => [ { title: t.dashboard.breadcrumb, href: dashboard() }, { title: t.nav.employeeManagement, href: '#' }, { title: p.breadcrumb, href: '#' }, { title: p.devicesTitle, href: devicesIndex.url() }, ], [t.dashboard.breadcrumb, t.nav.employeeManagement, p.breadcrumb, p.devicesTitle], ); const tableLabels = useMemo(() => ({ ...p }), [p]); return (

{p.devicesTitle} {p.devicesSubtitle}

devicesIndex.url(opts)} editUrl={(id) => deviceEdit.url({ attendanceDevice: id })} />

); }