---
import { localizedPath } from '@/i18n/utils';
import CvFormFields from '@/components/admin/CvFormFields.astro';
import CvWizardFields from '@/components/admin/cv-form/CvWizardFields.astro';
import CvFormWizardHeader from '@/components/admin/CvFormWizardHeader.tsx';
import CvFormWizardFooter from '@/components/admin/CvFormWizardFooter.tsx';
import AdminPageHint from '@/components/admin/AdminPageHint.astro';
import { formatAdminDate } from '@/lib/admin/format';
import type { CvFormState, CvFormOptions } from '@/lib/admin/cv-actions';
import type { Locale } from '@/data/site';

interface Props {
  lang: Locale;
  form: CvFormState;
  options: CvFormOptions;
  error: string | null;
  createdAt?: Date;
  updatedAt?: Date;
  wizard?: boolean;
}

const { lang, form, options, error, createdAt, updatedAt, wizard = false } = Astro.props;

const formId = 'cv-wizard-form';
const reviewStepIndex = 5;
const initialWizardStep = error ? reviewStepIndex : 0;

const wizardStepLabels =
  lang === 'ar'
    ? ['أساسيات', 'تفاصيل', 'صورة', 'عربي', 'English', 'مراجعة']
    : ['Basics', 'Details', 'Photo', 'Arabic', 'English', 'Review'];

const wizardStepDescriptions =
  lang === 'ar'
    ? [
        'ابدأ بالمعلومات الأساسية عن المرشح — الجنسية والمهنة والعمر.',
        'أضف تفاصيل الخبرة والراتب. يمكنك تمييز السيرة لتظهر في الصفحة الرئيسية.',
        'ارفع صورة واضحة للمرشح. يمكنك تخطي هذه الخطوة وإضافتها لاحقاً.',
        'اكتب الاسم والمحتوى بالعربية كما سيظهر على الموقع.',
        'اكتب الاسم والمحتوى بالإنجليزية كما سيظهر على الموقع.',
        'راجع كل التفاصيل قبل النشر.',
      ]
    : [
        'Start with the candidate’s basics — country, profession, and age.',
        'Add experience and salary details. You can feature this CV on the homepage.',
        'Upload a clear photo. You can skip this and add one later.',
        'Enter the Arabic name and content as it will appear on the site.',
        'Enter the English name and content as it will appear on the site.',
        'Review everything before publishing.',
      ];

const fieldProps = {
  lang,
  country: form.country,
  profession: form.profession,
  age: form.age,
  experienceYears: form.experienceYears,
  educationLevel: form.educationLevel,
  religion: form.religion,
  serviceType: form.serviceType,
  salary: form.salary,
  priceType: form.priceType,
  hasVideo: form.hasVideo,
  featured: form.featured,
  maritalStatus: form.maritalStatus,
  currentPhoto: form.currentPhoto,
  ar: form.ar,
  en: form.en,
  skillOptions: options.skillOptions,
  languageOptions: options.languageOptions,
  countryOptions: options.countryOptions,
};
---

{
  wizard && (
    <AdminPageHint
      tone="website"
      icon="users"
      text={
        lang === 'ar'
          ? 'اتبع الخطوات لإضافة سيرة جديدة — يمكنك الرجوع وتعديل أي خطوة قبل الحفظ.'
          : 'Follow the steps to add a new CV — you can go back and edit any step before saving.'
      }
    />
  )
}

{
  createdAt && updatedAt && (
    <p class="mb-6 text-sm text-base-content/60">
      {lang === 'ar' ? 'أُضيفت' : 'Added'}: {formatAdminDate(createdAt, lang)}
      {' · '}
      {lang === 'ar' ? 'آخر تحديث' : 'Last updated'}: {formatAdminDate(updatedAt, lang)}
    </p>
  )
}

{
  error && (
    <div role="alert" class="alert alert-error mb-6">
      <div>
        <p>{error}</p>
        <p class="mt-1 text-sm opacity-80">
          {lang === 'ar'
            ? 'لم يتم حفظ أي شيء. إذا اخترت صورة، يرجى اختيارها مرة أخرى قبل الحفظ.'
            : 'Nothing was saved. If you selected a photo, please choose it again before saving.'}
        </p>
      </div>
    </div>
  )
}

<form
  method="POST"
  enctype="multipart/form-data"
  id={wizard ? formId : undefined}
  class={wizard ? 'space-y-2' : undefined}
  novalidate={wizard}
>
  {
    wizard ? (
      <>
        <CvFormWizardHeader
          client:load
          locale={lang}
          stepLabels={wizardStepLabels}
          stepDescriptions={wizardStepDescriptions}
          initialStep={initialWizardStep}
        />
        <div class="my-6 min-h-[280px]">
          <CvWizardFields {...fieldProps} />
        </div>
        <CvFormWizardFooter
          client:load
          locale={lang}
          stepLabels={wizardStepLabels}
          initialStep={initialWizardStep}
          formId={formId}
          cancelHref={localizedPath(lang, 'admin/cvs')}
        />
      </>
    ) : (
      <>
        <CvFormFields {...fieldProps} />
        <div class="mt-6 flex flex-col-reverse gap-3 sm:flex-row">
          <button type="submit" class="btn btn-primary">
            {lang === 'ar' ? 'حفظ' : 'Save'}
          </button>
          <a href={localizedPath(lang, 'admin/cvs')} class="btn btn-ghost">
            {lang === 'ar' ? 'إلغاء' : 'Cancel'}
          </a>
        </div>
      </>
    )
  }
</form>