import { Save } from "lucide-react";
import {
  Checkbox,
  Field,
  FormActions,
  FormShell,
  GhostLink,
  PageHeader,
  PrimaryButton,
  Textarea,
} from "@/components/admin/form";
import { saveTestimonial } from "@/lib/admin-actions";
import type { TestimonialRow } from "@/lib/types";

export function TestimonialForm({ row }: { row?: TestimonialRow }) {
  return (
    <div>
      <PageHeader
        title={row ? "Referansı düzenle" : "Yeni referans"}
        backHref="/admin/referanslar"
      />
      <form action={saveTestimonial}>
        {row && <input type="hidden" name="id" value={row.$id} />}
        <FormShell>
          <div className="grid gap-5 md:grid-cols-2">
            <Field label="İsim" name="name" required defaultValue={row?.name} />
            <Field label="Görsel URL" name="image_url" type="url" defaultValue={row?.image_url} />
            <Field label="Pozisyon" name="role" defaultValue={row?.role} />
            <Field label="Firma" name="company" defaultValue={row?.company} />
            <Field
              label="Puan (1–5)"
              name="rating"
              type="number"
              defaultValue={row?.rating ?? 5}
            />
            <Field label="Sıra" name="order" type="number" defaultValue={row?.order ?? 0} />
          </div>
          <div className="mt-5">
            <Textarea
              label="Yorum"
              name="message"
              required
              rows={5}
              defaultValue={row?.message}
            />
          </div>
          <div className="mt-5">
            <Checkbox
              label="Öne çıkar"
              name="featured"
              defaultChecked={row?.featured ?? false}
            />
          </div>
          <FormActions>
            <GhostLink href="/admin/referanslar">İptal</GhostLink>
            <PrimaryButton>
              <Save className="size-4" /> Kaydet
            </PrimaryButton>
          </FormActions>
        </FormShell>
      </form>
    </div>
  );
}