@nextblock-cms/ecom 0.20.3 → 0.21.1

package/lib/pages/cms/products/categories/CategoryManagementPage.es.js

@@ -1,36 +1,44 @@
-import { jsxs as t, jsx as e } from "react/jsx-runtime";
-import o from "next/link";
-import { ArrowLeft as i } from "lucide-react";
-import { Button as n } from "@nextblock-cms/ui";
-import { getActiveLanguagesServerSide as c } from "@nextblock-cms/db/server";
-import { getCategoriesWithCount as m } from "../actions.es.js";
-import { deleteCategoryAction as s, updateCategoryAction as g, createCategoryAction as l } from "../server-actions.es.js";
-import { CategoryManager as d } from "./components/CategoryManager.es.js";
-async function w() {
-  const [r, a] = await Promise.all([
-    m(),
-    c()
-  ]);
-  return /* @__PURE__ */ t("div", { className: "space-y-8 w-full max-w-[1200px] mx-auto px-6 py-8", children: [
-    /* @__PURE__ */ e("div", { className: "flex flex-wrap items-center justify-between gap-4", children: /* @__PURE__ */ t("div", { className: "flex items-center gap-3", children: [
-      /* @__PURE__ */ e(n, { variant: "outline", size: "icon", asChild: !0, children: /* @__PURE__ */ e(o, { href: "/cms/products", children: /* @__PURE__ */ e(i, { className: "h-4 w-4" }) }) }),
-      /* @__PURE__ */ t("div", { children: [
-        /* @__PURE__ */ e("h1", { className: "text-2xl font-bold", children: "Category Management" }),
-        /* @__PURE__ */ e("p", { className: "text-sm text-muted-foreground", children: "Create and manage product categories for organizing your e-commerce catalog." })
-      ] })
-    ] }) }),
-    /* @__PURE__ */ e(
-      d,
-      {
-        initialCategories: r,
-        createCategory: l,
-        updateCategory: g,
-        deleteCategory: s,
-        languages: a
-      }
-    )
-  ] });
+import { getCategoriesWithCount as e } from "../actions.es.js";
+import { createCategoryAction as t, deleteCategoryAction as n, updateCategoryAction as r } from "../server-actions.es.js";
+import { CategoryManager as i } from "./components/CategoryManager.es.js";
+import a from "next/link";
+import { ArrowLeft as o } from "lucide-react";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+import { getActiveLanguagesServerSide as l } from "@nextblock-cms/db/server";
+import { Button as u } from "@nextblock-cms/ui";
+//#region src/lib/pages/cms/products/categories/CategoryManagementPage.tsx
+async function d() {
+	let [d, f] = await Promise.all([e(), l()]);
+	return /* @__PURE__ */ c("div", {
+		className: "space-y-8 w-full max-w-[1200px] mx-auto px-6 py-8",
+		children: [/* @__PURE__ */ s("div", {
+			className: "flex flex-wrap items-center justify-between gap-4",
+			children: /* @__PURE__ */ c("div", {
+				className: "flex items-center gap-3",
+				children: [/* @__PURE__ */ s(u, {
+					variant: "outline",
+					size: "icon",
+					asChild: !0,
+					children: /* @__PURE__ */ s(a, {
+						href: "/cms/products",
+						children: /* @__PURE__ */ s(o, { className: "h-4 w-4" })
+					})
+				}), /* @__PURE__ */ c("div", { children: [/* @__PURE__ */ s("h1", {
+					className: "text-2xl font-bold",
+					children: "Category Management"
+				}), /* @__PURE__ */ s("p", {
+					className: "text-sm text-muted-foreground",
+					children: "Create and manage product categories for organizing your e-commerce catalog."
+				})] })]
+			})
+		}), /* @__PURE__ */ s(i, {
+			initialCategories: d,
+			createCategory: t,
+			updateCategory: r,
+			deleteCategory: n,
+			languages: f
+		})]
+	});
 }
-export {
-  w as CategoryManagementPage
-};
+//#endregion
+export { d as CategoryManagementPage };

package/lib/pages/cms/products/categories/components/CategoryManager.cjs

@@ -0,0 +1 @@
+"use client";const e=require("../../../../../../_virtual/_rolldown/runtime.cjs");let t=require("react");t=e.__toESM(t,1);let n=require("lucide-react"),r=require("react/jsx-runtime"),i=require("sonner"),a=require("next/navigation"),o=require("@nextblock-cms/ui");function s({initialCategories:e=[],languages:s=[],createCategory:c,updateCategory:l,deleteCategory:u}){let d=(0,a.useRouter)(),[f,p]=(0,t.useState)(e),[m,h]=(0,t.useState)(!1),[g,_]=(0,t.useState)(null),[v,y]=(0,t.useState)(``),[b,x]=(0,t.useState)(``),[S,C]=(0,t.useState)(``),[w,T]=(0,t.useState)({}),[E,D]=(0,t.useState)({}),[O,k]=(0,t.useState)(!1),A=(s||[]).filter(e=>!e.is_default);(0,t.useEffect)(()=>{p(e)},[e]);let j=e=>e.toLowerCase().trim().replace(/\s+/g,`-`).replace(/[^a-z0-9-]/g,``).replace(/-+/g,`-`).replace(/^-|-$/g,``),M=e=>{let t=e.target.value;y(t),!O&&!g&&x(j(t))},N=e=>{x(j(e.target.value)),k(!0)},P=e=>{_(e),y(e.name),x(e.slug),C(e.description||``),T(e.name_translations||{}),D(e.description_translations||{}),k(!0)},F=()=>{_(null),y(``),x(``),C(``),T({}),D({}),k(!1)},I=async e=>{if(e.preventDefault(),!v.trim()){i.toast.error(`Category name is required.`);return}h(!0);let t=i.toast.loading(g?`Updating category...`:`Creating category...`);try{let e={name:v.trim(),slug:b.trim()||void 0,description:S.trim()||void 0,nameTranslations:w,descriptionTranslations:E},n;n=g?await l(g.id,e):await c(e),n.success?(i.toast.success(g?`Category updated successfully!`:`Category created successfully!`,{id:t}),F(),d.refresh()):i.toast.error(n.error||`Failed to save category.`,{id:t})}catch(e){i.toast.error(e.message||`An unexpected error occurred.`,{id:t})}finally{h(!1)}},L=async e=>{let t=`Are you sure you want to delete the category "${e.name}"? This will detach it from any assigned products.`;if(!window.confirm(t))return;h(!0);let n=i.toast.loading(`Deleting category...`);try{let t=await u(e.id);t.success?(i.toast.success(`Category deleted successfully!`,{id:n}),g?.id===e.id&&F(),d.refresh()):i.toast.error(t.error||`Failed to delete category.`,{id:n})}catch(e){i.toast.error(e.message||`An unexpected error occurred.`,{id:n})}finally{h(!1)}};return(0,r.jsxs)(`div`,{className:`grid gap-6 md:grid-cols-12 items-start`,children:[(0,r.jsx)(`div`,{className:`md:col-span-4 space-y-4`,children:(0,r.jsxs)(o.Card,{className:`p-5 shadow-lg border-t-4 border-t-amber-500 bg-card/65 backdrop-blur-md transition-all duration-300`,children:[(0,r.jsxs)(`div`,{className:`flex items-center gap-2 mb-4`,children:[(0,r.jsx)(n.FolderPlus,{className:`h-5 w-5 text-amber-500`}),(0,r.jsx)(`h2`,{className:`text-base font-bold tracking-tight`,children:g?`Edit Category`:`Add New Category`})]}),(0,r.jsxs)(`form`,{onSubmit:I,className:`space-y-4`,children:[(0,r.jsxs)(`div`,{className:`space-y-1`,children:[(0,r.jsx)(o.Label,{htmlFor:`name`,className:`text-xs uppercase font-bold text-muted-foreground tracking-wider leading-none`,children:`Name`}),(0,r.jsx)(o.Input,{id:`name`,placeholder:`e.g. T-Shirts`,value:v,onChange:M,disabled:m,className:`h-8 text-sm`,required:!0})]}),(0,r.jsxs)(`div`,{className:`space-y-1`,children:[(0,r.jsxs)(o.Label,{htmlFor:`slug`,className:`text-xs uppercase font-bold text-muted-foreground tracking-wider leading-none flex items-center justify-between w-full`,children:[(0,r.jsx)(`span`,{children:`Slug`}),!O&&!g&&(0,r.jsx)(`span`,{className:`text-[10px] text-amber-600 dark:text-amber-400 capitalize`,children:`Auto-generating`})]}),(0,r.jsx)(o.Input,{id:`slug`,placeholder:`e.g. t-shirts`,value:b,onChange:N,disabled:m,className:`h-8 text-sm font-mono`})]}),(0,r.jsxs)(`div`,{className:`space-y-1`,children:[(0,r.jsx)(o.Label,{htmlFor:`description`,className:`text-xs uppercase font-bold text-muted-foreground tracking-wider leading-none`,children:`Description`}),(0,r.jsx)(o.Textarea,{id:`description`,placeholder:`Optional description of the category...`,value:S,onChange:e=>C(e.target.value),disabled:m,className:`text-sm min-h-[90px] resize-none`})]}),A.length>0&&(0,r.jsxs)(`div`,{className:`border-t border-border/50 pt-4 mt-4 space-y-4`,children:[(0,r.jsx)(`h3`,{className:`text-xs uppercase font-bold text-muted-foreground tracking-wider`,children:`Translations`}),A.map(e=>(0,r.jsxs)(`div`,{className:`space-y-3 p-3 rounded-md bg-muted/30 border border-border/30`,children:[(0,r.jsx)(`span`,{className:`text-[11px] font-bold text-amber-600 dark:text-amber-400 uppercase tracking-wider`,children:e.name}),(0,r.jsxs)(`div`,{className:`space-y-1`,children:[(0,r.jsxs)(o.Label,{htmlFor:`name-${e.code}`,className:`text-[10px] uppercase font-bold text-muted-foreground tracking-wider leading-none`,children:[`Name (`,e.code,`)`]}),(0,r.jsx)(o.Input,{id:`name-${e.code}`,placeholder:`Translation for ${v||`Name`}`,value:w[e.code]||``,onChange:t=>T(n=>({...n,[e.code]:t.target.value})),disabled:m,className:`h-8 text-sm`})]}),(0,r.jsxs)(`div`,{className:`space-y-1`,children:[(0,r.jsxs)(o.Label,{htmlFor:`desc-${e.code}`,className:`text-[10px] uppercase font-bold text-muted-foreground tracking-wider leading-none`,children:[`Description (`,e.code,`)`]}),(0,r.jsx)(o.Textarea,{id:`desc-${e.code}`,placeholder:`Translation for Description`,value:E[e.code]||``,onChange:t=>D(n=>({...n,[e.code]:t.target.value})),disabled:m,className:`text-sm min-h-[60px] resize-none`})]})]},e.code))]}),(0,r.jsxs)(`div`,{className:`flex items-center gap-2 pt-2`,children:[(0,r.jsx)(o.Button,{type:`submit`,disabled:m,size:`sm`,className:`flex-1 bg-amber-600 hover:bg-amber-500 text-white font-medium shadow-md shadow-amber-600/10 h-8 text-xs cursor-pointer`,children:m?(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(n.Loader2,{className:`mr-1.5 h-3.5 w-3.5 animate-spin`}),`Saving...`]}):g?`Update Category`:`Create Category`}),g&&(0,r.jsx)(o.Button,{type:`button`,onClick:F,disabled:m,variant:`outline`,size:`sm`,className:`h-8 text-xs border-dashed cursor-pointer`,children:`Cancel`})]})]})]})}),(0,r.jsx)(`div`,{className:`md:col-span-8`,children:(0,r.jsxs)(o.Card,{className:`p-4 shadow-lg bg-card/65 backdrop-blur-md border border-border/40`,children:[(0,r.jsxs)(`div`,{className:`flex items-center gap-2 mb-4 pb-2 border-b border-border/50`,children:[(0,r.jsx)(n.FolderKanban,{className:`h-5 w-5 text-muted-foreground`}),(0,r.jsxs)(`div`,{children:[(0,r.jsx)(`h2`,{className:`text-base font-bold tracking-tight`,children:`Active Categories`}),(0,r.jsx)(`p`,{className:`text-[11px] text-muted-foreground leading-none mt-0.5`,children:`Categories are shared globally across languages.`})]})]}),f.length===0?(0,r.jsxs)(`div`,{className:`flex flex-col items-center justify-center py-12 px-4 text-center border-2 border-dashed border-border/60 rounded-lg bg-muted/20 animate-in fade-in duration-300`,children:[(0,r.jsx)(n.HelpCircle,{className:`h-10 w-10 text-muted-foreground/50 mb-3`}),(0,r.jsx)(`h3`,{className:`text-sm font-bold text-muted-foreground`,children:`No Categories Found`}),(0,r.jsx)(`p`,{className:`text-xs text-muted-foreground/80 max-w-sm mt-1`,children:`Add your first category using the form on the left to start organizing your catalog products.`})]}):(0,r.jsx)(`div`,{className:`overflow-x-auto border rounded-lg bg-background/50`,children:(0,r.jsxs)(`table`,{className:`w-full text-left border-collapse text-xs`,children:[(0,r.jsx)(`thead`,{children:(0,r.jsxs)(`tr`,{className:`border-b bg-muted/40 font-bold uppercase tracking-wider text-muted-foreground/85 select-none`,children:[(0,r.jsx)(`th`,{className:`p-3 pl-4`,children:`Name`}),(0,r.jsx)(`th`,{className:`p-3`,children:`Slug`}),(0,r.jsx)(`th`,{className:`p-3 text-center`,children:`Products`}),(0,r.jsx)(`th`,{className:`p-3 pr-4 text-right`,children:`Actions`})]})}),(0,r.jsx)(`tbody`,{className:`divide-y divide-border/60`,children:f.map(e=>(0,r.jsxs)(`tr`,{className:`hover:bg-muted/10 transition-colors group`,children:[(0,r.jsxs)(`td`,{className:`p-3 pl-4`,children:[(0,r.jsx)(`div`,{className:`font-semibold text-slate-800 dark:text-slate-100`,children:e.name}),e.description&&(0,r.jsx)(`div`,{className:`text-[10px] text-muted-foreground mt-0.5 max-w-xs truncate leading-normal`,title:e.description,children:e.description})]}),(0,r.jsx)(`td`,{className:`p-3`,children:(0,r.jsxs)(`code`,{className:`px-1.5 py-0.5 rounded bg-muted/65 font-mono text-[10px]`,children:[`/`,e.slug]})}),(0,r.jsx)(`td`,{className:`p-3 text-center`,children:(0,r.jsx)(`span`,{className:`inline-flex items-center justify-center px-2 py-0.5 rounded-full text-[10px] font-bold bg-amber-500/10 text-amber-800 dark:text-amber-300 border border-amber-500/15`,children:e.productCount})}),(0,r.jsx)(`td`,{className:`p-3 pr-4 text-right`,children:(0,r.jsxs)(`div`,{className:`flex items-center justify-end gap-1.5`,children:[(0,r.jsx)(o.Button,{variant:`outline`,size:`icon`,disabled:m,onClick:()=>P(e),className:`h-7 w-7 opacity-85 hover:opacity-100 group-hover:border-amber-500/30 cursor-pointer`,title:`Edit Category`,children:(0,r.jsx)(n.Edit2,{className:`h-3.5 w-3.5 text-muted-foreground group-hover:text-amber-600 dark:group-hover:text-amber-400`})}),(0,r.jsx)(o.Button,{variant:`outline`,size:`icon`,disabled:m,onClick:()=>L(e),className:`h-7 w-7 opacity-85 hover:opacity-100 group-hover:border-red-500/30 cursor-pointer`,title:`Delete Category`,children:(0,r.jsx)(n.Trash2,{className:`h-3.5 w-3.5 text-muted-foreground group-hover:text-red-500`})})]})})]},e.id))})]})})]})})]})}exports.CategoryManager=s;