import { useTranslation } from '@/hooks/use-translation'; import { Head, Link, router } from '@inertiajs/react'; import { useState } from 'react'; import AppLayout from '@/layouts/app-layout'; import { Button } from '@/components/ui/button'; import { Input } from '@/components/ui/input'; import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, } from '@/components/ui/dialog'; import { Badge } from '@/components/ui/badge'; import { type BreadcrumbItem } from '@/types'; const breadcrumbs: BreadcrumbItem[] = [ { title: 'Dashboard', href: '/dashboard', }, { title: 'Email Campaigns', href: '/admin/campaigns', }, ]; interface EmailCampaign { id: number; name: string; description: string | null; opt_in_type: 'single' | 'double'; is_active: boolean; subscribers_count: number; confirmed_subscribers_count: number; pending_subscribers_count: number; created_at: string; updated_at: string; } interface Props { campaigns: EmailCampaign[]; } export default function CampaignIndex({ campaigns }: Readonly) { const { t } = useTranslation(); const [search, setSearch] = useState(''); const [deleteDialog, setDeleteDialog] = useState(false); const [selectedCampaign, setSelectedCampaign] = useState(null); const filteredCampaigns = campaigns.filter((campaign) => campaign.name.toLowerCase().includes(search.toLowerCase()) ); const handleDelete = () => { if (selectedCampaign) { router.delete(`/admin/campaigns/${selectedCampaign.id}`, { onSuccess: () => { setDeleteDialog(false); setSelectedCampaign(null); }, }); } }; const handleSend = (campaign: EmailCampaign) => { if (confirm(`Send this campaign to ${campaign.confirmed_subscribers_count} confirmed subscribers?`)) { router.post(`/admin/campaigns/${campaign.id}/send`); } }; return (

{t('Email Campaigns')}

{t('Manage email campaigns with single or double opt-in')}

setSearch(e.target.value)} className="max-w-sm" />

{filteredCampaigns.length === 0 ? ( ) : ( filteredCampaigns.map((campaign) => ( )) )}

{t('Name')}	{t('Opt-in Type')}	{t('Status')}	{t('Subscribers')}	{t('Actions')}
{t('No campaigns found')}
{campaign.name}	{campaign.opt_in_type === 'double' ? 'Double Opt-in' : 'Single Opt-in'}	{campaign.is_active ? 'Active' : 'Inactive'}	{campaign.confirmed_subscribers_count} confirmed {campaign.opt_in_type === 'double' && campaign.pending_subscribers_count > 0 && ( {campaign.pending_subscribers_count} pending )}

); }