@burdenoff/fluidgrids-fe-sdk 2026.1030.3 → 2026.1031.2

package/dist/{chunk-P4WCNDP7.js → chunk-YU7H4QO2.js}

@@ -1,12 +1,12 @@
-import { useImportWorkflowTemplate, FlowBuilderPage, useWorkflowTemplates, TemplateCard } from './chunk-6DNT5QP5.js';
-import { QuotaExhaustedDialog } from './chunk-C4LNSLQX.js';
-import { templatesControls } from './chunk-D3UWK7GY.js';
-import { useWorkflowDefinitions, useDuplicateWorkflow } from './chunk-OTO46JVO.js';
+import { useImportWorkflowTemplate, FlowBuilderPage, useWorkflowTemplates, TEMPLATE_STORE_CATEGORIES, TemplateCard, useTemplateSubmissions, usePublishToStore } from './chunk-M6GUEJBJ.js';
+import { QuotaExhaustedDialog } from './chunk-IGROOI7E.js';
+import { templatesControls } from './chunk-FNZZ5JJL.js';
+import { useWorkflowDefinitions, useDuplicateWorkflow, useLazyWorkflowDefinition } from './chunk-PKG6BCHB.js';
 import { useFluidGridsPageControls } from './chunk-PJAWNFJV.js';
 import { FluidGridsDocsLink } from './chunk-4VJ3MDOV.js';
-import { BILLING_PLANS_PATH, useFluidGridsAnalytics, emitTemplateUsed, isQuotaExhaustedFailure, SdkPermissionButton, FLUIDGRIDS_PERMISSIONS } from './chunk-Z6THCS3L.js';
+import { BILLING_PLANS_PATH, useFluidGridsAnalytics, emitTemplateUsed, isQuotaExhaustedFailure, SdkPermissionButton, FLUIDGRIDS_PERMISSIONS } from './chunk-6PGLJWIC.js';
 import { useTr } from './chunk-UULVIT25.js';
-import { useState, useEffect, useMemo, useCallback } from 'react';
+import { useState, useEffect, useCallback, useMemo } from 'react';
 import { useParams, useNavigate } from 'react-router';
 import { Icon } from '@iconify/react';
 import { toast } from 'sonner';
@@ -15,7 +15,7 @@ import { ErrorBoundary } from '@burdenoff/fe-libs/shared/components';
 import { ThemeProvider as ThemeProvider$1 } from '@burdenoff/fe-libs/shared/providers/shell';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import '@xyflow/react/dist/style.css';
-import { Input, Skeleton, Card, CardHeader, Badge } from '@burdenoff/fe-libs/ui';
+import { Input, Skeleton, Card, CardHeader, Badge, Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription, Label, Textarea, Select, SelectTrigger, SelectValue, SelectContent, SelectItem, DialogFooter } from '@burdenoff/fe-libs/ui';
 import { v4 } from 'uuid';
 
 function ThemeProvider({ children }) {
@@ -289,6 +289,579 @@ function TemplatePreview() {
     )
   ] });
 }
