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

export function ProjectForm({ project }: { project?: ProjectRow }) {
  return (
    <div>
      <PageHeader
        title={project ? "Projeyi düzenle" : "Yeni proje"}
        backHref="/admin/projeler"
      />
      <form action={saveProject}>
        {project && <input type="hidden" name="id" value={project.$id} />}
        <FormShell>
          <div className="grid gap-5 md:grid-cols-2">
            <Field label="Başlık" name="title" required defaultValue={project?.title} />
            <Field label="Slug" name="slug" defaultValue={project?.slug} />
            <Field label="Kategori" name="category" defaultValue={project?.category} />
            <Field
              label="Yıl"
              name="year"
              type="number"
              defaultValue={project?.year ?? new Date().getFullYear()}
            />
            <Field
              label="Görsel URL"
              name="image_url"
              type="url"
              defaultValue={project?.image_url}
            />
            <Field
              label="Canlı URL"
              name="live_url"
              type="url"
              defaultValue={project?.live_url}
            />
            <Field
              label="Teknolojiler"
              name="technologies"
              defaultValue={project?.technologies?.join(", ")}
              placeholder="Next.js, Appwrite, Tailwind"
              help="Virgülle ayırın."
            />
          </div>
          <div className="mt-5">
            <Textarea
              label="Açıklama"
              name="description"
              required
              defaultValue={project?.description}
              rows={6}
            />
          </div>
          <div className="mt-5">
            <Checkbox
              label="Öne çıkar (Anasayfada göster)"
              name="featured"
              defaultChecked={project?.featured ?? false}
            />
          </div>
          <FormActions>
            <GhostLink href="/admin/projeler">İptal</GhostLink>
            <PrimaryButton>
              <Save className="size-4" /> Kaydet
            </PrimaryButton>
          </FormActions>
        </FormShell>
      </form>
    </div>
  );
}