'use client';

import { useRouter } from 'next/navigation';
import { useState } from 'react';
import Swal from 'sweetalert2';
import { RequireRole, useAuth } from '@/lib/auth-context';
import { createDentist, uploadDentistPhoto } from '@/lib/services/dentists';
import DentistForm, {
  DentistFormValues,
} from '@/components/app/DentistForm';
import { BackLink, PageHeader } from '@/components/app/ui';
import { extractApiError } from '@/lib/api-client';

export default function NovoDentistaPage() {
  return (
    <RequireRole roles={['admin']}>
      <NovoDentista />
    </RequireRole>
  );
}

function NovoDentista() {
  const router = useRouter();
  const { user } = useAuth();
  const [submitting, setSubmitting] = useState(false);

  async function handleSubmit(values: DentistFormValues) {
    setSubmitting(true);
    try {
      const created = await createDentist({
        fullName: values.fullName,
        cro: values.cro,
        croState: values.croState,
        bio: values.bio || null,
        isActive: values.isActive,
        userId: values.userId ? Number(values.userId) : null,
        specialtyIds: values.specialtyIds,
      });
      if (values.photo?.[0]) {
        await uploadDentistPhoto(created.id, values.photo[0]);
      }
      await Swal.fire({
        icon: 'success',
        title: 'Dentista cadastrado',
        timer: 1300,
        showConfirmButton: false,
      });
      router.push(`/painel/dentistas/${created.id}`);
    } catch (err) {
      Swal.fire({ icon: 'error', title: 'Erro', text: extractApiError(err) });
    } finally {
      setSubmitting(false);
    }
  }

  return (
    <>
      <BackLink href="/painel/dentistas" label="Voltar para dentistas" />
      <PageHeader title="Novo dentista" subtitle="Cadastrar membro do corpo clínico" />
      <DentistForm
        canLinkUser={user?.role === 'admin'}
        submitting={submitting}
        onSubmit={handleSubmit}
        onCancel={() => router.push('/painel/dentistas')}
      />
    </>
  );
}
