@burdenoff/microfe-timecampus 2026.703.3 → 2026.703.5

package/dist/timecampus/pages/templates/TemplatesPage.js

@@ -1,84 +1,191 @@
 import { useTimeCampusNavigate as e } from "../../providers/TimeCampusProvider.js";
-import { LoadingSkeleton as t } from "../../components/LoadingSkeleton.js";
-import { useListConfigurationsQuery as n } from "../../../generated/wspace-operations.js";
-import { PageLayout as r } from "../../components/PageLayout.js";
-import { EmptyState as i } from "../../components/EmptyState.js";
-import { TimeCampusConfigScope as a } from "../../../generated/wspace-types.js";
-import { ArrowRight as o, Sparkles as s } from "lucide-react";
-import { jsx as c, jsxs as l } from "react/jsx-runtime";
+import { StatCard as t } from "../../components/StatCard.js";
+import { LoadingSkeleton as n } from "../../components/LoadingSkeleton.js";
+import { useListConfigurationsQuery as r, useSetConfigurationMutation as i } from "../../../generated/wspace-operations.js";
+import { PageLayout as a } from "../../components/PageLayout.js";
+import { StatusBadge as o } from "../../components/StatusBadge.js";
+import { EmptyState as s } from "../../components/EmptyState.js";
+import { ChartCard as c } from "../../components/ChartCard.js";
+import { DonutChart as l } from "../../components/charts/DonutChart.js";
+import "../../components/index.js";
+import { TimeCampusConfigScope as u } from "../../../generated/wspace-types.js";
+import { useState as d } from "react";
+import { ArrowRight as f, Briefcase as p, Building2 as m, Code2 as h, LayoutTemplate as g, Megaphone as _, Palette as v, Sparkles as y, Tags as b, User as x } from "lucide-react";
+import { jsx as S, jsxs as C } from "react/jsx-runtime";
+import { GlassCard as w } from "@burdenoff/fe-libs/ui";
 //#region src/timecampus/pages/templates/TemplatesPage.tsx