+
+// src/modules/templates/utils/template-categories.ts
+var TEMPLATE_CATEGORY_LABELS = {
+  automation: "Automation",
+  integration: "Integration",
+  "data-processing": "Data Processing",
+  "ai-ml": "AI/ML",
+  communication: "Communication",
+  devops: "DevOps",
+  marketing: "Marketing",
+  sales: "Sales",
+  support: "Support",
+  productivity: "Productivity",
+  finance: "Finance"
+};
+var TEMPLATE_CATEGORY_ICONS = {
+  automation: "mdi:robot",
+  integration: "mdi:connection",
+  "data-processing": "mdi:database-cog",
+  "ai-ml": "mdi:brain",
+  communication: "mdi:message-text",
+  devops: "mdi:server",
+  marketing: "mdi:bullhorn",
+  sales: "mdi:handshake",
+  support: "mdi:lifebuoy",
+  productivity: "mdi:checkbox-marked-circle-outline",
+  finance: "mdi:currency-usd"
+};
+function parseTemplateTags(value) {
+  const out = [];
+  for (const raw of value.split(",")) {
+    const tag = raw.trim().toLowerCase();
+    if (tag && !out.includes(tag)) out.push(tag);
+  }
+  return out.slice(0, 10);
+}
+var DIFFICULTIES = ["easy", "medium", "hard"];
+function initialCategory(workflow, resubmit) {
+  const candidate = (resubmit?.category ?? workflow?.category ?? "").toLowerCase().replace(/\s+/g, "-");
+  return TEMPLATE_STORE_CATEGORIES.includes(candidate) ? candidate : "automation";
+}
+function PublishTemplateDialog({
+  open,
+  onOpenChange,
+  workflow,
+  resubmit,
+  onSubmitted
+}) {
+  const tr = useTr();
+  const { publishToStore, publishing } = usePublishToStore();
+  const { getWorkflow } = useLazyWorkflowDefinition();
+  const [name, setName] = useState("");
+  const [description, setDescription] = useState("");
+  const [longDescription, setLongDescription] = useState("");
+  const [category, setCategory] = useState("automation");
+  const [tags, setTags] = useState("");
+  const [authorName, setAuthorName] = useState("");
+  const [difficulty, setDifficulty] = useState("medium");
+  const [notes, setNotes] = useState("");
+  const [error, setError] = useState(null);
+  useEffect(() => {
+    if (!open) return;
+    setName(resubmit?.name ?? workflow?.name ?? "");
+    setDescription(resubmit?.description ?? workflow?.description ?? "");
+    setLongDescription("");
+    setCategory(initialCategory(workflow, resubmit));
+    setTags((resubmit?.tags ?? workflow?.tags ?? []).join(", "));
+    setAuthorName(resubmit?.authorName ?? "");
+    setDifficulty("medium");
+    setNotes("");
+    setError(null);
+  }, [open, workflow, resubmit]);
+  const submit = async () => {
+    setError(null);
+    if (!workflow) return;
+    if (!name.trim()) {
+      setError(
+        tr(
+          "fluidgrids.templates.publish.nameRequired",
+          "Enter a template name."
+        )
+      );
+      return;
+    }
+    if (!description.trim()) {
+      setError(
+        tr(
+          "fluidgrids.templates.publish.descriptionRequired",
+          "Enter a one-line summary."
+        )
+      );
+      return;
+    }
+    const current = (workflow.version ? await getWorkflow(workflow.workflowKey, void 0, workflow.version) : null) ?? await getWorkflow(workflow.workflowKey);
+    if (!current?.definitionJson) {
+      setError(
+        tr(
+          "fluidgrids.templates.publish.definitionMissing",
+          "Could not read this workflow's definition. Save it and try again."
+        )
+      );
+      return;
+    }
+    const result = await publishToStore({
+      workflow: current,
+      productId: resubmit?.id,
+      name,
+      description,
+      longDescription: longDescription || void 0,
+      category,
+      tags: parseTemplateTags(tags),
+      authorName: authorName || void 0,
+      difficultyLevel: difficulty,
+      notes: notes || void 0
+    });
+    if (result.success && result.submission) {
+      onSubmitted?.(result.submission);
+      onOpenChange(false);
+    } else {
+      setError(result.message);
+    }
+  };
+  return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsxs(
+    DialogContent,
+    {
+      className: "sm:max-w-lg max-h-[90vh] overflow-y-auto",
+      "data-testid": "publish-template-dialog",
+      children: [
+        /* @__PURE__ */ jsxs(DialogHeader, { children: [
+          /* @__PURE__ */ jsx(DialogTitle, { children: resubmit ? tr(
+            "fluidgrids.templates.publish.resubmitTitle",
+            "Resubmit template"
+          ) : tr(
+            "fluidgrids.templates.publish.title",
+            "Publish to FluidGrids Store"
+          ) }),
+          /* @__PURE__ */ jsx(DialogDescription, { children: tr(
+            "fluidgrids.templates.publish.description",
+            "Share this workflow as a free community template. Saved connections, pinned test data and secrets are removed, and a store reviewer checks it before it is listed."
+          ) })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "space-y-4 py-2", children: [
+          /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+            /* @__PURE__ */ jsx(Label, { htmlFor: "publish-template-name", children: tr("fluidgrids.templates.publish.nameLabel", "Template name") }),
+            /* @__PURE__ */ jsx(
+              Input,
+              {
+                id: "publish-template-name",
+                value: name,
+                maxLength: 120,
+                onChange: (e) => setName(e.target.value)
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+            /* @__PURE__ */ jsx(Label, { htmlFor: "publish-template-summary", children: tr("fluidgrids.templates.publish.summaryLabel", "Summary") }),
+            /* @__PURE__ */ jsx(
+              Input,
+              {
+                id: "publish-template-summary",
+                value: description,
+                maxLength: 500,
+                placeholder: tr(
+                  "fluidgrids.templates.publish.summaryPlaceholder",
+                  "What does this workflow do?"
+                ),
+                onChange: (e) => setDescription(e.target.value)
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+            /* @__PURE__ */ jsx(Label, { htmlFor: "publish-template-details", children: tr(
+              "fluidgrids.templates.publish.detailsLabel",
+              "Details (optional, markdown)"
+            ) }),
+            /* @__PURE__ */ jsx(
+              Textarea,
+              {
+                id: "publish-template-details",
+                rows: 3,
+                value: longDescription,
+                maxLength: 1e4,
+                onChange: (e) => setLongDescription(e.target.value)
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-4", children: [
+            /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+              /* @__PURE__ */ jsx(Label, { htmlFor: "publish-template-category", children: tr("fluidgrids.templates.publish.categoryLabel", "Category") }),
+              /* @__PURE__ */ jsxs(
+                Select,
+                {
+                  value: category,
+                  onValueChange: (value) => setCategory(value),
+                  children: [
+                    /* @__PURE__ */ jsx(SelectTrigger, { id: "publish-template-category", children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+                    /* @__PURE__ */ jsx(SelectContent, { children: TEMPLATE_STORE_CATEGORIES.map((value) => /* @__PURE__ */ jsx(SelectItem, { value, children: tr(
+                      `fluidgrids.templates.categories.${value}`,
+                      TEMPLATE_CATEGORY_LABELS[value]
+                    ) }, value)) })
+                  ]
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+              /* @__PURE__ */ jsx(Label, { htmlFor: "publish-template-difficulty", children: tr(
+                "fluidgrids.templates.publish.difficultyLabel",
+                "Difficulty"
+              ) }),
+              /* @__PURE__ */ jsxs(
+                Select,
+                {
+                  value: difficulty,
+                  onValueChange: (value) => setDifficulty(value),
+                  children: [
+                    /* @__PURE__ */ jsx(SelectTrigger, { id: "publish-template-difficulty", children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+                    /* @__PURE__ */ jsx(SelectContent, { children: DIFFICULTIES.map((value) => /* @__PURE__ */ jsx(SelectItem, { value, children: tr(
+                      `fluidgrids.templates.difficulty.${value}`,
+                      value.charAt(0).toUpperCase() + value.slice(1)
+                    ) }, value)) })
+                  ]
+                }
+              )
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+            /* @__PURE__ */ jsx(Label, { htmlFor: "publish-template-tags", children: tr(
+              "fluidgrids.templates.publish.tagsLabel",
+              "Tags (comma separated, up to 10)"
+            ) }),
+            /* @__PURE__ */ jsx(
+              Input,
+              {
+                id: "publish-template-tags",
+                value: tags,
+                placeholder: "slack, alerts, crm",
+                onChange: (e) => setTags(e.target.value)
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+            /* @__PURE__ */ jsx(Label, { htmlFor: "publish-template-author", children: tr("fluidgrids.templates.publish.authorLabel", "Author name") }),
+            /* @__PURE__ */ jsx(
+              Input,
+              {
+                id: "publish-template-author",
+                value: authorName,
+                maxLength: 120,
+                placeholder: tr(
+                  "fluidgrids.templates.publish.authorPlaceholder",
+                  "Shown on the template. Required for your first one."
+                ),
+                onChange: (e) => setAuthorName(e.target.value)
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+            /* @__PURE__ */ jsx(Label, { htmlFor: "publish-template-notes", children: tr(
+              "fluidgrids.templates.publish.notesLabel",
+              "Note for the reviewer (optional)"
+            ) }),
+            /* @__PURE__ */ jsx(
+              Textarea,
+              {
+                id: "publish-template-notes",
+                rows: 2,
+                value: notes,
+                maxLength: 2e3,
+                onChange: (e) => setNotes(e.target.value)
+              }
+            )
+          ] }),
+          error && /* @__PURE__ */ jsx(
+            "p",
+            {
+              role: "alert",
+              className: "text-sm text-[var(--color-status-error-text)]",
+              "data-testid": "publish-template-error",
+              children: error
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs(DialogFooter, { children: [
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              variant: "outline",
+              onClick: () => onOpenChange(false),
+              disabled: publishing,
+              children: tr("fluidgrids.templates.publish.cancel", "Cancel")
+            }
+          ),
+          /* @__PURE__ */ jsxs(
+            Button,
+            {
+              onClick: () => void submit(),
+              disabled: publishing || !workflow,
+              "data-testid": "publish-template-submit",
+              children: [
+                publishing ? /* @__PURE__ */ jsx(
+                  Icon,
+                  {
+                    icon: "mdi:loading",
+                    width: 14,
+                    className: "mr-1.5 animate-spin"
+                  }
+                ) : /* @__PURE__ */ jsx(Icon, { icon: "mdi:store-plus", width: 14, className: "mr-1.5" }),
+                tr("fluidgrids.templates.publish.submit", "Submit for review")
+              ]
+            }
+          )
+        ] })
+      ]
+    }
+  ) });
+}
+var STATUS_STYLES = {
+  ["PENDING_REVIEW" /* PendingReview */]: {
+    key: "pendingReview",
+    label: "In review",
+    icon: "mdi:clock-outline",
+    className: "bg-[var(--color-status-info-bg-subtle)] text-[var(--color-status-info-text)] border-[var(--color-status-info-border)]"
+  },
+  ["PUBLISHED" /* Published */]: {
+    key: "published",
+    label: "Published",
+    icon: "mdi:check-circle",
+    className: "bg-[var(--color-status-success-bg-subtle)] text-[var(--color-status-success-text)] border-[var(--color-status-success-border)]"
+  },
+  ["REJECTED" /* Rejected */]: {
+    key: "rejected",
+    label: "Changes requested",
+    icon: "mdi:alert-circle",
+    className: "bg-[var(--color-status-error-bg-subtle)] text-[var(--color-status-error-text)] border-[var(--color-status-error-border)]"
+  },
+  ["UNLISTED" /* Unlisted */]: {
+    key: "unlisted",
+    label: "Withdrawn",
+    icon: "mdi:eye-off",
+    className: "bg-[var(--color-status-warning-bg-subtle)] text-[var(--color-status-warning-text)] border-[var(--color-status-warning-border)]"
+  },
+  ["DRAFT" /* Draft */]: {
+    key: "draft",
+    label: "Draft",
+    icon: "mdi:pencil",
+    className: "bg-background-tertiary text-text-secondary border-border-secondary"
+  }
+};
+var RESUBMITTABLE = /* @__PURE__ */ new Set([
+  "DRAFT" /* Draft */,
+  "REJECTED" /* Rejected */,
+  "UNLISTED" /* Unlisted */
+]);
+function categoryLabel(category) {
+  if (!category) return null;
+  return TEMPLATE_CATEGORY_LABELS[category] ?? category;
+}
+function MySubmissionsPanel({ onResubmit }) {
+  const tr = useTr();
+  const { submissions, loading, error, refetch, withdraw, withdrawingId } = useTemplateSubmissions(true);
+  const [confirmingId, setConfirmingId] = useState(null);
+  const handleWithdraw = async (submission) => {
+    if (confirmingId !== submission.id) {
+      setConfirmingId(submission.id);
+      return;
+    }
+    setConfirmingId(null);
+    const result = await withdraw(submission.id);
+    if (result.success) {
+      toast.success(
+        result.removed ? tr(
+          "fluidgrids.templates.submissions.withdrawDeletedToast",
+          "Template withdrawn"
+        ) : tr(
+          "fluidgrids.templates.submissions.withdrawUnlistedToast",
+          "Template taken off the store"
+        )
+      );
+    } else {
+      toast.error(result.message);
+    }
+  };
+  if (loading && submissions.length === 0) {
+    return /* @__PURE__ */ jsx("div", { className: "space-y-3", children: Array.from({ length: 3 }).map((_, i) => /* @__PURE__ */ jsx(Skeleton, { className: "h-24 rounded-lg bg-card-foreground/10" }, i)) });
+  }
+  if (error) {
+    return /* @__PURE__ */ jsxs("div", { className: "p-4 bg-[var(--color-status-error-bg-subtle)] border border-[var(--color-status-error-border)] rounded-lg", children: [
+      /* @__PURE__ */ jsx("p", { className: "text-sm text-[var(--color-status-error-text)]", children: error.message }),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "outline",
+          size: "sm",
+          className: "mt-3",
+          onClick: () => void refetch(),
+          children: tr("fluidgrids.templates.templatesPage.errorStateRetry", "Retry")
+        }
+      )
+    ] });
+  }
+  if (submissions.length === 0) {
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: "flex flex-col items-center justify-center py-20 text-center",
+        "data-testid": "my-submissions-empty",
+        children: [
+          /* @__PURE__ */ jsx("div", { className: "rounded-full bg-background-secondary p-4 mb-4", children: /* @__PURE__ */ jsx(
+            Icon,
+            {
+              icon: "mdi:store-plus",
+              width: 40,
+              className: "text-text-secondary"
+            }
+          ) }),
+          /* @__PURE__ */ jsx("h3", { className: "text-lg font-semibold text-text-primary mb-2", children: tr(
+            "fluidgrids.templates.submissions.emptyTitle",
+            "You have not published any templates yet"
+          ) }),
+          /* @__PURE__ */ jsx("p", { className: "text-sm text-text-secondary max-w-md", children: tr(
+            "fluidgrids.templates.submissions.emptyHint",
+            "Open My Templates and choose Publish on a workflow to share it in the FluidGrids Store."
+          ) })
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx("div", { className: "space-y-3", "data-testid": "my-submissions-list", children: submissions.map((submission) => {
+    const style = STATUS_STYLES[submission.status];
+    const category = categoryLabel(submission.category);
+    const busy = withdrawingId === submission.id;
+    return /* @__PURE__ */ jsx(
+      Card,
+      {
+        className: "border border-border-secondary bg-background-secondary",
+        "data-testid": "my-submission-row",
+        children: /* @__PURE__ */ jsxs(CardHeader, { className: "gap-3", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex flex-col sm:flex-row sm:items-start sm:justify-between gap-3", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3 min-w-0", children: [
+              /* @__PURE__ */ jsx("div", { className: "rounded-lg bg-background-tertiary p-2.5 shrink-0", children: /* @__PURE__ */ jsx(
+                Icon,
+                {
+                  icon: submission.icon ?? "mdi:workflow",
+                  width: 22,
+                  className: "text-text-primary"
+                }
+              ) }),
+              /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
+                /* @__PURE__ */ jsx("h3", { className: "font-semibold text-text-primary leading-tight break-words", children: submission.name }),
+                /* @__PURE__ */ jsx("p", { className: "text-sm text-text-secondary mt-0.5 break-words", children: submission.description }),
+                /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-2 mt-2 text-xs text-text-secondary", children: [
+                  /* @__PURE__ */ jsxs("span", { children: [
+                    "v",
+                    submission.version
+                  ] }),
+                  category && /* @__PURE__ */ jsxs("span", { children: [
+                    "\xB7 ",
+                    category
+                  ] }),
+                  /* @__PURE__ */ jsxs("span", { children: [
+                    "\xB7",
+                    " ",
+                    tr(
+                      "fluidgrids.templates.submissions.nodeCount",
+                      "{{count}} node types",
+                      { count: submission.nodeCount }
+                    )
+                  ] }),
+                  submission.status === "PUBLISHED" /* Published */ && /* @__PURE__ */ jsxs("span", { children: [
+                    "\xB7",
+                    " ",
+                    tr(
+                      "fluidgrids.templates.submissions.downloads",
+                      "{{count}} imports",
+                      { count: submission.downloads }
+                    )
+                  ] }),
+                  submission.sourceWorkflowKey && /* @__PURE__ */ jsxs("span", { className: "truncate", children: [
+                    "\xB7",
+                    " ",
+                    tr(
+                      "fluidgrids.templates.submissions.source",
+                      "from {{key}}",
+                      { key: submission.sourceWorkflowKey }
+                    )
+                  ] })
+                ] })
+              ] })
+            ] }),
+            style && /* @__PURE__ */ jsxs(
+              Badge,
+              {
+                variant: "outline",
+                className: `shrink-0 w-fit ${style.className}`,
+                "data-testid": "my-submission-status",
+                children: [
+                  /* @__PURE__ */ jsx(Icon, { icon: style.icon, width: 14, className: "mr-1" }),
+                  tr(
+                    `fluidgrids.templates.submissions.status.${style.key}`,
+                    style.label
+                  )
+                ]
+              }
+            )
+          ] }),
+          submission.status === "REJECTED" /* Rejected */ && submission.rejectedReason && /* @__PURE__ */ jsxs("div", { className: "rounded-md border border-[var(--color-status-error-border)] bg-[var(--color-status-error-bg-subtle)] p-3 text-sm text-[var(--color-status-error-text)]", children: [
+            /* @__PURE__ */ jsx("span", { className: "font-medium", children: tr(
+              "fluidgrids.templates.submissions.reviewerFeedback",
+              "Reviewer feedback:"
+            ) }),
+            " ",
+            submission.rejectedReason
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap gap-2", children: [
+            RESUBMITTABLE.has(submission.status) && submission.sourceWorkflowKey && /* @__PURE__ */ jsxs(
+              Button,
+              {
+                size: "sm",
+                onClick: () => onResubmit(submission),
+                disabled: busy,
+                children: [
+                  /* @__PURE__ */ jsx(Icon, { icon: "mdi:upload", width: 14, className: "mr-1.5" }),
+                  tr(
+                    "fluidgrids.templates.submissions.resubmit",
+                    "Resubmit"
+                  )
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsxs(
+              Button,
+              {
+                size: "sm",
+                variant: "outline",
+                onClick: () => void handleWithdraw(submission),
+                disabled: busy,
+                "data-testid": "my-submission-withdraw",
+                children: [
+                  busy ? /* @__PURE__ */ jsx(
+                    Icon,
+                    {
+                      icon: "mdi:loading",
+                      width: 14,
+                      className: "mr-1.5 animate-spin"
+                    }
+                  ) : /* @__PURE__ */ jsx(
+                    Icon,
+                    {
+                      icon: "mdi:close-circle-outline",
+                      width: 14,
+                      className: "mr-1.5"
+                    }
+                  ),
+                  confirmingId === submission.id ? tr(
+                    "fluidgrids.templates.submissions.withdrawConfirm",
+                    "Click again to confirm"
+                  ) : submission.status === "PUBLISHED" /* Published */ ? tr(
+                    "fluidgrids.templates.submissions.unlist",
+                    "Take off store"
+                  ) : tr(
+                    "fluidgrids.templates.submissions.withdraw",
+                    "Withdraw"
+                  )
+                ]
+              }
+            )
+          ] })
+        ] })
+      },
+      submission.id
+    );
+  }) });
+}
 var CATEGORIES = [
   { value: "all", label: "All", icon: "mdi:view-grid" },
   {
@@ -387,10 +960,11 @@ function WorkspaceTemplateCard({
   workflow,
   category,
   onUseTemplate,
+  onPublish,
   isLoading
 }) {
   const tr = useTr();
-  const categoryLabel = CATEGORIES.find((c) => c.value === category)?.label ?? tr("fluidgrids.templates.templatesPage.cardDefaultCategory", "Workflow");
+  const categoryLabel2 = CATEGORIES.find((c) => c.value === category)?.label ?? tr("fluidgrids.templates.templatesPage.cardDefaultCategory", "Workflow");
   const categoryColor = CATEGORY_COLORS[category] ?? "bg-bg-sunken text-text-muted border-border-strong";
   return /* @__PURE__ */ jsxs(Card, { className: "group border border-border-secondary bg-background-secondary hover:border-border-primary transition-all duration-200 flex flex-col", children: [
     /* @__PURE__ */ jsxs(CardHeader, { className: "flex-1 pb-3", children: [
@@ -403,7 +977,7 @@ function WorkspaceTemplateCard({
             className: "text-text-primary"
           }
         ) }),
-        /* @__PURE__ */ jsx(Badge, { variant: "outline", className: categoryColor, children: categoryLabel })
+        /* @__PURE__ */ jsx(Badge, { variant: "outline", className: categoryColor, children: categoryLabel2 })
       ] }),
       /* @__PURE__ */ jsx("h3", { className: "font-semibold text-text-primary text-base leading-tight mb-1.5 line-clamp-2", children: workflow.name }),
       /* @__PURE__ */ jsx("p", { className: "text-sm text-text-secondary line-clamp-2 min-h-[2.5rem]", children: workflow.description || tr(
@@ -416,46 +990,66 @@ function WorkspaceTemplateCard({
         "v",
         workflow.version
       ] }),
-      /* @__PURE__ */ jsx(
-        SdkPermissionButton,
-        {
-          permission: FLUIDGRIDS_PERMISSIONS.WORKFLOW_CREATE,
-          deniedTooltip: tr(
-            "fluidgrids.templates.useDeniedTooltip",
-            "You don't have permission to create workflows from templates"
-          ),
-          children: /* @__PURE__ */ jsx(
-            Button,
-            {
-              variant: "default",
-              size: "sm",
-              onClick: () => onUseTemplate(workflow),
-              disabled: isLoading,
-              className: "text-primary-foreground",
-              children: isLoading ? /* @__PURE__ */ jsxs(Fragment, { children: [
-                /* @__PURE__ */ jsx(
-                  Icon,
-                  {
-                    icon: "mdi:loading",
-                    width: 14,
-                    className: "mr-1.5 animate-spin"
-                  }
-                ),
-                tr(
-                  "fluidgrids.templates.templatesPage.cardCreating",
-                  "Creating..."
-                )
-              ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
-                /* @__PURE__ */ jsx(Icon, { icon: "mdi:plus", width: 14, className: "mr-1.5" }),
-                tr(
-                  "fluidgrids.templates.templatesPage.cardUseTemplate",
-                  "Use Template"
-                )
-              ] })
-            }
-          )
-        }
-      )
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsxs(
+          Button,
+          {
+            variant: "outline",
+            size: "sm",
+            onClick: () => onPublish(workflow),
+            disabled: isLoading,
+            title: tr(
+              "fluidgrids.templates.templatesPage.cardPublishHint",
+              "Publish this workflow to the FluidGrids Store"
+            ),
+            "data-testid": "workspace-template-publish",
+            children: [
+              /* @__PURE__ */ jsx(Icon, { icon: "mdi:store-plus", width: 14, className: "mr-1.5" }),
+              tr("fluidgrids.templates.templatesPage.cardPublish", "Publish")
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          SdkPermissionButton,
+          {
+            permission: FLUIDGRIDS_PERMISSIONS.WORKFLOW_CREATE,
+            deniedTooltip: tr(
+              "fluidgrids.templates.useDeniedTooltip",
+              "You don't have permission to create workflows from templates"
+            ),
+            children: /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: "default",
+                size: "sm",
+                onClick: () => onUseTemplate(workflow),
+                disabled: isLoading,
+                className: "text-primary-foreground",
+                children: isLoading ? /* @__PURE__ */ jsxs(Fragment, { children: [
+                  /* @__PURE__ */ jsx(
+                    Icon,
+                    {
+                      icon: "mdi:loading",
+                      width: 14,
+                      className: "mr-1.5 animate-spin"
+                    }
+                  ),
+                  tr(
+                    "fluidgrids.templates.templatesPage.cardCreating",
+                    "Creating..."
+                  )
+                ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+                  /* @__PURE__ */ jsx(Icon, { icon: "mdi:plus", width: 14, className: "mr-1.5" }),
+                  tr(
+                    "fluidgrids.templates.templatesPage.cardUseTemplate",
+                    "Use Template"
+                  )
+                ] })
+              }
+            )
+          }
+        )
+      ] })
     ] }) })
   ] });
 }
