import { z } from "zod";
import { crmApi } from "@/modules/crm/services/crm-api";
import { createCrmListPage } from "@/modules/crm/components/CrmListCrudPage";
import type { Tag } from "@/modules/crm/types";

const schema = z.object({
  name: z.string().min(1),
  color: z.string().optional(),
  scope: z.enum(["lead", "contact", "organization", "global"]).default("global"),
});

export default createCrmListPage<Tag>({
  title: "برچسب‌ها",
  description: "Tag engine — تخصیص به lead/contact/organization از API جداگانه.",
  breadcrumb: "برچسب‌ها",
  resourceKey: "tags",
  createSchema: schema,
  editSchema: schema.partial(),
  createDefaults: { name: "", color: "#6366f1", scope: "global" },
  fields: [
    { name: "name", label: "نام" },
    { name: "color", label: "رنگ" },
    {
      name: "scope",
      label: "محدوده",
      type: "select",
      options: [
        { value: "global", label: "سراسری" },
        { value: "lead", label: "سرنخ" },
        { value: "contact", label: "مخاطب" },
        { value: "organization", label: "سازمان" },
      ],
    },
  ],
  columns: [
    { key: "name", header: "نام" },
    { key: "scope", header: "محدوده" },
    {
      key: "color",
      header: "رنگ",
      render: (r) => (
        <span
          className="inline-block h-4 w-4 rounded-full"
          style={{ background: String(r.color ?? "#6366f1") }}
        />
      ),
    },
  ],
  list: (tid) => crmApi.tags.list(tid, { page: 1, page_size: 500 }),
  create: (tid, d) => crmApi.tags.create(tid, d),
  exportColumns: ["name", "scope", "color"],
});
