import AppLayout from '@/layouts/app-layout'; import Heading from '@/components/heading'; import { Button } from '@/components/ui/button'; import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'; import { Badge } from '@/components/ui/badge'; import { Head, Link } from '@inertiajs/react'; import { Plus, FileText } from 'lucide-react'; import { PageHelp } from '@/components/page-help'; import { dashboard } from '@/routes'; import { type BreadcrumbItem } from '@/types'; import Pagination from '@/components/pagination'; interface CampaignTemplate { id: number; name: string; description: string; category: string; template_data: Record; is_system_template: boolean; usage_count: number; created_at: string; } interface PaginationLink { url: string | null; label: string; active: boolean; } interface PaginationMeta { current_page: number; from: number | null; last_page: number; path: string; per_page: number; to: number | null; total: number; } interface Props { templates?: { data: CampaignTemplate[]; links?: PaginationLink[]; meta?: PaginationMeta; } | CampaignTemplate[]; } export default function Index({ templates }: Props) { // Handle both paginated and non-paginated data const isPaginated = templates && !Array.isArray(templates) && 'data' in templates; const templateArray = isPaginated ? (templates as { data: CampaignTemplate[] }).data : Array.isArray(templates) ? templates : []; const paginationLinks = isPaginated ? (templates as { data: CampaignTemplate[]; links?: PaginationLink[] }).links : undefined; const paginationMeta = isPaginated ? (templates as { data: CampaignTemplate[]; meta?: PaginationMeta }).meta : undefined; const breadcrumbs: BreadcrumbItem[] = [ { title: 'Dashboard', href: dashboard().url }, { title: 'Campaign Templates', href: '/campaign-templates' }, ]; const helpSections = [ { title: 'Campaign Templates', content: 'Templates allow you to save campaign configurations for reuse. Create templates with predefined scripts, settings, and audio files to quickly launch similar campaigns.', }, { title: 'Creating Templates', content: 'Click "Create Template" to save a campaign configuration. Include the campaign name, type (text-to-speech or voice), script, and default settings.', }, { title: 'Using Templates', content: 'When creating a new campaign, select a template to pre-fill all settings. You can then customize specific details for the new campaign.', }, { title: 'Template Types', content: 'Templates can be for Text-to-Speech campaigns (with scripts) or Voice-to-Voice campaigns (with audio files). Choose the type that matches your needs.', }, ]; return (
{templateArray.length === 0 ? (

No templates found

Create your first campaign template to get started

) : ( templateArray.map((template) => (
{template.name} {template.description}
{template.is_system_template ? 'System' : 'Custom'}

Category: {template.category.replace('_', ' ')}

Used {template.usage_count} times

Created {new Date(template.created_at).toLocaleDateString()}

)) )}
{/* Pagination */} {isPaginated && paginationLinks && paginationMeta && templateArray.length > 0 && ( )}
); }