@@ -467,6 +1061,9 @@ function TemplatesPage() {
   const [duplicatingId, setDuplicatingId] = useState(null);
   const [activeSource, setActiveSource] = useState("store");
   const [showQuotaExhausted, setShowQuotaExhausted] = useState(false);
+  const [storeCategory, setStoreCategory] = useState("all");
+  const [publishSource, setPublishSource] = useState(null);
+  const [resubmitTarget, setResubmitTarget] = useState(null);
   const { workflows, loading, error, refetch } = useWorkflowDefinitions({
     status: "ACTIVE" /* Active */,
     limit: 100
@@ -484,7 +1081,47 @@ function TemplatesPage() {
   } = useWorkflowTemplates(
     activeSource === "store" ? search : void 0,
     20,
-    activeSource === "store"
+    activeSource === "store",
+    storeCategory === "all" ? void 0 : storeCategory
+  );
+  const handlePublish = useCallback((workflow) => {
+    setResubmitTarget(null);
+    setPublishSource(workflow);
+  }, []);
+  const handleResubmit = useCallback(
+    (submission) => {
+      if (!submission.sourceWorkflowKey) return;
+      setResubmitTarget(submission);
+      setPublishSource({
+        workflowKey: submission.sourceWorkflowKey,
+        version: submission.sourceWorkflowVersion ?? void 0,
+        name: submission.name,
+        description: submission.description,
+        tags: submission.tags,
+        category: submission.category
+      });
+    },
+    []
+  );
+  const handleSubmitted = useCallback(
+    (submission) => {
+      toast.success(
+        tr(
+          "fluidgrids.templates.templatesPage.publishSuccessToast",
+          "Template submitted for review"
+        ),
+        {
+          description: tr(
+            "fluidgrids.templates.templatesPage.publishSuccessDescription",
+            "{{name}} (v{{version}}) is listed in the store once a reviewer approves it.",
+            { name: submission.name, version: submission.version }
+          )
+        }
+      );
+      setResubmitTarget(null);
+      setActiveSource("submissions");
+    },
+    [tr]
   );
   const { getTemplateDetail, parseTemplateContent, importTemplate } = useImportWorkflowTemplate();
   const categorizedWorkflows = useMemo(() => {
@@ -669,6 +1306,10 @@ function TemplatesPage() {
           "fluidgrids.templates.templatesPage.tabMyTemplates",
           "My Templates"
         ),
+        submissionsLabel: tr(
+          "fluidgrids.templates.templatesPage.tabMySubmissions",
+          "My Submissions"
+        ),
         value: activeSource,
         set: setActiveSource
       },
@@ -679,9 +1320,22 @@ function TemplatesPage() {
         neutral: "all",
         value: activeCategory,
         set: setActiveCategory
+      },
+      storeCategory: {
+        label: "Category",
+        options: [
+          { value: "all", label: "All" },
+          ...TEMPLATE_STORE_CATEGORIES.map((value) => ({
+            value,
+            label: TEMPLATE_CATEGORY_LABELS[value]
+          }))
+        ],
+        neutral: "all",
+        value: storeCategory,
+        set: setStoreCategory
       }
     }),
-    [tr, activeSource, activeCategory]
+    [tr, activeSource, activeCategory, storeCategory]
   );
   useFluidGridsPageControls(assistantControls);
   return /* @__PURE__ */ jsxs("div", { className: "p-4 sm:p-6 bg-background-primary min-h-screen", children: [
@@ -747,11 +1401,26 @@ function TemplatesPage() {
                 )
               ]
             }
+          ),
+          /* @__PURE__ */ jsxs(
+            "button",
+            {
+              onClick: () => setActiveSource("submissions"),
+              className: `px-4 py-2 rounded-md text-sm font-medium transition-colors ${activeSource === "submissions" ? "bg-background-primary text-text-primary shadow-sm" : "text-text-secondary hover:text-text-primary"}`,
+              "data-testid": "templates-tab-submissions",
+              children: [
+                /* @__PURE__ */ jsx(Icon, { icon: "mdi:upload", className: "inline mr-1.5", width: 16 }),
+                tr(
+                  "fluidgrids.templates.templatesPage.tabMySubmissions",
+                  "My Submissions"
+                )
+              ]
+            }
           )
         ]
       }
     ),
