import type { Category, Video } from "@prisma/client";
import { AdminAutoTextarea } from "@/admin/components/AdminAutoTextarea";
import { AdminFormField, AdminFormSection } from "@/admin/components/AdminFormField";
import { saveVideoAction } from "@/lib/actions";

export function VideoForm({
  categories,
  defaultKind = "VIDEO",
  video
}: {
  categories: Category[];
  defaultKind?: "SHORT" | "VIDEO";
  video?: Video | null;
}) {
  const lockedKind = video?.kind ?? defaultKind;
  return (
    <form action={saveVideoAction} className="admin-form glass-panel form-grid">
      {video ? <input name="id" type="hidden" value={video.id} /> : null}

      <AdminFormSection title="Video details" />

      <AdminFormField label="Title">
        <input
          className="admin-form-control"
          defaultValue={video?.title}
          name="title"
          placeholder="Enter video title"
          required
        />
      </AdminFormField>

      <AdminFormField label="YouTube URL">
        <input
          className="admin-form-control"
          defaultValue={video?.youtubeUrl}
          name="youtubeUrl"
          placeholder="https://www.youtube.com/watch?v=..."
          required
          type="url"
        />
      </AdminFormField>

      <AdminFormField
        hint="Full description with line breaks and hashtags. Starts with a larger writing area."
        label="Description"
        span="full"
      >
        <AdminAutoTextarea
          defaultValue={video?.description}
          name="description"
          placeholder="Write the full video description"
          required
          variant="description"
        />
      </AdminFormField>

      <AdminFormSection title="SEO settings" />

      <AdminFormField label="SEO title">
        <input
          className="admin-form-control"
          defaultValue={video?.seoTitle ?? ""}
          name="seoTitle"
          placeholder="Optional — defaults to video title"
        />
      </AdminFormField>

      <AdminFormField label="SEO description">
        <AdminAutoTextarea
          defaultValue={video?.seoDescription ?? ""}
          name="seoDescription"
          placeholder="Optional search description"
          variant="compact"
        />
      </AdminFormField>

      <AdminFormField label="SEO keywords">
        <input
          className="admin-form-control"
          defaultValue={video?.seoKeywords ?? ""}
          name="seoKeywords"
          placeholder="Nepal video, travel vlog"
        />
      </AdminFormField>

      <AdminFormSection title="Thumbnail" />

      <AdminFormField label="Thumbnail URL">
        <input
          className="admin-form-control"
          defaultValue={video?.thumbnail ?? ""}
          name="thumbnail"
          placeholder="/uploads/video-thumb.jpg or https://..."
        />
      </AdminFormField>

      <AdminFormField hint="Optional. YouTube thumbnail is used when empty." label="Upload thumbnail">
        <input className="admin-form-control" name="thumbnailFile" type="file" />
      </AdminFormField>

      <AdminFormSection title="Publishing" />

      {video ? (
        <AdminFormField
          hint={lockedKind === "SHORT" ? "Vertical 9:16 YouTube Short." : "Standard 16:9 YouTube video."}
          label="Video type"
        >
          <select className="admin-form-control" defaultValue={lockedKind} name="kind">
            <option value="VIDEO">Normal YouTube video</option>
            <option value="SHORT">YouTube Short</option>
          </select>
        </AdminFormField>
      ) : (
        <input name="kind" type="hidden" value={defaultKind} />
      )}

      <AdminFormField label="Category">
        <select className="admin-form-control" defaultValue={video?.categoryId ?? ""} name="categoryId">
          <option value="">No category</option>
          {categories.map((category) => (
            <option key={category.id} value={category.id}>
              {category.name}
            </option>
          ))}
        </select>
      </AdminFormField>

      <AdminFormField label="Status">
        <select className="admin-form-control" defaultValue={video?.status ?? "DRAFT"} name="status">
          <option value="DRAFT">Draft</option>
          <option value="PUBLISHED">Published</option>
        </select>
      </AdminFormField>

      <label className="checklist-item active">
        <input defaultChecked={video?.featured ?? false} name="featured" type="checkbox" />
        Featured video
      </label>

      <button className="btn" type="submit">
        Save video
      </button>
    </form>
  );
}