// Writes one placeholder thumbnail per top-level product category into
// public/images/categories/{id}.svg. They are meant to be replaced with real
// artwork one file at a time — the carousel reads the same paths either way.
// Run: node scripts/gen-category-placeholders.mjs
import { mkdir, writeFile } from "node:fs/promises";

const DOMAIN = process.env.NEXT_PUBLIC_SITE_DOMAIN || "moalem.shop";
const OUT = new URL("../public/images/categories/", import.meta.url);

const res = await fetch(
  `https://api.meshkee.com/api/v1/tenants/${DOMAIN}/categories?entityType=product`
);
const { items } = await res.json();

const roots = items.filter((c) => c.parentId === null).map((c) => c.id);
const level2 = items.filter((c) => c.parentId && roots.includes(c.parentId));

await mkdir(OUT, { recursive: true });

const escape = (s) => s.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");

for (const cat of level2) {
  const label = escape(cat.nameFa || cat.name);
  const svg = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 120 120" width="120" height="120" role="img" aria-label="${label}">
  <circle cx="60" cy="60" r="59" fill="#f6f7f9" stroke="#ececec"/>
  <rect x="34" y="34" width="52" height="52" rx="12" fill="#fff" stroke="#e51e22" stroke-opacity="0.35" stroke-dasharray="5 4"/>
  <text x="60" y="64" text-anchor="middle" font-family="Tahoma, sans-serif" font-size="11" fill="#7c7c7c">${label.slice(0, 9)}</text>
  <text x="60" y="78" text-anchor="middle" font-family="Tahoma, sans-serif" font-size="8" fill="#c9c9c9">${cat.id}</text>
</svg>
`;
  await writeFile(new URL(`${cat.id}.svg`, OUT), svg, "utf8");
}

console.log(`wrote ${level2.length} placeholders to public/images/categories/`);