-function u() {
-	let u = e(), { data: d, loading: f, error: p } = n({ variables: { scope: a.Workspace } }), m = (d?.configurations ?? []).filter((e) => e.key.startsWith("template."));
-	return f ? /* @__PURE__ */ c(r, {
+function T(e) {
+	let t = e.toLowerCase();
+	return t.includes("consult") ? p : t.includes("agenc") ? _ : t.includes("freelanc") ? x : t.includes("software") || t.includes("engineer") || t.includes("dev") ? h : t.includes("market") ? _ : t.includes("design") ? v : y;
+}
+function E() {
+	let p = e(), { data: h, loading: _, error: v, refetch: y } = r({ variables: { scope: u.Workspace } }), [x, { error: E }] = i(), [D, O] = d(null), k = h?.timeCampusConfigurations ?? [], A = k.filter((e) => e.key.startsWith("template.") && !e.key.startsWith("template.applied.")), j = new Set(k.filter((e) => e.key.startsWith("template.applied.")).map((e) => e.key.replace("template.applied.", ""))), M = A.reduce((e, t) => {
+		let n = (t.value ?? {}).category ?? "General";
+		return e[n] = (e[n] ?? 0) + 1, e;
+	}, {}), N = new Set(A.map((e) => (e.value ?? {}).industry ?? "Any")), P = Object.entries(M).sort((e, t) => t[1] - e[1]).map(([e, t]) => ({
+		name: e,
+		value: t
+	})), F = async (e) => {
+		let t = (e.value ?? {}).name ?? e.key.replace("template.", "");
+		O(e.id);
+		try {
+			await x({ variables: { input: {
+				key: `template.applied.${e.id}`,
+				scope: u.Workspace,
+				value: {
+					templateId: e.id,
+					name: t,
+					appliedAt: (/* @__PURE__ */ new Date()).toISOString()
+				},
+				description: `Applied template: ${t}`
+			} } }), await y();
+		} finally {
+			O(null);
+		}
+	};
+	return _ ? /* @__PURE__ */ S(a, {
 		title: "Templates",
 		description: "Pre-built workspace templates for different workflows",
-		children: /* @__PURE__ */ c(t, {
+		children: /* @__PURE__ */ S(n, {
 			variant: "card",
 			count: 6
 		})
-	}) : p ? /* @__PURE__ */ c(r, {
+	}) : v ? /* @__PURE__ */ S(a, {
 		title: "Templates",
 		description: "Pre-built workspace templates for different workflows",
-		children: /* @__PURE__ */ c("div", {
+		children: /* @__PURE__ */ S("div", {
 			className: "rounded-lg border border-status-error-bg/40 bg-status-error-bg p-4 text-sm text-status-error-text",
 			children: "Failed to load template configurations. Please try again later."
 		})
-	}) : /* @__PURE__ */ c(r, {
+	}) : /* @__PURE__ */ S(a, {
 		title: "Templates",
 		description: "Pre-built workspace templates for different workflows",
 		purpose: "Skip the blank-page setup — apply a ready-made template that pre-loads projects, categories and settings for a common workflow, so a new team or workspace is productive in minutes.",
-		children: m.length === 0 ? /* @__PURE__ */ c(i, {
+		children: A.length === 0 ? /* @__PURE__ */ S(s, {
 			illustration: "empty-generic",
 			title: "No templates configured yet",
 			description: "Templates are stored as workspace configurations with the 'template.' key prefix — once added, ready-to-apply workflow setups appear here."
-		}) : /* @__PURE__ */ c("div", {
-			className: "grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3",
-			children: m.map((e) => {
-				let t = e.value, n = t.name ?? e.key.replace("template.", ""), r = t.category ?? "General", i = t.industry ?? "Any", a = t.description ?? "";
-				return /* @__PURE__ */ l("div", {
-					role: "button",
-					tabIndex: 0,
-					onClick: () => u(`/templates/${e.id}`),
-					onKeyDown: (t) => {
-						(t.key === "Enter" || t.key === " ") && (t.preventDefault(), u(`/templates/${e.id}`));
-					},
-					className: "cursor-pointer rounded-xl border border-border-seam bg-gloss-card p-5 shadow-pop transition-colors hover:bg-bg-sunken/50",
+		}) : /* @__PURE__ */ C("div", {
+			className: "space-y-6",
+			children: [
+				E && /* @__PURE__ */ S("div", {
+					className: "rounded-lg border border-status-error-bg/40 bg-status-error-bg p-3 text-sm text-status-error-text",
+					children: "Couldn't apply that template. Please try again."
+				}),
+				/* @__PURE__ */ C("div", {
+					className: "grid grid-cols-1 gap-4 sm:grid-cols-3",
 					children: [
-						/* @__PURE__ */ l("div", {
-							className: "flex items-start gap-3",
-							children: [/* @__PURE__ */ c("div", {
-								className: "flex h-12 w-12 items-center justify-center rounded-xl bg-action-primary-bg/10",
-								children: /* @__PURE__ */ c(s, { className: "h-6 w-6 text-primary" })
-							}), /* @__PURE__ */ l("div", {
-								className: "flex-1",
-								children: [/* @__PURE__ */ c("p", {
-									className: "text-sm font-semibold text-text-primary",
-									children: n
-								}), /* @__PURE__ */ l("p", {
-									className: "text-xs text-text-secondary",
-									children: [
-										r,
-										" · ",
-										i
-									]
-								})]
-							})]
+						/* @__PURE__ */ S(t, {
+							featured: !0,
+							title: "Templates",
+							value: A.length,
+							icon: /* @__PURE__ */ S(g, { className: "h-5 w-5" }),
+							description: "Ready to apply"
 						}),
-						a && /* @__PURE__ */ c("p", {
-							className: "mt-3 line-clamp-2 text-xs text-text-secondary",
-							children: a
+						/* @__PURE__ */ S(t, {
+							title: "Categories",
+							value: Object.keys(M).length,
+							icon: /* @__PURE__ */ S(b, { className: "h-5 w-5" }),
+							description: "Workflow types",
+							iconBgColor: "bg-status-info-bg text-status-info-text"
 						}),
-						/* @__PURE__ */ l("div", {
-							className: "mt-3 flex items-center justify-end text-xs font-medium text-primary",
-							children: ["View template ", /* @__PURE__ */ c(o, { className: "ml-1 h-3 w-3" })]
+						/* @__PURE__ */ S(t, {
+							title: "Industries",
+							value: N.size,
+							icon: /* @__PURE__ */ S(m, { className: "h-5 w-5" }),
+							description: "Covered",
+							iconBgColor: "bg-status-success-bg text-status-success-text"
 						})
 					]
-				}, e.id);
-			})
+				}),
+				/* @__PURE__ */ C("div", {
+					className: "grid grid-cols-1 gap-6 lg:grid-cols-3",
+					children: [/* @__PURE__ */ S(c, {
+						title: "By category",
+						description: "How the gallery breaks down",
+						className: "lg:col-span-1",
+						children: /* @__PURE__ */ S(l, {
+							data: P,
+							centerLabel: "Templates",
+							centerValue: A.length,
+							height: 240,
+							ariaLabel: "Templates grouped by category",
+							emptyLabel: "No templates to summarise yet."
+						})
+					}), /* @__PURE__ */ S("div", {
+						className: "lg:col-span-2",
+						children: /* @__PURE__ */ S("div", {
+							className: "grid grid-cols-1 gap-4 sm:grid-cols-2",
+							children: A.map((e) => {
+								let t = e.value ?? {}, n = t.name ?? e.key.replace("template.", ""), r = t.category ?? "General", i = t.industry ?? "Any", a = t.description ?? "", s = j.has(e.id), c = D === e.id;
+								return /* @__PURE__ */ C(w, {
+									treatment: "glass",
+									role: "button",
+									tabIndex: 0,
+									onClick: () => p(`/templates/${e.id}`),
+									onKeyDown: (t) => {
+										(t.key === "Enter" || t.key === " ") && (t.preventDefault(), p(`/templates/${e.id}`));
+									},
+									className: "flex cursor-pointer flex-col p-5",
+									children: [
+										/* @__PURE__ */ C("div", {
+											className: "flex items-start gap-3",
+											children: [/* @__PURE__ */ S("div", {
+												className: "flex h-12 w-12 shrink-0 items-center justify-center rounded-xl bg-action-primary-bg/10 text-primary",
+												children: /* @__PURE__ */ S(T(r), { className: "h-6 w-6" })
+											}), /* @__PURE__ */ C("div", {
+												className: "min-w-0 flex-1",
+												children: [/* @__PURE__ */ C("div", {
+													className: "flex items-center gap-2",
+													children: [/* @__PURE__ */ S("p", {
+														className: "truncate text-sm font-semibold text-text-primary",
+														children: n
+													}), s && /* @__PURE__ */ S(o, {
+														variant: "success",
+														label: "Applied"
+													})]
+												}), /* @__PURE__ */ C("div", {
+													className: "mt-1 flex flex-wrap items-center gap-1.5",
+													children: [/* @__PURE__ */ S(o, {
+														variant: "default",
+														label: r
+													}), /* @__PURE__ */ S(o, {
+														variant: "muted",
+														label: i
+													})]
+												})]
+											})]
+										}),
+										a && /* @__PURE__ */ S("p", {
+											className: "mt-3 line-clamp-2 text-xs text-text-secondary",
+											children: a
+										}),
+										/* @__PURE__ */ C("div", {
+											className: "mt-4 flex items-center justify-between gap-2 border-t border-border-seam pt-3",
+											children: [/* @__PURE__ */ C("span", {
+												className: "inline-flex items-center gap-1 text-xs font-medium text-primary",
+												children: ["View template", /* @__PURE__ */ S(f, { className: "h-3 w-3" })]
+											}), /* @__PURE__ */ S("button", {
+												type: "button",
+												onClick: (t) => {
+													t.stopPropagation(), F(e);
+												},
+												disabled: c,
+												className: "inline-flex items-center gap-1 rounded-md bg-action-primary-bg px-3 py-1.5 text-xs font-medium text-action-primary-text hover:bg-action-primary-bg/90 disabled:opacity-50",
+												children: c ? "Applying..." : s ? "Apply again" : "Apply Template"
+											})]
+										})
+									]
+								}, e.id);
+							})
+						})
+					})]
+				})
+			]
 		})
 	});
 }
 //#endregion
-export { u as TemplatesPage };
+export { E as TemplatesPage };
 
 //# sourceMappingURL=TemplatesPage.js.map

package/dist/timecampus/pages/templates/TemplatesPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"TemplatesPage.js","names":[],"sources":["../../../../src/timecampus/pages/templates/TemplatesPage.tsx"],"sourcesContent":["import { Sparkles, ArrowRight } from \"lucide-react\";\nimport { PageLayout } from \"../../components/PageLayout\";\nimport { EmptyState } from \"../../components/EmptyState\";\nimport { LoadingSkeleton } from \"../../components/LoadingSkeleton\";\nimport { useTimeCampusNavigate } from \"../../providers/TimeCampusProvider\";\nimport {\n  useListConfigurationsQuery,\n  type ConfigurationFieldsFragment,\n} from \"@/generated/wspace-operations\";\nimport { TimeCampusConfigScope } from \"@/generated/wspace-types\";\n\nexport function TemplatesPage() {\n  const navigate = useTimeCampusNavigate();\n\n  const { data, loading, error } = useListConfigurationsQuery({\n    variables: { scope: TimeCampusConfigScope.Workspace },\n  });\n\n  const configurations = data?.configurations ?? [];\n\n  // Filter configurations that represent templates (key starts with 'template.')\n  const templates = configurations.filter((c: ConfigurationFieldsFragment) =>\n    c.key.startsWith(\"template.\"),\n  );\n\n  if (loading) {\n    return (\n      <PageLayout\n        title=\"Templates\"\n        description=\"Pre-built workspace templates for different workflows\"\n      >\n        <LoadingSkeleton variant=\"card\" count={6} />\n      </PageLayout>\n    );\n  }\n\n  if (error) {\n    return (\n      <PageLayout\n        title=\"Templates\"\n        description=\"Pre-built workspace templates for different workflows\"\n      >\n        <div className=\"rounded-lg border border-status-error-bg/40 bg-status-error-bg p-4 text-sm text-status-error-text\">\n          Failed to load template configurations. Please try again later.\n        </div>\n      </PageLayout>\n    );\n  }\n\n  return (\n    <PageLayout\n      title=\"Templates\"\n      description=\"Pre-built workspace templates for different workflows\"\n      purpose=\"Skip the blank-page setup — apply a ready-made template that pre-loads projects, categories and settings for a common workflow, so a new team or workspace is productive in minutes.\"\n    >\n      {templates.length === 0 ? (\n        <EmptyState\n          illustration=\"empty-generic\"\n          title=\"No templates configured yet\"\n          description=\"Templates are stored as workspace configurations with the 'template.' key prefix — once added, ready-to-apply workflow setups appear here.\"\n        />\n      ) : (\n        <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3\">\n          {templates.map((template: ConfigurationFieldsFragment) => {\n            const val = template.value as Record<string, unknown>;\n            const name =\n              (val.name as string) ?? template.key.replace(\"template.\", \"\");\n            const category = (val.category as string) ?? \"General\";\n            const industry = (val.industry as string) ?? \"Any\";\n            const description = (val.description as string) ?? \"\";\n\n            return (\n              <div\n                key={template.id}\n                role=\"button\"\n                tabIndex={0}\n                onClick={() => navigate(`/templates/${template.id}`)}\n                onKeyDown={(e) => {\n                  if (e.key === \"Enter\" || e.key === \" \") {\n                    e.preventDefault();\n                    navigate(`/templates/${template.id}`);\n                  }\n                }}\n                className=\"cursor-pointer rounded-xl border border-border-seam bg-gloss-card p-5 shadow-pop transition-colors hover:bg-bg-sunken/50\"\n              >\n                <div className=\"flex items-start gap-3\">\n                  <div className=\"flex h-12 w-12 items-center justify-center rounded-xl bg-action-primary-bg/10\">\n                    <Sparkles className=\"h-6 w-6 text-primary\" />\n                  </div>\n                  <div className=\"flex-1\">\n                    <p className=\"text-sm font-semibold text-text-primary\">\n                      {name}\n                    </p>\n                    <p className=\"text-xs text-text-secondary\">\n                      {category} &middot; {industry}\n                    </p>\n                  </div>\n                </div>\n                {description && (\n                  <p className=\"mt-3 line-clamp-2 text-xs text-text-secondary\">\n                    {description}\n                  </p>\n                )}\n                <div className=\"mt-3 flex items-center justify-end text-xs font-medium text-primary\">\n                  View template <ArrowRight className=\"ml-1 h-3 w-3\" />\n                </div>\n              </div>\n            );\n          })}\n        </div>\n      )}\n    </PageLayout>\n  );\n}\n"],"mappings":";;;;;;;;;AAWA,SAAgB,IAAgB;CAC9B,IAAM,IAAW,GAAuB,EAElC,EAAE,SAAM,YAAS,aAAU,EAA2B,EAC1D,WAAW,EAAE,OAAO,EAAsB,WAAW,EACtD,CAAC,EAKI,KAHiB,GAAM,kBAAkB,EAAE,EAGhB,QAAQ,MACvC,EAAE,IAAI,WAAW,YAAY,CAC9B;AA0BD,QAxBI,IAEA,kBAAC,GAAD;EACE,OAAM;EACN,aAAY;YAEZ,kBAAC,GAAD;GAAiB,SAAQ;GAAO,OAAO;GAAK,CAAA;EACjC,CAAA,GAIb,IAEA,kBAAC,GAAD;EACE,OAAM;EACN,aAAY;YAEZ,kBAAC,OAAD;GAAK,WAAU;aAAoG;GAE7G,CAAA;EACK,CAAA,GAKf,kBAAC,GAAD;EACE,OAAM;EACN,aAAY;EACZ,SAAQ;YAEP,EAAU,WAAW,IACpB,kBAAC,GAAD;GACE,cAAa;GACb,OAAM;GACN,aAAY;GACZ,CAAA,GAEF,kBAAC,OAAD;GAAK,WAAU;aACZ,EAAU,KAAK,MAA0C;IACxD,IAAM,IAAM,EAAS,OACf,IACH,EAAI,QAAmB,EAAS,IAAI,QAAQ,aAAa,GAAG,EACzD,IAAY,EAAI,YAAuB,WACvC,IAAY,EAAI,YAAuB,OACvC,IAAe,EAAI,eAA0B;AAEnD,WACE,kBAAC,OAAD;KAEE,MAAK;KACL,UAAU;KACV,eAAe,EAAS,cAAc,EAAS,KAAK;KACpD,YAAY,MAAM;AAChB,OAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,SACjC,EAAE,gBAAgB,EAClB,EAAS,cAAc,EAAS,KAAK;;KAGzC,WAAU;eAXZ;MAaE,kBAAC,OAAD;OAAK,WAAU;iBAAf,CACE,kBAAC,OAAD;QAAK,WAAU;kBACb,kBAAC,GAAD,EAAU,WAAU,wBAAyB,CAAA;QACzC,CAAA,EACN,kBAAC,OAAD;QAAK,WAAU;kBAAf,CACE,kBAAC,KAAD;SAAG,WAAU;mBACV;SACC,CAAA,EACJ,kBAAC,KAAD;SAAG,WAAU;mBAAb;UACG;UAAS;UAAW;UACnB;WACA;UACF;;MACL,KACC,kBAAC,KAAD;OAAG,WAAU;iBACV;OACC,CAAA;MAEN,kBAAC,OAAD;OAAK,WAAU;iBAAf,CAAqF,kBACrE,kBAAC,GAAD,EAAY,WAAU,gBAAiB,CAAA,CACjD;;MACF;OAjCC,EAAS,GAiCV;KAER;GACE,CAAA;EAEG,CAAA"}
+{"version":3,"file":"TemplatesPage.js","names":[],"sources":["../../../../src/timecampus/pages/templates/TemplatesPage.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport {\n  Sparkles,\n  ArrowRight,\n  Briefcase,\n  Megaphone,\n  User,\n  Code2,\n  Palette,\n  LayoutTemplate,\n  Tags,\n  Building2,\n  type LucideIcon,\n} from \"lucide-react\";\nimport { GlassCard } from \"@burdenoff/fe-libs/ui\";\nimport {\n  PageLayout,\n  EmptyState,\n  LoadingSkeleton,\n  StatCard,\n  StatusBadge,\n  ChartCard,\n  DonutChart,\n} from \"../../components\";\nimport { useTimeCampusNavigate } from \"../../providers/TimeCampusProvider\";\nimport {\n  useListConfigurationsQuery,\n  useSetConfigurationMutation,\n  type ConfigurationFieldsFragment,\n} from \"@/generated/wspace-operations\";\nimport { TimeCampusConfigScope } from \"@/generated/wspace-types\";\n\nfunction categoryIcon(category: string): LucideIcon {\n  const c = category.toLowerCase();\n  if (c.includes(\"consult\")) return Briefcase;\n  if (c.includes(\"agenc\")) return Megaphone;\n  if (c.includes(\"freelanc\")) return User;\n  if (c.includes(\"software\") || c.includes(\"engineer\") || c.includes(\"dev\"))\n    return Code2;\n  if (c.includes(\"market\")) return Megaphone;\n  if (c.includes(\"design\")) return Palette;\n  return Sparkles;\n}\n\nexport function TemplatesPage() {\n  const navigate = useTimeCampusNavigate();\n\n  const { data, loading, error, refetch } = useListConfigurationsQuery({\n    variables: { scope: TimeCampusConfigScope.Workspace },\n  });\n\n  const [setConfiguration, { error: applyError }] =\n    useSetConfigurationMutation();\n  const [applyingId, setApplyingId] = useState<string | null>(null);\n\n  const configurations: ConfigurationFieldsFragment[] =\n    data?.timeCampusConfigurations ?? [];\n\n  // Filter configurations that represent templates (key starts with 'template.')\n  const templates = configurations.filter(\n    (c: ConfigurationFieldsFragment) =>\n      c.key.startsWith(\"template.\") && !c.key.startsWith(\"template.applied.\"),\n  );\n\n  // Templates already applied to this workspace — real, no fabrication.\n  const appliedIds = new Set(\n    configurations\n      .filter((c: ConfigurationFieldsFragment) =>\n        c.key.startsWith(\"template.applied.\"),\n      )\n      .map((c) => c.key.replace(\"template.applied.\", \"\")),\n  );\n\n  // Real, derived aggregates over the templates the page already loads.\n  const categoryCounts = templates.reduce<Record<string, number>>(\n    (acc, template) => {\n      const val = (template.value as Record<string, unknown>) ?? {};\n      const category = (val.category as string) ?? \"General\";\n      acc[category] = (acc[category] ?? 0) + 1;\n      return acc;\n    },\n    {},\n  );\n  const industrySet = new Set(\n    templates.map((template) => {\n      const val = (template.value as Record<string, unknown>) ?? {};\n      return (val.industry as string) ?? \"Any\";\n    }),\n  );\n  const categoryMix = Object.entries(categoryCounts)\n    .sort((a, b) => b[1] - a[1])\n    .map(([category, count]) => ({ name: category, value: count }));\n\n  const handleApply = async (template: ConfigurationFieldsFragment) => {\n    const val = (template.value as Record<string, unknown>) ?? {};\n    const name = (val.name as string) ?? template.key.replace(\"template.\", \"\");\n    setApplyingId(template.id);\n    try {\n      await setConfiguration({\n        variables: {\n          input: {\n            key: `template.applied.${template.id}`,\n            scope: TimeCampusConfigScope.Workspace,\n            value: {\n              templateId: template.id,\n              name,\n              appliedAt: new Date().toISOString(),\n            },\n            description: `Applied template: ${name}`,\n          },\n        },\n      });\n      await refetch();\n    } finally {\n      setApplyingId(null);\n    }\n  };\n\n  if (loading) {\n    return (\n      <PageLayout\n        title=\"Templates\"\n        description=\"Pre-built workspace templates for different workflows\"\n      >\n        <LoadingSkeleton variant=\"card\" count={6} />\n      </PageLayout>\n    );\n  }\n\n  if (error) {\n    return (\n      <PageLayout\n        title=\"Templates\"\n        description=\"Pre-built workspace templates for different workflows\"\n      >\n        <div className=\"rounded-lg border border-status-error-bg/40 bg-status-error-bg p-4 text-sm text-status-error-text\">\n          Failed to load template configurations. Please try again later.\n        </div>\n      </PageLayout>\n    );\n  }\n\n  return (\n    <PageLayout\n      title=\"Templates\"\n      description=\"Pre-built workspace templates for different workflows\"\n      purpose=\"Skip the blank-page setup — apply a ready-made template that pre-loads projects, categories and settings for a common workflow, so a new team or workspace is productive in minutes.\"\n    >\n      {templates.length === 0 ? (\n        <EmptyState\n          illustration=\"empty-generic\"\n          title=\"No templates configured yet\"\n          description=\"Templates are stored as workspace configurations with the 'template.' key prefix — once added, ready-to-apply workflow setups appear here.\"\n        />\n      ) : (\n        <div className=\"space-y-6\">\n          {applyError && (\n            <div className=\"rounded-lg border border-status-error-bg/40 bg-status-error-bg p-3 text-sm text-status-error-text\">\n              Couldn&apos;t apply that template. Please try again.\n            </div>\n          )}\n\n          {/* Gallery summary — derived from the templates below */}\n          <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-3\">\n            <StatCard\n              featured\n              title=\"Templates\"\n              value={templates.length}\n              icon={<LayoutTemplate className=\"h-5 w-5\" />}\n              description=\"Ready to apply\"\n            />\n            <StatCard\n              title=\"Categories\"\n              value={Object.keys(categoryCounts).length}\n              icon={<Tags className=\"h-5 w-5\" />}\n              description=\"Workflow types\"\n              iconBgColor=\"bg-status-info-bg text-status-info-text\"\n            />\n            <StatCard\n              title=\"Industries\"\n              value={industrySet.size}\n              icon={<Building2 className=\"h-5 w-5\" />}\n              description=\"Covered\"\n              iconBgColor=\"bg-status-success-bg text-status-success-text\"\n            />\n          </div>\n\n          {/* Category mix ring + template cards */}\n          <div className=\"grid grid-cols-1 gap-6 lg:grid-cols-3\">\n            <ChartCard\n              title=\"By category\"\n              description=\"How the gallery breaks down\"\n              className=\"lg:col-span-1\"\n            >\n              <DonutChart\n                data={categoryMix}\n                centerLabel=\"Templates\"\n                centerValue={templates.length}\n                height={240}\n                ariaLabel=\"Templates grouped by category\"\n                emptyLabel=\"No templates to summarise yet.\"\n              />\n            </ChartCard>\n\n            <div className=\"lg:col-span-2\">\n              <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2\">\n                {templates.map((template: ConfigurationFieldsFragment) => {\n                  const val = (template.value as Record<string, unknown>) ?? {};\n                  const name =\n                    (val.name as string) ??\n                    template.key.replace(\"template.\", \"\");\n                  const category = (val.category as string) ?? \"General\";\n                  const industry = (val.industry as string) ?? \"Any\";\n                  const description = (val.description as string) ?? \"\";\n                  const isApplied = appliedIds.has(template.id);\n                  const isApplying = applyingId === template.id;\n                  const Icon = categoryIcon(category);\n\n                  return (\n                    <GlassCard\n                      key={template.id}\n                      treatment=\"glass\"\n                      role=\"button\"\n                      tabIndex={0}\n                      onClick={() => navigate(`/templates/${template.id}`)}\n                      onKeyDown={(e) => {\n                        if (e.key === \"Enter\" || e.key === \" \") {\n                          e.preventDefault();\n                          navigate(`/templates/${template.id}`);\n                        }\n                      }}\n                      className=\"flex cursor-pointer flex-col p-5\"\n                    >\n                      <div className=\"flex items-start gap-3\">\n                        <div className=\"flex h-12 w-12 shrink-0 items-center justify-center rounded-xl bg-action-primary-bg/10 text-primary\">\n                          <Icon className=\"h-6 w-6\" />\n                        </div>\n                        <div className=\"min-w-0 flex-1\">\n                          <div className=\"flex items-center gap-2\">\n                            <p className=\"truncate text-sm font-semibold text-text-primary\">\n                              {name}\n                            </p>\n                            {isApplied && (\n                              <StatusBadge variant=\"success\" label=\"Applied\" />\n                            )}\n                          </div>\n                          <div className=\"mt-1 flex flex-wrap items-center gap-1.5\">\n                            <StatusBadge variant=\"default\" label={category} />\n                            <StatusBadge variant=\"muted\" label={industry} />\n                          </div>\n                        </div>\n                      </div>\n\n                      {description && (\n                        <p className=\"mt-3 line-clamp-2 text-xs text-text-secondary\">\n                          {description}\n                        </p>\n                      )}\n\n                      <div className=\"mt-4 flex items-center justify-between gap-2 border-t border-border-seam pt-3\">\n                        <span className=\"inline-flex items-center gap-1 text-xs font-medium text-primary\">\n                          View template\n                          <ArrowRight className=\"h-3 w-3\" />\n                        </span>\n                        <button\n                          type=\"button\"\n                          onClick={(e) => {\n                            e.stopPropagation();\n                            void handleApply(template);\n                          }}\n                          disabled={isApplying}\n                          className=\"inline-flex items-center gap-1 rounded-md bg-action-primary-bg px-3 py-1.5 text-xs font-medium text-action-primary-text hover:bg-action-primary-bg/90 disabled:opacity-50\"\n                        >\n                          {isApplying\n                            ? \"Applying...\"\n                            : isApplied\n                              ? \"Apply again\"\n                              : \"Apply Template\"}\n                        </button>\n                      </div>\n                    </GlassCard>\n                  );\n                })}\n              </div>\n            </div>\n          </div>\n        </div>\n      )}\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}