import { DataTable } from '@/components/core/data-table'; import { DeleteDialog } from '@/components/core/delete-dialog'; import { Badge } from '@/components/ui/badge'; import { Button } from '@/components/ui/button'; import { Card } from '@/components/ui/card'; import AppLayout from '@/layouts/app-layout'; import { Head, Link, router } from '@inertiajs/react'; import { useState } from 'react'; interface Company { id: number; name: string; } interface CampaignStatus { id: number; name: string; slug: string; description?: string; color?: string; is_active: boolean; is_final: boolean; sort_order: number; company_id: number; company?: Company; } interface CampaignStatusesIndexProps { campaignStatuses: CampaignStatus[]; } export default function CampaignStatusesIndex({ campaignStatuses }: CampaignStatusesIndexProps) { const [deleteDialog, setDeleteDialog] = useState<{ open: boolean; campaignStatus: CampaignStatus | null; }>({ open: false, campaignStatus: null, }); const handleDelete = (campaignStatus: CampaignStatus) => { setDeleteDialog({ open: true, campaignStatus }); }; const confirmDelete = () => { if (deleteDialog.campaignStatus) { router.delete(`/marketing/campaign-statuses/${deleteDialog.campaignStatus.id}`); } }; return (

Campaign Statuses

Manage campaign workflow statuses

{campaignStatuses.length > 0 ? ( row.company?.name || '-', }, { header: 'Type', accessor: (row) => ( {row.is_final ? 'Final' : 'Active'} ), }, { header: 'Status', accessor: (row) => ( {row.is_active ? 'Active' : 'Inactive'} ), }, { header: 'Sort Order', accessor: 'sort_order' }, ]} actions={(row) => ( <> )} /> ) : (

No campaign statuses found.

)} setDeleteDialog({ open, campaignStatus: null })} onConfirm={confirmDelete} title="Delete Campaign Status" description={`Are you sure you want to delete "${deleteDialog.campaignStatus?.name}"?`} />

); }