-    /* @__PURE__ */ jsxs(
+    activeSource !== "submissions" && /* @__PURE__ */ jsxs(
       "div",
       {
         className: "relative max-w-md mb-6",
@@ -830,14 +1499,52 @@ function TemplatesPage() {
           workflow,
           category,
           onUseTemplate: handleUseWorkspaceTemplate,
+          onPublish: handlePublish,
           isLoading: duplicatingId === workflow.id
         },
         workflow.id
       )) })
     ] }),
     activeSource === "store" && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: "flex flex-wrap gap-2 mb-6",
+          "data-testid": "store-template-categories",
+          children: ["all", ...TEMPLATE_STORE_CATEGORIES].map((value) => {
+            const isActive = storeCategory === value;
+            return /* @__PURE__ */ jsxs(
+              "button",
+              {
+                onClick: () => setStoreCategory(value),
+                "aria-pressed": isActive,
+                className: `inline-flex items-center gap-1.5 px-3 py-1.5 rounded-lg text-sm font-medium transition-colors ${isActive ? "bg-background-tertiary text-text-primary border border-border-primary" : "bg-background-secondary text-text-secondary border border-border-secondary hover:text-text-primary hover:border-border-primary"}`,
+                children: [
+                  /* @__PURE__ */ jsx(
+                    Icon,
+                    {
+                      icon: value === "all" ? "mdi:view-grid" : TEMPLATE_CATEGORY_ICONS[value],
+                      width: 16
+                    }
+                  ),
+                  value === "all" ? tr("fluidgrids.templates.categories.all", "All") : tr(
+                    `fluidgrids.templates.categories.${value}`,
+                    TEMPLATE_CATEGORY_LABELS[value]
+                  )
+                ]
+              },
+              value
+            );
+          })
+        }
+      ),
       storeError && /* @__PURE__ */ jsx("div", { className: "mb-6", children: /* @__PURE__ */ jsx(ErrorState, { message: storeError.message, onRetry: storeRefetch }) }),
