import HeadingSmall from '@admin/components/heading-small'; import { Button } from '@admin/components/ui/button'; import { Card, CardHeader } from '@admin/components/ui/card'; import { Switch } from '@admin/components/ui/switch'; import AdminLayout from '@admin/layouts/admin/admin-layout'; import AdminSettingsLayout from '@admin/layouts/admin/admin-settings-layout'; import { Head, Link, router } from '@inertiajs/react'; import { ExternalLink } from 'lucide-react'; import { ReactNode } from 'react'; type EmailTemplateContent = { subject: string; header: string; body: string; footer: string; banner: string | null; tags: string[]; }; type EmailTemplate = { id: number; uid: string; name: string; description: string; content: EmailTemplateContent; status: 'ACTIVE' | 'INACTIVE' | string; group?: string; group_slug?: string; created_at: string; updated_at: string; }; type IndexProps = { emailTemplates: Record; }; export default function EmailTemplates({ emailTemplates }: IndexProps) { const handleToggleTemplate = (templateId: string, currentStatus: string) => { const newStatus = currentStatus === 'ACTIVE' ? 0 : 1; router.put( `/admin/settings/email-templates/${templateId}/status`, { status: newStatus }, { preserveScroll: true, onError: (errors) => { alert('Failed to update template status'); console.error(errors); }, }, ); }; const modules = Object.entries(emailTemplates || {}); const handleAllToggle = (group: any) => { const status = group.items.every((item: EmailTemplate) => item.status === 'ACTIVE') ? 0 : 1; const slug = group?.group_slug; router.put( `/admin/settings/email-templates/groups/${slug}/status`, { status }, { preserveScroll: true, onError: (errors) => { alert('Failed to update template group status'); console.error(errors); }, }, ); }; return ( <>
{modules.map(([moduleName, items]) => { const grouped = (items as EmailTemplate[]).reduce< Record >((acc, template) => { const group = template.group || 'General'; if (!acc[group]) acc[group] = { title: group, items: [], group_slug: template.group_slug }; acc[group].items.push(template); return acc; }, {}); const order: Record = { 'Authentication and Security': 0, 'User And Role Management': 1, }; const groups = Object.values(grouped).sort((a, b) => { const oa = order[a.title] ?? 99; const ob = order[b.title] ?? 99; if (oa === ob) return a.title.localeCompare(b.title); return oa - ob; }); return (

{moduleName}

{groups.length > 0 && (
{groups.map((group) => (

{group.title}

 item.status === 'ACTIVE')} onCheckedChange={() => handleAllToggle(group)} />
{group.items.map((template, idx) => { const isLast = idx === group.items.length - 1; return (
{template.name} handleToggleTemplate(template.uid, template.status) } />
); })}
))}
)}
); })} ); } EmailTemplates.layout = (page: ReactNode) => ( {page} );