import { Head, Link, router } from '@inertiajs/react'; import { Plus, Trash2 } from 'lucide-react'; import { useState } from 'react'; import { ConfirmDialog } from '@/components/admin/confirm-dialog'; import { DataTable, type Column } from '@/components/admin/data-table'; import { Badge } from '@/components/ui/badge'; import { Button } from '@/components/ui/button'; interface Theme { id: number; title: string; is_featured: boolean; sort_order: number } export default function ThemesIndex({ themes }: { themes: Theme[] }) { const [selectedIds, setSelectedIds] = useState([]); const [confirmBulkOpen, setConfirmBulkOpen] = useState(false); const [confirmDeleteId, setConfirmDeleteId] = useState(null); const columns: Column[] = [ { key: 'sort_order', label: '#', className: 'w-12', render: (t) => {t.sort_order} }, { key: 'title', label: 'Theme', render: (t) => {t.title} }, { key: 'is_featured', label: 'Featured', render: (t) => t.is_featured ? Featured : — }, { key: 'actions', label: '', className: 'w-20 text-right', render: (t) => (

) }, ]; return ( <>

Strategic Themes

{themes.length} themes

setSelectedIds(ids as number[])} bulkActions={} empty="No themes." />

router.post('/admin/themes/bulk-destroy', { ids: selectedIds }, { onSuccess: () => { setSelectedIds([]); setConfirmBulkOpen(false); } })} /> !open && setConfirmDeleteId(null)} title="Delete theme?" description="This is permanent." confirmLabel="Delete" variant="danger" onConfirm={() => confirmDeleteId !== null && router.delete(`/admin/themes/${confirmDeleteId}`, { onSuccess: () => setConfirmDeleteId(null) })} /> ); }