-      storeLoading && storeTemplates.length === 0 ? /* @__PURE__ */ jsx(TemplateSkeleton, {}) : storeTemplates.length === 0 ? /* @__PURE__ */ jsx(EmptyState, { hasSearch: search.trim().length > 0 }) : /* @__PURE__ */ jsxs("div", { className: "space-y-6", children: [
+      storeLoading && storeTemplates.length === 0 ? /* @__PURE__ */ jsx(TemplateSkeleton, {}) : storeTemplates.length === 0 ? /* @__PURE__ */ jsx(
+        EmptyState,
+        {
+          hasSearch: search.trim().length > 0 || storeCategory !== "all"
+        }
+      ) : /* @__PURE__ */ jsxs("div", { className: "space-y-6", children: [
         /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-4", children: storeTemplates.map((template) => /* @__PURE__ */ jsx(
           TemplateCard,
           {
@@ -875,6 +1582,22 @@ function TemplatesPage() {
         ) })
       ] })
     ] }),
+    activeSource === "submissions" && /* @__PURE__ */ jsx(MySubmissionsPanel, { onResubmit: handleResubmit }),
+    /* @__PURE__ */ jsx(
+      PublishTemplateDialog,
+      {
+        open: publishSource !== null,
+        onOpenChange: (open) => {
+          if (!open) {
+            setPublishSource(null);
+            setResubmitTarget(null);
+          }
+        },
+        workflow: publishSource,
+        resubmit: resubmitTarget,
+        onSubmitted: handleSubmitted
+      }
+    ),
     /* @__PURE__ */ jsx(
       QuotaExhaustedDialog,
       {