"use client";

import { BlogUpsertFormView } from "@/components/dashboard/blogs/blog-upsert-form-view";
import type { ArticleUpsertFormValues, DashboardArticleItem } from "@/components/dashboard/blogs/articles-types";
import { createArticle, updateArticle } from "@/lib/api/dashboard/articles-api";
import { useArticleCategories } from "@/lib/api/dashboard/article-categories-api";
import { useArticleTags } from "@/lib/api/dashboard/article-tags-api";
import { useRouter } from "@/i18n/routing";
import { useForm } from "react-hook-form";
import { toast } from "react-toastify";

function toFormValues(a?: DashboardArticleItem): ArticleUpsertFormValues {
  return {
    title: a?.title ?? "",
    subtitle: a?.subtitle ?? "",
    excerpt: a?.excerpt ?? "",
    body: a?.body ?? "",
    slug: a?.slug ?? "",
    source: a?.source_name ?? a?.source ?? "",
    category_id: a?.category_id ?? a?.category?.id ?? null,
    status: a?.status ?? "draft",
    publish_type: a?.publish_type ?? "immediate",
    published_at: a?.published_at ?? a?.scheduled_at ?? null,
    is_featured: a?.is_featured ?? false,
    tag_ids: a?.tags?.map((t) => t.id) ?? [],
    featured_image: a?.featured_image ?? null,
    image_alt: a?.image_alt ?? "",
    meta_title: a?.meta?.title ?? a?.meta_title ?? "",
    meta_description: a?.meta?.description ?? a?.meta_description ?? "",
    meta_image: a?.meta?.image ?? a?.meta_image ?? null,
  };
}

export function BlogUpsertForm({
  mode,
  initialData,
}: {
  mode: "create" | "edit";
  initialData?: DashboardArticleItem;
}) {
  const router = useRouter();
  const { categories } = useArticleCategories();
  const { tags } = useArticleTags();
  const form = useForm<ArticleUpsertFormValues>({
    defaultValues: toFormValues(initialData),
    mode: "onBlur",
  });

  const persist = async (values: ArticleUpsertFormValues) => {
    const saved =
      mode === "edit" && initialData
        ? await updateArticle(initialData.id, values)
        : await createArticle(values);
    toast.success("Saved");
    router.push(`/dashboard/blogs/${saved.id}`);
  };

  const onSubmit = async (values: ArticleUpsertFormValues) => {
    try {
      const payload: ArticleUpsertFormValues =
        values.publish_type === "scheduled"
          ? { ...values, status: "scheduled" }
          : { ...values, status: "published", publish_type: "immediate" };
      await persist(payload);
    } catch (e) {
      toast.error(e instanceof Error ? e.message : "Error");
    }
  };

  const onSaveDraft = async () => {
    try {
      await persist({ ...form.getValues(), status: "draft", publish_type: "immediate" });
    } catch (e) {
      toast.error(e instanceof Error ? e.message : "Error");
    }
  };

  return (
    <BlogUpsertFormView
      form={form}
      mode={mode}
      categories={categories ?? []}
      tags={tags ?? []}
      onSubmit={onSubmit}
      onSaveDraft={onSaveDraft}
    />
  );
}