import { Input } from "@/components/ui/input"
import { Textarea } from "@/components/ui/textarea"
import { Select } from "@/components/ui/select"
import { Button } from "@/components/ui/button"
import Link from "next/link"

export interface CollaboratorFormValues {
  name: string
  role: "Styliste" | "Artiste" | "Graphiste" | "Agent IA" | "Électronicien"
  isAI: boolean
  photo: string | null
  universe: string
  background: string
  influences: string
}

export function CollaboratorForm({
  action,
  defaultValues,
  submitLabel,
}: {
  action: (formData: FormData) => void
  defaultValues?: CollaboratorFormValues
  submitLabel: string
}) {
  return (
    <form action={action} className="space-y-6 max-w-2xl">
      <Input label="Nom" name="name" required defaultValue={defaultValues?.name} />

      <Select label="Rôle" name="role" required defaultValue={defaultValues?.role ?? "Styliste"}>
        <option value="Styliste">Styliste (réalisation)</option>
        <option value="Graphiste">Graphiste (branding)</option>
        <option value="Agent IA">Agent IA (conceptualisation)</option>
        <option value="Électronicien">Électronicien (intégration technique)</option>
        <option value="Artiste">Artiste</option>
      </Select>

      <label className="flex items-center gap-2 text-sm text-[var(--text-secondary)]">
        <input
          type="checkbox"
          name="isAI"
          defaultChecked={defaultValues?.isAI ?? false}
          className="h-4 w-4 accent-[var(--accent)]"
        />
        Agent logiciel (pas une personne — aucune photo ne sera affichée)
      </label>

      <Input
        label="Photo (URL)"
        name="photo"
        placeholder="https://…"
        defaultValue={defaultValues?.photo ?? ""}
      />

      <Textarea
        label="Univers créatif"
        name="universe"
        required
        rows={3}
        defaultValue={defaultValues?.universe}
      />
      <Textarea
        label="Parcours"
        name="background"
        required
        rows={3}
        defaultValue={defaultValues?.background}
      />
      <Textarea
        label="Influences"
        name="influences"
        required
        rows={2}
        defaultValue={defaultValues?.influences}
      />

      <div className="flex gap-3 pt-2">
        <Button type="submit">{submitLabel}</Button>
        <Button asChild variant="outline">
          <Link href="/admin/collaborators">Annuler</Link>
        </Button>
      </div>
    </form>
  )
}
