import { Head, Link, router } from '@inertiajs/react'; import { ArrowLeftRight, CalendarDays, CheckCircle2, Layers3, LayoutTemplate, Pencil, Plus, Settings2, Trash2, } from 'lucide-react'; import { Badge } from '@/components/ui/badge'; import { Button } from '@/components/ui/button'; import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow, } from '@/components/ui/table'; import AppLayout from '@/layouts/app-layout'; import adminRoutes from '@/routes/admin'; import type { BreadcrumbItem } from '@/types'; import type { HomepageConfig } from '@/types/admin'; const breadcrumbs: BreadcrumbItem[] = [ { title: 'Admin', href: adminRoutes.dashboard().url }, { title: 'Homepage Configs', href: adminRoutes.homepage.index().url }, ]; export default function HomepageIndex({ configs, }: { configs: HomepageConfig[]; }) { const activeConfigs = configs.filter((config) => config.is_active).length; const sectionCount = configs.reduce( (total, config) => total + (config.sections_count ?? 0), 0, ); function deleteConfig(config: HomepageConfig) { if ( !confirm( `Delete config "${config.label}"? This will also remove all its sections.`, ) ) { return; } router.delete(adminRoutes.homepage.destroy(config.id).url); } return (

Content workspace

Homepage management

Manage every storefront layout, section and visual asset from a single publishing workspace.

Configurations

{configs.length}

Storefront workspaces

Published

{activeConfigs}

Active configurations

Sections

{sectionCount}

Managed homepage sections

Storefront configurations

Open a workspace to manage its sections and site settings.

Label Client Key Sections Status Created {configs.length === 0 && (

No configurations yet

Create your first storefront workspace to begin.

)} {configs.map((config) => (

{config.label}

Storefront homepage


                                                {config.client_key}

{config.sections_count ?? 0} {config.is_active ? ( Active ) : ( Inactive )} {new Date( config.created_at, ).toLocaleDateString()}

))}

); }