import { DashboardShell } from '../../../../components/dashboard-shell';
import { TemplateBuilderForm } from '../../../../components/template-builder-form';
import { requireAuthToken } from '../../../../lib/auth';
import { fetchTemplateById } from '../../../../lib/api';
import { getLocale } from '../../../../lib/i18n';

type Props = {
  searchParams?: Promise<{
    id?: string;
  }>;
};

const builderLabels = {
  en: {
    shellTitle: 'Admin Dashboard',
    searchPlaceholder: 'Search templates...',
    editTitle: 'Edit Message Template',
    createTitle: 'Create Message Template',
    copy: 'Design and manage your business messages before they are approved for outbound delivery.',
    saving: 'Saving...',
    saveDraft: 'Save Draft',
    submitApproval: 'Submit for Approval',
    failedSave: 'Failed to save template',
    submitted: 'Template submitted for approval.',
    draftSaved: 'Draft saved.',
    basicDetails: 'Basic Details',
    templateName: 'Template Name',
    namePlaceholder: 'e.g. welcome_message',
    category: 'Category',
    marketing: 'Marketing',
    utility: 'Utility',
    authentication: 'Authentication',
    language: 'Language',
    messageContent: 'Message Content',
    headerOptional: 'Header (Optional)',
    headerPlaceholder: 'Add a title or choose media',
    bodyText: 'Body Text',
    variablesDetected: 'Variables detected:',
    addVariable: 'Add Variable',
    footerOptional: 'Footer (Optional)',
    footerPlaceholder: 'Add a short line of text',
    buttons: 'Buttons',
    quickReply: 'Quick Reply',
    buttonPlaceholder: 'Button label',
    deleteQuickReply: 'Delete quick reply',
    addButton: 'Add Button (Max 10)',
    business: 'Your Business',
    online: 'online',
    today: 'TODAY',
    message: 'Message',
    mobile: 'Mobile',
    desktop: 'Desktop',
    defaultButton: 'Stop promotions',
    defaultBody: `Hi {{1}}, our Summer Sale is finally here!\n\nGet up to 50% OFF on all collections using code {{2}} at checkout.\n\nShop now: https://example.com/shop`,
  },
  id: {
    shellTitle: 'Dashboard Admin',
    searchPlaceholder: 'Cari template...',
    editTitle: 'Edit Template Pesan',
    createTitle: 'Buat Template Pesan',
    copy: 'Rancang dan kelola pesan bisnis sebelum disetujui untuk pengiriman outbound.',
    saving: 'Menyimpan...',
    saveDraft: 'Simpan Draft',
    submitApproval: 'Ajukan Persetujuan',
    failedSave: 'Gagal menyimpan template',
    submitted: 'Template diajukan untuk persetujuan.',
    draftSaved: 'Draft tersimpan.',
    basicDetails: 'Detail Dasar',
    templateName: 'Nama Template',
    namePlaceholder: 'contoh welcome_message',
    category: 'Kategori',
    marketing: 'Marketing',
    utility: 'Utility',
    authentication: 'Authentication',
    language: 'Bahasa',
    messageContent: 'Konten Pesan',
    headerOptional: 'Header (Opsional)',
    headerPlaceholder: 'Tambahkan judul atau pilih media',
    bodyText: 'Isi Pesan',
    variablesDetected: 'Variabel terdeteksi:',
    addVariable: 'Tambah Variabel',
    footerOptional: 'Footer (Opsional)',
    footerPlaceholder: 'Tambahkan teks pendek',
    buttons: 'Tombol',
    quickReply: 'Balasan Cepat',
    buttonPlaceholder: 'Label tombol',
    deleteQuickReply: 'Hapus balasan cepat',
    addButton: 'Tambah Tombol (Maks 10)',
    business: 'Bisnis Anda',
    online: 'online',
    today: 'HARI INI',
    message: 'Pesan',
    mobile: 'Mobile',
    desktop: 'Desktop',
    defaultButton: 'Stop promosi',
    defaultBody: `Hai {{1}}, promo Summer Sale sudah dimulai!\n\nDapatkan diskon hingga 50% untuk semua koleksi dengan kode {{2}} saat checkout.\n\nBelanja sekarang: https://example.com/shop`,
  },
} as const;

export default async function TemplateBuilderPage({ searchParams }: Props) {
  const token = await requireAuthToken();
  const locale = await getLocale();
  const labels = builderLabels[locale];
  const resolvedSearchParams = (await searchParams) || {};
  const templateId = resolvedSearchParams.id?.trim();
  const template = templateId ? await fetchTemplateById(token, templateId) : null;

  return (
    <DashboardShell
      currentPath="/dashboard/templates"
      title={labels.shellTitle}
      searchPlaceholder={labels.searchPlaceholder}
    >
      <TemplateBuilderForm labels={labels} initialTemplate={template} />
    </DashboardShell>
  );
}
