From 6ecd4483f8f306cd341f8a1da4b96793ab0a0943 Mon Sep 17 00:00:00 2001
From: shatfield4 <seanhatfield5@gmail.com>
Date: Mon, 9 Jun 2025 17:32:38 -0700
Subject: [PATCH 01/20] implement ui for publish system prompt to hub

---
 frontend/src/index.css                        |   2 +
 .../PublishPromptModal/index.jsx              | 169 ++++++++++++++++++
 .../ChatSettings/ChatPromptSettings/index.jsx |  32 +++-
 frontend/tailwind.config.js                   |   1 +
 4 files changed, 196 insertions(+), 8 deletions(-)
 create mode 100644 frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/PublishPromptModal/index.jsx

diff --git a/frontend/src/index.css b/frontend/src/index.css
index a971f91eaf3..8c4ff7e1aac 100644
--- a/frontend/src/index.css
+++ b/frontend/src/index.css
@@ -17,6 +17,7 @@
   --theme-bg-chat-input: #27282a;
   --theme-text-primary: #ffffff;
   --theme-text-secondary: rgba(255, 255, 255, 0.6);
+  --theme-placeholder: #57585a;
   --theme-sidebar-item-default: rgba(255, 255, 255, 0.1);
   --theme-sidebar-item-selected: rgba(255, 255, 255, 0.3);
   --theme-sidebar-item-hover: #3f3f42;
@@ -116,6 +117,7 @@
   --theme-bg-chat-input: #eaeaea;
   --theme-text-primary: #0e0f0f;
   --theme-text-secondary: #7a7d7e;
+  --theme-placeholder: #9ca3af;
   --theme-sidebar-item-default: #ffffff;
   --theme-sidebar-item-selected: #ffffff;
   --theme-sidebar-item-hover: #c8efff;
diff --git a/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/PublishPromptModal/index.jsx b/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/PublishPromptModal/index.jsx
new file mode 100644
index 00000000000..ae3eb68d573
--- /dev/null
+++ b/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/PublishPromptModal/index.jsx
@@ -0,0 +1,169 @@
+import { useState } from "react";
+import { X } from "@phosphor-icons/react";
+
+export default function PublishPromptModal({ show, onClose, currentPrompt }) {
+  const [formData, setFormData] = useState({
+    name: "",
+    description: "",
+    prompt: currentPrompt || "",
+    tags: "",
+    visibility: "public",
+  });
+
+  if (!show) return null;
+
+  const handleSubmit = (e) => {
+    e.preventDefault();
+    onClose();
+  };
+
+  return (
+    <div className="fixed inset-0 bg-black bg-opacity-80 flex items-center justify-center z-50">
+      <div className="relative w-[900px] max-w-full bg-theme-bg-primary rounded-lg shadow border border-theme-modal-border">
+        <div className="relative p-6">
+          <div className="w-full flex gap-x-2 items-center">
+            <h3 className="text-xl font-semibold text-white">
+              Publish System Prompt
+            </h3>
+          </div>
+          <button
+            onClick={onClose}
+            type="button"
+            className="absolute top-4 right-4 transition-all duration-300 bg-transparent rounded-lg text-sm p-1 inline-flex items-center hover:bg-theme-modal-border hover:border-theme-modal-border hover:border-opacity-50 border-transparent border"
+          >
+            <X size={24} weight="bold" className="text-white" />
+          </button>
+        </div>
+
+        <form onSubmit={handleSubmit} className="flex">
+          <div className="w-1/2 p-6 pt-0 space-y-4">
+            <div>
+              <label className="block text-sm font-semibold text-white mb-1">
+                Name
+              </label>
+              <div className="text-xs text-white/60 mb-2">
+                This is the display name of your system prompt.
+              </div>
+              <input
+                type="text"
+                value={formData.name}
+                placeholder="My System Prompt"
+                onChange={(e) =>
+                  setFormData({ ...formData, name: e.target.value })
+                }
+                className="w-full bg-theme-bg-secondary rounded-lg p-2 text-white text-sm focus:outline-primary-button active:outline-primary-button outline-none placeholder:text-theme-text-placeholder"
+              />
+            </div>
+
+            <div>
+              <label className="block text-sm font-semibold text-white mb-1">
+                Description
+              </label>
+              <div className="text-xs text-white/60 mb-2">
+                This is the description of your system prompt. Use this to
+                describe the purpose of your system prompt.
+              </div>
+              <textarea
+                value={formData.description}
+                placeholder="This is the description of your system prompt. Use this to describe the purpose of your system prompt."
+                onChange={(e) =>
+                  setFormData({ ...formData, description: e.target.value })
+                }
+                className="w-full bg-theme-bg-secondary rounded-lg p-2 text-white text-sm focus:outline-primary-button active:outline-primary-button outline-none min-h-[80px] placeholder:text-theme-text-placeholder"
+              />
+            </div>
+
+            <div>
+              <label className="block text-sm font-semibold text-white mb-1">
+                Tags
+              </label>
+              <div className="text-xs text-white/60 mb-2">
+                Tags are used to label your system prompt for easier searching.
+                You can add multiple tags.
+              </div>
+              <input
+                type="text"
+                value={formData.tags}
+                placeholder="tag1, tag2, tag3"
+                onChange={(e) =>
+                  setFormData({ ...formData, tags: e.target.value })
+                }
+                className="w-full bg-theme-bg-secondary rounded-lg p-2 text-white text-sm focus:outline-primary-button active:outline-primary-button outline-none placeholder:text-theme-text-placeholder"
+              />
+            </div>
+
+            <div>
+              <label className="block text-sm font-semibold text-white mb-1">
+                Visibility
+              </label>
+              <div className="text-xs text-white/60 mb-2">
+                Public system prompts are visible to everyone. Private system
+                prompts are only visible to you and your team.
+              </div>
+              <div className="flex items-center space-x-4">
+                <label className="flex items-center">
+                  <input
+                    type="radio"
+                    name="visibility"
+                    value="public"
+                    checked={formData.visibility === "public"}
+                    onChange={(e) =>
+                      setFormData({ ...formData, visibility: e.target.value })
+                    }
+                    className="mr-2"
+                  />
+                  <span className="text-white text-sm">Public</span>
+                </label>
+                <label className="flex items-center">
+                  <input
+                    type="radio"
+                    name="visibility"
+                    value="private"
+                    checked={formData.visibility === "private"}
+                    onChange={(e) =>
+                      setFormData({ ...formData, visibility: e.target.value })
+                    }
+                    className="mr-2"
+                  />
+                  <span className="text-white text-sm">Private</span>
+                </label>
+              </div>
+              <div className="text-xs text-white/60 mt-2">
+                Private system prompts are currently in early access - you can
+                apply via email to contacting support.
+              </div>
+            </div>
+          </div>
+
+          <div className="w-1/2 p-6 pt-0 space-y-4">
+            <div>
+              <label className="block text-sm font-semibold text-white mb-1">
+                Prompt
+              </label>
+              <div className="text-xs text-white/60 mb-2">
+                This is the actual slash command that will be used to guide the
+                LLM.
+              </div>
+              <textarea
+                value={formData.prompt}
+                placeholder="Enter your system prompt here..."
+                onChange={(e) =>
+                  setFormData({ ...formData, prompt: e.target.value })
+                }
+                className="w-full bg-theme-bg-secondary rounded-lg p-2 text-white text-sm focus:outline-primary-button active:outline-primary-button outline-none min-h-[300px] placeholder:text-theme-text-placeholder"
+              />
+            </div>
+
+            <button
+              type="submit"
+              form="publish-form"
+              className="w-full bg-cta-button hover:bg-opacity-80 text-theme-bg-primary font-medium py-2 px-4 rounded-lg transition-colors"
+            >
+              Create slash command
+            </button>
+          </div>
+        </form>
+      </div>
+    </div>
+  );
+}
diff --git a/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/index.jsx b/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/index.jsx
index 4e4fe04024b..6d58f2e0758 100644
--- a/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/index.jsx
+++ b/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/index.jsx
@@ -6,6 +6,7 @@ import Highlighter from "react-highlight-words";
 import { Link, useSearchParams } from "react-router-dom";
 import paths from "@/utils/paths";
 import ChatPromptHistory from "./ChatPromptHistory";
+import PublishPromptModal from "./PublishPromptModal";
 
 // TODO: Move to backend and have user-language sensitive default prompt
 const DEFAULT_PROMPT =
@@ -21,6 +22,7 @@ export default function ChatPromptSettings({ workspace, setHasChanges }) {
   const promptHistoryRef = useRef(null);
   const historyButtonRef = useRef(null);
   const [searchParams] = useSearchParams();
+  const [showPublishModal, setShowPublishModal] = useState(false);
 
   const handleRestore = (prompt) => {
     setPrompt(prompt);
@@ -77,6 +79,11 @@ export default function ChatPromptSettings({ workspace, setHasChanges }) {
           setShowPromptHistory(false);
         }}
       />
+      <PublishPromptModal
+        show={showPublishModal}
+        onClose={() => setShowPublishModal(false)}
+        currentPrompt={prompt}
+      />
       <div>
         <div className="flex flex-col">
           <div className="flex items-center justify-between">
@@ -120,7 +127,7 @@ export default function ChatPromptSettings({ workspace, setHasChanges }) {
           <button
             ref={historyButtonRef}
             type="button"
-            className="text-theme-text-secondary hover:text-white light:hover:text-black text-sm font-medium"
+            className="text-theme-text-secondary hover:text-white light:hover:text-black text-xs font-medium"
             onClick={(e) => {
               e.preventDefault();
               setShowPromptHistory(!showPromptHistory);
@@ -186,13 +193,22 @@ export default function ChatPromptSettings({ workspace, setHasChanges }) {
           </div>
           <div className="w-full flex flex-row items-center justify-between pt-2">
             {prompt !== DEFAULT_PROMPT && (
-              <button
-                type="button"
-                onClick={() => handleRestore(DEFAULT_PROMPT)}
-                className="text-theme-text-primary hover:text-white light:hover:text-black text-sm font-medium"
-              >
-                Clear
-              </button>
+              <>
+                <button
+                  type="button"
+                  onClick={() => handleRestore(DEFAULT_PROMPT)}
+                  className="text-theme-text-primary hover:text-white light:hover:text-black text-xs font-medium"
+                >
+                  Clear
+                </button>
+                <button
+                  type="button"
+                  onClick={() => setShowPublishModal(true)}
+                  className="text-primary-button hover:text-white light:hover:text-black text-xs font-medium"
+                >
+                  Publish to Community Hub
+                </button>
+              </>
             )}
           </div>
         </div>
diff --git a/frontend/tailwind.config.js b/frontend/tailwind.config.js
index 47d7b4c2ed1..3f07e74b059 100644
--- a/frontend/tailwind.config.js
+++ b/frontend/tailwind.config.js
@@ -61,6 +61,7 @@ export default {
           text: {
             primary: 'var(--theme-text-primary)',
             secondary: 'var(--theme-text-secondary)',
+            placeholder: 'var(--theme-placeholder)',
           },
           sidebar: {
             item: {

From 17b4b7260d5ca86bd082bb51683ddd45ec457d98 Mon Sep 17 00:00:00 2001
From: shatfield4 <seanhatfield5@gmail.com>
Date: Tue, 10 Jun 2025 18:23:55 -0700
Subject: [PATCH 02/20] rework ui + add backend to upload to hub

---
 frontend/src/models/communityHub.js           |  28 +++
 .../PublishPromptModal/index.jsx              | 176 ++++++++++++------
 server/endpoints/communityHub.js              |  40 ++++
 server/models/communityHub.js                 |  29 +++
 4 files changed, 213 insertions(+), 60 deletions(-)

diff --git a/frontend/src/models/communityHub.js b/frontend/src/models/communityHub.js
index 517adbc80db..2556a270bd4 100644
--- a/frontend/src/models/communityHub.js
+++ b/frontend/src/models/communityHub.js
@@ -153,6 +153,34 @@ const CommunityHub = {
         };
       });
   },
+
+  /**
+   * Create a new system prompt in the community hub
+   * @param {Object} data - The system prompt data
+   * @param {string} data.name - The name of the prompt
+   * @param {string} data.description - The description of the prompt
+   * @param {string} data.prompt - The actual system prompt text
+   * @param {string[]} data.tags - Array of tags
+   * @param {string} data.visibility - Either 'public' or 'private'
+   * @returns {Promise<{success: boolean, error: string | null}>}
+   */
+  createSystemPrompt: async (data) => {
+    return await fetch(`${API_BASE}/community-hub/system-prompt/create`, {
+      method: "POST",
+      headers: baseHeaders(),
+      body: JSON.stringify(data),
+    })
+      .then(async (res) => {
+        const response = await res.json();
+        if (!res.ok)
+          throw new Error(response.error || "Failed to create system prompt");
+        return { success: true, error: null };
+      })
+      .catch((e) => ({
+        success: false,
+        error: e.message,
+      }));
+  },
 };
 
 export default CommunityHub;
diff --git a/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/PublishPromptModal/index.jsx b/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/PublishPromptModal/index.jsx
index ae3eb68d573..db73a1d2b13 100644
--- a/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/PublishPromptModal/index.jsx
+++ b/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/PublishPromptModal/index.jsx
@@ -1,20 +1,56 @@
-import { useState } from "react";
 import { X } from "@phosphor-icons/react";
+import { useState } from "react";
+import CommunityHub from "@/models/communityHub";
+import showToast from "@/utils/toast";
 
 export default function PublishPromptModal({ show, onClose, currentPrompt }) {
-  const [formData, setFormData] = useState({
-    name: "",
-    description: "",
-    prompt: currentPrompt || "",
-    tags: "",
-    visibility: "public",
-  });
-
+  const [isSubmitting, setIsSubmitting] = useState(false);
+  const [tags, setTags] = useState([]);
+  const [tagInput, setTagInput] = useState("");
   if (!show) return null;
 
-  const handleSubmit = (e) => {
+  const handleSubmit = async (e) => {
     e.preventDefault();
-    onClose();
+    setIsSubmitting(true);
+    try {
+      const form = new FormData(e.target.closest("form"));
+      const data = {
+        name: form.get("name"),
+        description: form.get("description"),
+        prompt: form.get("prompt"),
+        tags: tags,
+        visibility: form.get("visibility"),
+      };
+
+      const { success, error } = await CommunityHub.createSystemPrompt(data);
+      if (!success) throw new Error(error);
+      showToast("System prompt published successfully!", "success", {
+        clear: true,
+      });
+      onClose();
+    } catch (error) {
+      console.error("Failed to publish prompt:", error);
+      showToast(`Failed to publish prompt: ${error.message}`, "error", {
+        clear: true,
+      });
+    } finally {
+      setIsSubmitting(false);
+    }
+  };
+
+  const handleKeyDown = (e) => {
+    if (e.key === "Enter" || e.key === ",") {
+      e.preventDefault();
+      const value = tagInput.trim();
+      if (value && !tags.includes(value)) {
+        setTags([...tags, value]);
+        setTagInput("");
+      }
+    }
+  };
+
+  const removeTag = (tagToRemove) => {
+    setTags(tags.filter((tag) => tag !== tagToRemove));
   };
 
   return (
@@ -35,7 +71,7 @@ export default function PublishPromptModal({ show, onClose, currentPrompt }) {
           </button>
         </div>
 
-        <form onSubmit={handleSubmit} className="flex">
+        <form className="flex">
           <div className="w-1/2 p-6 pt-0 space-y-4">
             <div>
               <label className="block text-sm font-semibold text-white mb-1">
@@ -46,11 +82,10 @@ export default function PublishPromptModal({ show, onClose, currentPrompt }) {
               </div>
               <input
                 type="text"
-                value={formData.name}
+                name="name"
+                required
+                minLength={3}
                 placeholder="My System Prompt"
-                onChange={(e) =>
-                  setFormData({ ...formData, name: e.target.value })
-                }
                 className="w-full bg-theme-bg-secondary rounded-lg p-2 text-white text-sm focus:outline-primary-button active:outline-primary-button outline-none placeholder:text-theme-text-placeholder"
               />
             </div>
@@ -64,11 +99,10 @@ export default function PublishPromptModal({ show, onClose, currentPrompt }) {
                 describe the purpose of your system prompt.
               </div>
               <textarea
-                value={formData.description}
+                name="description"
+                required
+                minLength={10}
                 placeholder="This is the description of your system prompt. Use this to describe the purpose of your system prompt."
-                onChange={(e) =>
-                  setFormData({ ...formData, description: e.target.value })
-                }
                 className="w-full bg-theme-bg-secondary rounded-lg p-2 text-white text-sm focus:outline-primary-button active:outline-primary-button outline-none min-h-[80px] placeholder:text-theme-text-placeholder"
               />
             </div>
@@ -81,15 +115,38 @@ export default function PublishPromptModal({ show, onClose, currentPrompt }) {
                 Tags are used to label your system prompt for easier searching.
                 You can add multiple tags.
               </div>
-              <input
-                type="text"
-                value={formData.tags}
-                placeholder="tag1, tag2, tag3"
-                onChange={(e) =>
-                  setFormData({ ...formData, tags: e.target.value })
-                }
-                className="w-full bg-theme-bg-secondary rounded-lg p-2 text-white text-sm focus:outline-primary-button active:outline-primary-button outline-none placeholder:text-theme-text-placeholder"
-              />
+              <div className="flex flex-wrap gap-2 p-2 bg-theme-bg-secondary rounded-lg min-h-[42px]">
+                {tags.map((tag, index) => (
+                  <span
+                    key={index}
+                    className="flex items-center gap-1 px-2 py-1 text-sm text-white bg-white/10 rounded-md"
+                  >
+                    {tag}
+                    <button
+                      type="button"
+                      onClick={() => removeTag(tag)}
+                      className="text-white/60 hover:text-white"
+                    >
+                      <svg
+                        width="14"
+                        height="14"
+                        viewBox="0 0 256 256"
+                        fill="currentColor"
+                      >
+                        <path d="M208.49 191.51a12 12 0 0 1-17 17L128 145l-63.51 63.49a12 12 0 0 1-17-17L111 128L47.51 64.49a12 12 0 0 1 17-17L128 111l63.51-63.52a12 12 0 0 1 17 17L145 128Z" />
+                      </svg>
+                    </button>
+                  </span>
+                ))}
+                <input
+                  type="text"
+                  value={tagInput}
+                  onChange={(e) => setTagInput(e.target.value)}
+                  onKeyDown={handleKeyDown}
+                  placeholder="Type and press Enter to add tags"
+                  className="flex-1 min-w-[200px] border-none bg-transparent text-white placeholder:text-theme-text-placeholder p-0 h-[24px] focus:outline-none"
+                />
+              </div>
             </div>
 
             <div>
@@ -97,40 +154,38 @@ export default function PublishPromptModal({ show, onClose, currentPrompt }) {
                 Visibility
               </label>
               <div className="text-xs text-white/60 mb-2">
-                Public system prompts are visible to everyone. Private system
-                prompts are only visible to you and your team.
+                Public system prompts are visible to everyone.
               </div>
-              <div className="flex items-center space-x-4">
-                <label className="flex items-center">
+              <div className="w-fit h-[42px] bg-theme-bg-secondary rounded-lg p-0.5">
+                <div className="flex items-center" role="group">
                   <input
                     type="radio"
+                    id="public"
                     name="visibility"
                     value="public"
-                    checked={formData.visibility === "public"}
-                    onChange={(e) =>
-                      setFormData({ ...formData, visibility: e.target.value })
-                    }
-                    className="mr-2"
+                    className="peer/public hidden"
+                    defaultChecked
                   />
-                  <span className="text-white text-sm">Public</span>
-                </label>
-                <label className="flex items-center">
                   <input
                     type="radio"
+                    id="private"
                     name="visibility"
                     value="private"
-                    checked={formData.visibility === "private"}
-                    onChange={(e) =>
-                      setFormData({ ...formData, visibility: e.target.value })
-                    }
-                    className="mr-2"
+                    className="peer/private hidden"
                   />
-                  <span className="text-white text-sm">Private</span>
-                </label>
-              </div>
-              <div className="text-xs text-white/60 mt-2">
-                Private system prompts are currently in early access - you can
-                apply via email to contacting support.
+                  <label
+                    htmlFor="public"
+                    className="h-[36px] px-4 rounded-lg text-sm font-medium transition-all duration-200 cursor-pointer text-white/60 hover:text-white peer-checked/public:bg-theme-action-menu-bg peer-checked/public:text-white flex items-center justify-center"
+                  >
+                    Public
+                  </label>
+                  <label
+                    htmlFor="private"
+                    className="h-[36px] px-4 rounded-lg text-sm font-medium transition-all duration-200 cursor-pointer text-white/60 hover:text-white peer-checked/private:bg-theme-action-menu-bg peer-checked/private:text-white flex items-center justify-center"
+                  >
+                    Private
+                  </label>
+                </div>
               </div>
             </div>
           </div>
@@ -145,21 +200,22 @@ export default function PublishPromptModal({ show, onClose, currentPrompt }) {
                 LLM.
               </div>
               <textarea
-                value={formData.prompt}
+                name="prompt"
+                required
+                minLength={10}
+                defaultValue={currentPrompt}
                 placeholder="Enter your system prompt here..."
-                onChange={(e) =>
-                  setFormData({ ...formData, prompt: e.target.value })
-                }
                 className="w-full bg-theme-bg-secondary rounded-lg p-2 text-white text-sm focus:outline-primary-button active:outline-primary-button outline-none min-h-[300px] placeholder:text-theme-text-placeholder"
               />
             </div>
 
             <button
-              type="submit"
-              form="publish-form"
-              className="w-full bg-cta-button hover:bg-opacity-80 text-theme-bg-primary font-medium py-2 px-4 rounded-lg transition-colors"
+              type="button"
+              onClick={handleSubmit}
+              disabled={isSubmitting}
+              className="w-full bg-cta-button hover:bg-opacity-80 text-theme-bg-primary font-medium py-2 px-4 rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
             >
-              Create slash command
+              {isSubmitting ? "Publishing..." : "Publish to Community Hub"}
             </button>
           </div>
         </form>
diff --git a/server/endpoints/communityHub.js b/server/endpoints/communityHub.js
index b8f0981ab52..7dfcf1ded97 100644
--- a/server/endpoints/communityHub.js
+++ b/server/endpoints/communityHub.js
@@ -181,6 +181,46 @@ function communityHubEndpoints(app) {
       }
     }
   );
+
+  /**
+   * Uploads a new system prompt to the community hub
+   */
+  app.post(
+    "/community-hub/system-prompt/create",
+    [validatedRequest, flexUserRoleValid([ROLES.admin])],
+    async (request, response) => {
+      try {
+        const { connectionKey } = await SystemSettings.hubSettings();
+        if (!connectionKey) {
+          throw new Error("Community Hub connection key not found");
+        }
+
+        const data = reqBody(request);
+        const { success, error } = await CommunityHub.createSystemPrompt(
+          data,
+          connectionKey
+        );
+        if (!success) throw new Error(error);
+
+        await Telemetry.sendTelemetry("community_hub_publish", {
+          itemType: "system-prompt",
+          visibility: data.visibility,
+        });
+        await EventLogs.logEvent(
+          "community_hub_publish",
+          {
+            itemType: "system-prompt",
+          },
+          response.locals?.user?.id
+        );
+
+        response.status(200).json({ success: true, error: null });
+      } catch (error) {
+        console.error(error);
+        response.status(500).json({ success: false, error: error.message });
+      }
+    }
+  );
 }
 
 module.exports = { communityHubEndpoints };
diff --git a/server/models/communityHub.js b/server/models/communityHub.js
index e68cdffaebd..9c001a87018 100644
--- a/server/models/communityHub.js
+++ b/server/models/communityHub.js
@@ -172,6 +172,35 @@ const CommunityHub = {
         return { createdByMe: {}, teamItems: [] };
       });
   },
+
+  /**
+   * Create a new system prompt in the community hub
+   * @param {Object} data - The system prompt data
+   * @param {string} connectionKey - The hub connection key
+   * @returns {Promise<{success: boolean, error: string | null}>}
+   */
+  createSystemPrompt: async function (data, connectionKey) {
+    if (!connectionKey)
+      return { success: false, error: "Connection key is required" };
+
+    return await fetch(`${this.apiBase}/system-prompts/create`, {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+        Authorization: `Bearer ${connectionKey}`,
+      },
+      body: JSON.stringify(data),
+    })
+      .then(async (response) => {
+        const result = await response.json();
+        if (!response.ok) throw new Error(result.error || response.statusText);
+        return { success: true, error: null };
+      })
+      .catch((error) => {
+        console.error("Error creating system prompt:", error);
+        return { success: false, error: error.message };
+      });
+  },
 };
 
 module.exports = { CommunityHub };

From 2f905ebe03316e0c30ea11a4190d536a960c06da Mon Sep 17 00:00:00 2001
From: shatfield4 <seanhatfield5@gmail.com>
Date: Wed, 11 Jun 2025 18:26:09 -0700
Subject: [PATCH 03/20] add success modal view + publish menu item +
 translations

---
 frontend/src/locales/en/common.js             |  28 +++++
 frontend/src/models/communityHub.js           |   2 +-
 .../PromptHistoryItem/index.jsx               |  15 ++-
 .../ChatPromptHistory/index.jsx               |   3 +-
 .../PublishPromptModal/index.jsx              | 112 +++++++++++++-----
 .../ChatSettings/ChatPromptSettings/index.jsx |   5 +
 frontend/src/utils/paths.js                   |   3 +
 server/endpoints/communityHub.js              |  10 +-
 server/models/communityHub.js                 |   2 +-
 9 files changed, 141 insertions(+), 39 deletions(-)

diff --git a/frontend/src/locales/en/common.js b/frontend/src/locales/en/common.js
index b6693a79196..b151e4ffd9f 100644
--- a/frontend/src/locales/en/common.js
+++ b/frontend/src/locales/en/common.js
@@ -335,11 +335,39 @@ const TRANSLATIONS = {
         noHistory: "No system prompt history available",
         restore: "Restore",
         delete: "Delete",
+        publish: "Publish to Community Hub",
         deleteConfirm: "Are you sure you want to delete this history item?",
         clearAllConfirm:
           "Are you sure you want to clear all history? This action cannot be undone.",
         expand: "Expand",
       },
+      publish: {
+        public_description: "Public system prompts are visible to everyone.",
+        private_description: "Private system prompts are only visible to you.",
+        success_title: "Success!",
+        success_description:
+          "Your System Prompt has been published to the Community Hub!",
+        success_thank_you: "Thank you for sharing to the Community!",
+        view_on_hub: "View on Community Hub",
+        modal_title: "Publish System Prompt",
+        name_label: "Name",
+        name_description: "This is the display name of your system prompt.",
+        name_placeholder: "My System Prompt",
+        description_label: "Description",
+        description_description:
+          "This is the description of your system prompt. Use this to describe the purpose of your system prompt.",
+        tags_label: "Tags",
+        tags_description:
+          "Tags are used to label your system prompt for easier searching. You can add multiple tags.",
+        tags_placeholder: "Type and press Enter to add tags",
+        visibility_label: "Visibility",
+        prompt_label: "Prompt",
+        prompt_description:
+          "This is the actual slash command that will be used to guide the LLM.",
+        prompt_placeholder: "Enter your system prompt here...",
+        publish_button: "Publish to Community Hub",
+        publishing: "Publishing...",
+      },
     },
     refusal: {
       title: "Query mode refusal response",
diff --git a/frontend/src/models/communityHub.js b/frontend/src/models/communityHub.js
index 2556a270bd4..d3e5f0fb871 100644
--- a/frontend/src/models/communityHub.js
+++ b/frontend/src/models/communityHub.js
@@ -174,7 +174,7 @@ const CommunityHub = {
         const response = await res.json();
         if (!res.ok)
           throw new Error(response.error || "Failed to create system prompt");
-        return { success: true, error: null };
+        return { success: true, error: null, itemId: response.item?.id };
       })
       .catch((e) => ({
         success: false,
diff --git a/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/ChatPromptHistory/PromptHistoryItem/index.jsx b/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/ChatPromptHistory/PromptHistoryItem/index.jsx
index 956bf40336b..c55aaed7154 100644
--- a/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/ChatPromptHistory/PromptHistoryItem/index.jsx
+++ b/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/ChatPromptHistory/PromptHistoryItem/index.jsx
@@ -14,6 +14,7 @@ export default function PromptHistoryItem({
   user,
   onRestore,
   setHistory,
+  onPublish,
 }) {
   const { t } = useTranslation();
   const [showMenu, setShowMenu] = useState(false);
@@ -82,11 +83,21 @@ export default function PromptHistoryItem({
             {showMenu && (
               <div
                 ref={menuRef}
-                className="absolute right-0 top-6 bg-theme-bg-popup-menu rounded-lg z-50"
+                className="absolute right-0 top-6 bg-theme-bg-popup-menu rounded-lg z-50 min-w-[200px]"
               >
                 <button
                   type="button"
-                  className="px-[10px] py-[6px] text-sm text-white hover:bg-theme-hover cursor-pointer border-none"
+                  className="px-[10px] py-[6px] text-sm text-white hover:bg-theme-hover cursor-pointer border-none w-full text-left whitespace-nowrap"
+                  onClick={() => {
+                    setShowMenu(false);
+                    onPublish(prompt);
+                  }}
+                >
+                  {t("chat.prompt.history.publish")}
+                </button>
+                <button
+                  type="button"
+                  className="px-[10px] py-[6px] text-sm text-white hover:bg-theme-hover cursor-pointer border-none w-full text-left whitespace-nowrap"
                   onClick={() => {
                     setShowMenu(false);
                     deleteHistory(id);
diff --git a/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/ChatPromptHistory/index.jsx b/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/ChatPromptHistory/index.jsx
index bfd21d1cb20..531bf4cc74d 100644
--- a/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/ChatPromptHistory/index.jsx
+++ b/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/ChatPromptHistory/index.jsx
@@ -7,7 +7,7 @@ import * as Skeleton from "react-loading-skeleton";
 import "react-loading-skeleton/dist/skeleton.css";
 
 export default forwardRef(function ChatPromptHistory(
-  { show, workspaceSlug, onRestore, onClose },
+  { show, workspaceSlug, onRestore, onClose, onPublish },
   ref
 ) {
   const { t } = useTranslation();
@@ -92,6 +92,7 @@ export default forwardRef(function ChatPromptHistory(
               id={item.id}
               {...item}
               onRestore={() => onRestore(item.prompt)}
+              onPublish={onPublish}
               setHistory={setHistory}
             />
           ))
diff --git a/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/PublishPromptModal/index.jsx b/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/PublishPromptModal/index.jsx
index db73a1d2b13..51937e82fc4 100644
--- a/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/PublishPromptModal/index.jsx
+++ b/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/PublishPromptModal/index.jsx
@@ -1,33 +1,47 @@
 import { X } from "@phosphor-icons/react";
-import { useState } from "react";
+import { useState, useRef } from "react";
 import CommunityHub from "@/models/communityHub";
 import showToast from "@/utils/toast";
+import { useTranslation } from "react-i18next";
+import paths from "@/utils/paths";
 
 export default function PublishPromptModal({ show, onClose, currentPrompt }) {
+  const { t } = useTranslation();
+  const formRef = useRef(null);
   const [isSubmitting, setIsSubmitting] = useState(false);
   const [tags, setTags] = useState([]);
   const [tagInput, setTagInput] = useState("");
+  const [visibility, setVisibility] = useState("public");
+  const [isSuccess, setIsSuccess] = useState(false);
+  const [itemId, setItemId] = useState(null);
   if (!show) return null;
 
+  const handleClose = () => {
+    setIsSuccess(false);
+    setItemId(null);
+    setTags([]);
+    setTagInput("");
+    onClose();
+  };
+
   const handleSubmit = async (e) => {
     e.preventDefault();
     setIsSubmitting(true);
     try {
-      const form = new FormData(e.target.closest("form"));
+      const form = new FormData(formRef.current);
       const data = {
         name: form.get("name"),
         description: form.get("description"),
         prompt: form.get("prompt"),
         tags: tags,
-        visibility: form.get("visibility"),
+        visibility: visibility,
       };
 
-      const { success, error } = await CommunityHub.createSystemPrompt(data);
+      const { success, error, itemId } =
+        await CommunityHub.createSystemPrompt(data);
       if (!success) throw new Error(error);
-      showToast("System prompt published successfully!", "success", {
-        clear: true,
-      });
-      onClose();
+      setItemId(itemId);
+      setIsSuccess(true);
     } catch (error) {
       console.error("Failed to publish prompt:", error);
       showToast(`Failed to publish prompt: ${error.message}`, "error", {
@@ -53,13 +67,50 @@ export default function PublishPromptModal({ show, onClose, currentPrompt }) {
     setTags(tags.filter((tag) => tag !== tagToRemove));
   };
 
+  if (isSuccess) {
+    return (
+      <div className="fixed inset-0 bg-black bg-opacity-80 flex items-center justify-center z-50">
+        <div className="relative w-[400px] max-w-full bg-theme-bg-primary rounded-lg shadow border border-theme-modal-border">
+          <div className="p-6">
+            <button
+              onClick={handleClose}
+              type="button"
+              className="absolute top-4 right-4 transition-all duration-300 bg-transparent rounded-lg text-sm p-1 inline-flex items-center hover:bg-theme-modal-border hover:border-theme-modal-border hover:border-opacity-50 border-transparent border"
+            >
+              <X size={18} weight="bold" className="text-white" />
+            </button>
+            <div className="flex flex-col items-center justify-center gap-y-4">
+              <h3 className="text-lg font-semibold text-theme-checklist-item-completed-text">
+                {t("chat.prompt.publish.success_title")}
+              </h3>
+              <p className="text-lg text-white text-center max-w-[300px]">
+                {t("chat.prompt.publish.success_description")}
+              </p>
+              <p className="text-white/60 text-center text-sm">
+                {t("chat.prompt.publish.success_thank_you")}
+              </p>
+              <a
+                href={paths.communityHub.viewItem("system-prompt", itemId)}
+                target="_blank"
+                rel="noreferrer"
+                className="w-[265px] bg-theme-bg-secondary hover:bg-theme-hover text-white py-2 px-4 rounded-lg transition-colors mt-4 text-sm font-semibold text-center"
+              >
+                {t("chat.prompt.publish.view_on_hub")}
+              </a>
+            </div>
+          </div>
+        </div>
+      </div>
+    );
+  }
+
   return (
     <div className="fixed inset-0 bg-black bg-opacity-80 flex items-center justify-center z-50">
       <div className="relative w-[900px] max-w-full bg-theme-bg-primary rounded-lg shadow border border-theme-modal-border">
         <div className="relative p-6">
           <div className="w-full flex gap-x-2 items-center">
             <h3 className="text-xl font-semibold text-white">
-              Publish System Prompt
+              {t("chat.prompt.publish.modal_title")}
             </h3>
           </div>
           <button
@@ -67,53 +118,51 @@ export default function PublishPromptModal({ show, onClose, currentPrompt }) {
             type="button"
             className="absolute top-4 right-4 transition-all duration-300 bg-transparent rounded-lg text-sm p-1 inline-flex items-center hover:bg-theme-modal-border hover:border-theme-modal-border hover:border-opacity-50 border-transparent border"
           >
-            <X size={24} weight="bold" className="text-white" />
+            <X size={18} weight="bold" className="text-white" />
           </button>
         </div>
 
-        <form className="flex">
+        <form ref={formRef} className="flex">
           <div className="w-1/2 p-6 pt-0 space-y-4">
             <div>
               <label className="block text-sm font-semibold text-white mb-1">
-                Name
+                {t("chat.prompt.publish.name_label")}
               </label>
               <div className="text-xs text-white/60 mb-2">
-                This is the display name of your system prompt.
+                {t("chat.prompt.publish.name_description")}
               </div>
               <input
                 type="text"
                 name="name"
                 required
                 minLength={3}
-                placeholder="My System Prompt"
+                placeholder={t("chat.prompt.publish.name_placeholder")}
                 className="w-full bg-theme-bg-secondary rounded-lg p-2 text-white text-sm focus:outline-primary-button active:outline-primary-button outline-none placeholder:text-theme-text-placeholder"
               />
             </div>
 
             <div>
               <label className="block text-sm font-semibold text-white mb-1">
-                Description
+                {t("chat.prompt.publish.description_label")}
               </label>
               <div className="text-xs text-white/60 mb-2">
-                This is the description of your system prompt. Use this to
-                describe the purpose of your system prompt.
+                {t("chat.prompt.publish.description_description")}
               </div>
               <textarea
                 name="description"
                 required
                 minLength={10}
-                placeholder="This is the description of your system prompt. Use this to describe the purpose of your system prompt."
+                placeholder={t("chat.prompt.publish.description_description")}
                 className="w-full bg-theme-bg-secondary rounded-lg p-2 text-white text-sm focus:outline-primary-button active:outline-primary-button outline-none min-h-[80px] placeholder:text-theme-text-placeholder"
               />
             </div>
 
             <div>
               <label className="block text-sm font-semibold text-white mb-1">
-                Tags
+                {t("chat.prompt.publish.tags_label")}
               </label>
               <div className="text-xs text-white/60 mb-2">
-                Tags are used to label your system prompt for easier searching.
-                You can add multiple tags.
+                {t("chat.prompt.publish.tags_description")}
               </div>
               <div className="flex flex-wrap gap-2 p-2 bg-theme-bg-secondary rounded-lg min-h-[42px]">
                 {tags.map((tag, index) => (
@@ -143,7 +192,7 @@ export default function PublishPromptModal({ show, onClose, currentPrompt }) {
                   value={tagInput}
                   onChange={(e) => setTagInput(e.target.value)}
                   onKeyDown={handleKeyDown}
-                  placeholder="Type and press Enter to add tags"
+                  placeholder={t("chat.prompt.publish.tags_placeholder")}
                   className="flex-1 min-w-[200px] border-none bg-transparent text-white placeholder:text-theme-text-placeholder p-0 h-[24px] focus:outline-none"
                 />
               </div>
@@ -151,10 +200,12 @@ export default function PublishPromptModal({ show, onClose, currentPrompt }) {
 
             <div>
               <label className="block text-sm font-semibold text-white mb-1">
-                Visibility
+                {t("chat.prompt.publish.visibility_label")}
               </label>
               <div className="text-xs text-white/60 mb-2">
-                Public system prompts are visible to everyone.
+                {visibility === "public"
+                  ? t("chat.prompt.publish.public_description")
+                  : t("chat.prompt.publish.private_description")}
               </div>
               <div className="w-fit h-[42px] bg-theme-bg-secondary rounded-lg p-0.5">
                 <div className="flex items-center" role="group">
@@ -165,6 +216,7 @@ export default function PublishPromptModal({ show, onClose, currentPrompt }) {
                     value="public"
                     className="peer/public hidden"
                     defaultChecked
+                    onChange={(e) => setVisibility(e.target.value)}
                   />
                   <input
                     type="radio"
@@ -172,6 +224,7 @@ export default function PublishPromptModal({ show, onClose, currentPrompt }) {
                     name="visibility"
                     value="private"
                     className="peer/private hidden"
+                    onChange={(e) => setVisibility(e.target.value)}
                   />
                   <label
                     htmlFor="public"
@@ -193,18 +246,17 @@ export default function PublishPromptModal({ show, onClose, currentPrompt }) {
           <div className="w-1/2 p-6 pt-0 space-y-4">
             <div>
               <label className="block text-sm font-semibold text-white mb-1">
-                Prompt
+                {t("chat.prompt.publish.prompt_label")}
               </label>
               <div className="text-xs text-white/60 mb-2">
-                This is the actual slash command that will be used to guide the
-                LLM.
+                {t("chat.prompt.publish.prompt_description")}
               </div>
               <textarea
                 name="prompt"
                 required
                 minLength={10}
                 defaultValue={currentPrompt}
-                placeholder="Enter your system prompt here..."
+                placeholder={t("chat.prompt.publish.prompt_placeholder")}
                 className="w-full bg-theme-bg-secondary rounded-lg p-2 text-white text-sm focus:outline-primary-button active:outline-primary-button outline-none min-h-[300px] placeholder:text-theme-text-placeholder"
               />
             </div>
@@ -215,7 +267,9 @@ export default function PublishPromptModal({ show, onClose, currentPrompt }) {
               disabled={isSubmitting}
               className="w-full bg-cta-button hover:bg-opacity-80 text-theme-bg-primary font-medium py-2 px-4 rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
             >
-              {isSubmitting ? "Publishing..." : "Publish to Community Hub"}
+              {isSubmitting
+                ? t("chat.prompt.publish.publishing")
+                : t("chat.prompt.publish.publish_button")}
             </button>
           </div>
         </form>
diff --git a/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/index.jsx b/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/index.jsx
index 6d58f2e0758..df003b3359d 100644
--- a/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/index.jsx
+++ b/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/index.jsx
@@ -75,6 +75,11 @@ export default function ChatPromptSettings({ workspace, setHasChanges }) {
         workspaceSlug={workspace.slug}
         show={showPromptHistory}
         onRestore={handleRestore}
+        onPublish={(prompt) => {
+          setPrompt(prompt);
+          setShowPromptHistory(false);
+          setShowPublishModal(true);
+        }}
         onClose={() => {
           setShowPromptHistory(false);
         }}
diff --git a/frontend/src/utils/paths.js b/frontend/src/utils/paths.js
index bf3a9ef91ae..598b58114f9 100644
--- a/frontend/src/utils/paths.js
+++ b/frontend/src/utils/paths.js
@@ -179,6 +179,9 @@ export default {
     viewMoreOfType: function (type) {
       return `${this.website()}/list/${type}`;
     },
+    viewItem: function (type, id) {
+      return `${this.website()}/i/${type}/${id}`;
+    },
     trending: () => {
       return `/settings/community-hub/trending`;
     },
diff --git a/server/endpoints/communityHub.js b/server/endpoints/communityHub.js
index 7dfcf1ded97..c6eaac97434 100644
--- a/server/endpoints/communityHub.js
+++ b/server/endpoints/communityHub.js
@@ -196,10 +196,8 @@ function communityHubEndpoints(app) {
         }
 
         const data = reqBody(request);
-        const { success, error } = await CommunityHub.createSystemPrompt(
-          data,
-          connectionKey
-        );
+        const { success, error, itemId } =
+          await CommunityHub.createSystemPrompt(data, connectionKey);
         if (!success) throw new Error(error);
 
         await Telemetry.sendTelemetry("community_hub_publish", {
@@ -214,7 +212,9 @@ function communityHubEndpoints(app) {
           response.locals?.user?.id
         );
 
-        response.status(200).json({ success: true, error: null });
+        response
+          .status(200)
+          .json({ success: true, error: null, item: { id: itemId } });
       } catch (error) {
         console.error(error);
         response.status(500).json({ success: false, error: error.message });
diff --git a/server/models/communityHub.js b/server/models/communityHub.js
index 9c001a87018..fc46eb7d6a9 100644
--- a/server/models/communityHub.js
+++ b/server/models/communityHub.js
@@ -194,7 +194,7 @@ const CommunityHub = {
       .then(async (response) => {
         const result = await response.json();
         if (!response.ok) throw new Error(result.error || response.statusText);
-        return { success: true, error: null };
+        return { success: true, error: null, itemId: result.item.id };
       })
       .catch((error) => {
         console.error("Error creating system prompt:", error);

From 74828a67c08fd713ab95bd8034c1449e68e662ea Mon Sep 17 00:00:00 2001
From: shatfield4 <seanhatfield5@gmail.com>
Date: Wed, 11 Jun 2025 18:27:14 -0700
Subject: [PATCH 04/20] normalize translations

---
 frontend/src/locales/ar/common.js    | 24 ++++++++++++++++++++++++
 frontend/src/locales/da/common.js    | 24 ++++++++++++++++++++++++
 frontend/src/locales/de/common.js    | 24 ++++++++++++++++++++++++
 frontend/src/locales/es/common.js    | 24 ++++++++++++++++++++++++
 frontend/src/locales/fa/common.js    | 24 ++++++++++++++++++++++++
 frontend/src/locales/fr/common.js    | 24 ++++++++++++++++++++++++
 frontend/src/locales/he/common.js    | 24 ++++++++++++++++++++++++
 frontend/src/locales/it/common.js    | 24 ++++++++++++++++++++++++
 frontend/src/locales/ja/common.js    | 24 ++++++++++++++++++++++++
 frontend/src/locales/ko/common.js    | 24 ++++++++++++++++++++++++
 frontend/src/locales/lv/common.js    | 24 ++++++++++++++++++++++++
 frontend/src/locales/nl/common.js    | 24 ++++++++++++++++++++++++
 frontend/src/locales/pt_BR/common.js | 24 ++++++++++++++++++++++++
 frontend/src/locales/ru/common.js    | 24 ++++++++++++++++++++++++
 frontend/src/locales/tr/common.js    | 24 ++++++++++++++++++++++++
 frontend/src/locales/vn/common.js    | 24 ++++++++++++++++++++++++
 frontend/src/locales/zh/common.js    | 24 ++++++++++++++++++++++++
 frontend/src/locales/zh_TW/common.js | 24 ++++++++++++++++++++++++
 18 files changed, 432 insertions(+)

diff --git a/frontend/src/locales/ar/common.js b/frontend/src/locales/ar/common.js
index 71ed7092a3a..e9aa30e764e 100644
--- a/frontend/src/locales/ar/common.js
+++ b/frontend/src/locales/ar/common.js
@@ -240,6 +240,30 @@ const TRANSLATIONS = {
         deleteConfirm: null,
         clearAllConfirm: null,
         expand: null,
+        publish: null,
+      },
+      publish: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+        publish_button: null,
+        publishing: null,
       },
     },
     refusal: {
diff --git a/frontend/src/locales/da/common.js b/frontend/src/locales/da/common.js
index 42a0c09a8a4..5d545ae1d7c 100644
--- a/frontend/src/locales/da/common.js
+++ b/frontend/src/locales/da/common.js
@@ -241,6 +241,30 @@ const TRANSLATIONS = {
         deleteConfirm: null,
         clearAllConfirm: null,
         expand: null,
+        publish: null,
+      },
+      publish: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+        publish_button: null,
+        publishing: null,
       },
     },
     refusal: {
diff --git a/frontend/src/locales/de/common.js b/frontend/src/locales/de/common.js
index 77b1a0aa1ac..0a08d067929 100644
--- a/frontend/src/locales/de/common.js
+++ b/frontend/src/locales/de/common.js
@@ -233,6 +233,30 @@ const TRANSLATIONS = {
         deleteConfirm: null,
         clearAllConfirm: null,
         expand: null,
+        publish: null,
+      },
+      publish: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+        publish_button: null,
+        publishing: null,
       },
     },
     refusal: {
diff --git a/frontend/src/locales/es/common.js b/frontend/src/locales/es/common.js
index bb72a433d13..750b30c3088 100644
--- a/frontend/src/locales/es/common.js
+++ b/frontend/src/locales/es/common.js
@@ -235,6 +235,30 @@ const TRANSLATIONS = {
         deleteConfirm: null,
         clearAllConfirm: null,
         expand: null,
+        publish: null,
+      },
+      publish: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+        publish_button: null,
+        publishing: null,
       },
     },
     refusal: {
diff --git a/frontend/src/locales/fa/common.js b/frontend/src/locales/fa/common.js
index 08599498c3e..50aab358640 100644
--- a/frontend/src/locales/fa/common.js
+++ b/frontend/src/locales/fa/common.js
@@ -231,6 +231,30 @@ const TRANSLATIONS = {
         deleteConfirm: null,
         clearAllConfirm: null,
         expand: null,
+        publish: null,
+      },
+      publish: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+        publish_button: null,
+        publishing: null,
       },
     },
     refusal: {
diff --git a/frontend/src/locales/fr/common.js b/frontend/src/locales/fr/common.js
index cf43f2e9627..f19c643b495 100644
--- a/frontend/src/locales/fr/common.js
+++ b/frontend/src/locales/fr/common.js
@@ -236,6 +236,30 @@ const TRANSLATIONS = {
         deleteConfirm: null,
         clearAllConfirm: null,
         expand: null,
+        publish: null,
+      },
+      publish: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+        publish_button: null,
+        publishing: null,
       },
     },
     refusal: {
diff --git a/frontend/src/locales/he/common.js b/frontend/src/locales/he/common.js
index bcb2ab5f969..d494c5e9085 100644
--- a/frontend/src/locales/he/common.js
+++ b/frontend/src/locales/he/common.js
@@ -229,6 +229,30 @@ const TRANSLATIONS = {
         deleteConfirm: null,
         clearAllConfirm: null,
         expand: null,
+        publish: null,
+      },
+      publish: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+        publish_button: null,
+        publishing: null,
       },
     },
     refusal: {
diff --git a/frontend/src/locales/it/common.js b/frontend/src/locales/it/common.js
index bac64617ec1..76b48c538d6 100644
--- a/frontend/src/locales/it/common.js
+++ b/frontend/src/locales/it/common.js
@@ -234,6 +234,30 @@ const TRANSLATIONS = {
         deleteConfirm: null,
         clearAllConfirm: null,
         expand: null,
+        publish: null,
+      },
+      publish: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+        publish_button: null,
+        publishing: null,
       },
     },
     refusal: {
diff --git a/frontend/src/locales/ja/common.js b/frontend/src/locales/ja/common.js
index e6766c3ffc9..22451662fd8 100644
--- a/frontend/src/locales/ja/common.js
+++ b/frontend/src/locales/ja/common.js
@@ -240,6 +240,30 @@ const TRANSLATIONS = {
         deleteConfirm: null,
         clearAllConfirm: null,
         expand: null,
+        publish: null,
+      },
+      publish: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+        publish_button: null,
+        publishing: null,
       },
     },
     refusal: {
diff --git a/frontend/src/locales/ko/common.js b/frontend/src/locales/ko/common.js
index 30ef7fa528d..bf3bad619e0 100644
--- a/frontend/src/locales/ko/common.js
+++ b/frontend/src/locales/ko/common.js
@@ -229,6 +229,30 @@ const TRANSLATIONS = {
         deleteConfirm: null,
         clearAllConfirm: null,
         expand: null,
+        publish: null,
+      },
+      publish: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+        publish_button: null,
+        publishing: null,
       },
     },
     refusal: {
diff --git a/frontend/src/locales/lv/common.js b/frontend/src/locales/lv/common.js
index aaab2ffaeea..3ddbd361514 100644
--- a/frontend/src/locales/lv/common.js
+++ b/frontend/src/locales/lv/common.js
@@ -325,6 +325,30 @@ const TRANSLATIONS = {
         clearAllConfirm:
           "Vai tiešām vēlaties nodzēst visu vēsturi? Šo darbību nevar atsaukt.",
         expand: "Paplašināt",
+        publish: null,
+      },
+      publish: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+        publish_button: null,
+        publishing: null,
       },
     },
     refusal: {
diff --git a/frontend/src/locales/nl/common.js b/frontend/src/locales/nl/common.js
index fec9e96d7dd..a00690b5af8 100644
--- a/frontend/src/locales/nl/common.js
+++ b/frontend/src/locales/nl/common.js
@@ -233,6 +233,30 @@ const TRANSLATIONS = {
         deleteConfirm: null,
         clearAllConfirm: null,
         expand: null,
+        publish: null,
+      },
+      publish: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+        publish_button: null,
+        publishing: null,
       },
     },
     refusal: {
diff --git a/frontend/src/locales/pt_BR/common.js b/frontend/src/locales/pt_BR/common.js
index 343b9d27a28..ea0e2ab54a6 100644
--- a/frontend/src/locales/pt_BR/common.js
+++ b/frontend/src/locales/pt_BR/common.js
@@ -322,6 +322,30 @@ const TRANSLATIONS = {
         clearAllConfirm:
           "Tem certeza que deseja limpar todo o histórico? Esta ação é irreversível.",
         expand: "Expandir",
+        publish: null,
+      },
+      publish: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+        publish_button: null,
+        publishing: null,
       },
     },
     refusal: {
diff --git a/frontend/src/locales/ru/common.js b/frontend/src/locales/ru/common.js
index fa80dbd13fd..121e926e81d 100644
--- a/frontend/src/locales/ru/common.js
+++ b/frontend/src/locales/ru/common.js
@@ -242,6 +242,30 @@ const TRANSLATIONS = {
         deleteConfirm: null,
         clearAllConfirm: null,
         expand: null,
+        publish: null,
+      },
+      publish: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+        publish_button: null,
+        publishing: null,
       },
     },
     refusal: {
diff --git a/frontend/src/locales/tr/common.js b/frontend/src/locales/tr/common.js
index cf94d5308ee..b179dfea1c3 100644
--- a/frontend/src/locales/tr/common.js
+++ b/frontend/src/locales/tr/common.js
@@ -233,6 +233,30 @@ const TRANSLATIONS = {
         deleteConfirm: null,
         clearAllConfirm: null,
         expand: null,
+        publish: null,
+      },
+      publish: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+        publish_button: null,
+        publishing: null,
       },
     },
     refusal: {
diff --git a/frontend/src/locales/vn/common.js b/frontend/src/locales/vn/common.js
index a92e3f23fd1..4f12c15ad65 100644
--- a/frontend/src/locales/vn/common.js
+++ b/frontend/src/locales/vn/common.js
@@ -232,6 +232,30 @@ const TRANSLATIONS = {
         deleteConfirm: null,
         clearAllConfirm: null,
         expand: null,
+        publish: null,
+      },
+      publish: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+        publish_button: null,
+        publishing: null,
       },
     },
     refusal: {
diff --git a/frontend/src/locales/zh/common.js b/frontend/src/locales/zh/common.js
index dd20b892fce..1f7ecf5ce32 100644
--- a/frontend/src/locales/zh/common.js
+++ b/frontend/src/locales/zh/common.js
@@ -312,6 +312,30 @@ const TRANSLATIONS = {
         deleteConfirm: "您确定要删除此历史记录吗？",
         clearAllConfirm: "您确定要清除所有历史记录吗？此操作无法撤消。",
         expand: "展开",
+        publish: null,
+      },
+      publish: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+        publish_button: null,
+        publishing: null,
       },
     },
     refusal: {
diff --git a/frontend/src/locales/zh_TW/common.js b/frontend/src/locales/zh_TW/common.js
index 2abd8567e67..9fd766ee741 100644
--- a/frontend/src/locales/zh_TW/common.js
+++ b/frontend/src/locales/zh_TW/common.js
@@ -230,6 +230,30 @@ const TRANSLATIONS = {
         deleteConfirm: null,
         clearAllConfirm: null,
         expand: null,
+        publish: null,
+      },
+      publish: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+        publish_button: null,
+        publishing: null,
       },
     },
     refusal: {

From c55d8d21c396a6f57b47b0c860db3f8ddd175917 Mon Sep 17 00:00:00 2001
From: shatfield4 <seanhatfield5@gmail.com>
Date: Thu, 12 Jun 2025 16:48:03 -0700
Subject: [PATCH 05/20] refactor PublishEntityModal + add hook for hub auth

---
 .../PublishEntityModal/AgentFlows/index.jsx   |   4 +
 .../SystemPrompts/index.jsx                   | 239 +++++++++++++++
 .../components/PublishEntityModal/index.jsx   |  53 ++++
 .../UnauthenticatedHubModal/index.jsx         |  39 +++
 frontend/src/hooks/useCommunityHubAuth.js     |  25 ++
 frontend/src/locales/en/common.js             |   6 +
 .../PublishPromptModal/index.jsx              | 279 ------------------
 .../ChatSettings/ChatPromptSettings/index.jsx |  25 +-
 8 files changed, 382 insertions(+), 288 deletions(-)
 create mode 100644 frontend/src/components/PublishEntityModal/AgentFlows/index.jsx
 create mode 100644 frontend/src/components/PublishEntityModal/SystemPrompts/index.jsx
 create mode 100644 frontend/src/components/PublishEntityModal/index.jsx
 create mode 100644 frontend/src/components/UnauthenticatedHubModal/index.jsx
 create mode 100644 frontend/src/hooks/useCommunityHubAuth.js
 delete mode 100644 frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/PublishPromptModal/index.jsx

diff --git a/frontend/src/components/PublishEntityModal/AgentFlows/index.jsx b/frontend/src/components/PublishEntityModal/AgentFlows/index.jsx
new file mode 100644
index 00000000000..651c8232c19
--- /dev/null
+++ b/frontend/src/components/PublishEntityModal/AgentFlows/index.jsx
@@ -0,0 +1,4 @@
+// TODO: Placeholder for agent flows
+export default function AgentFlows() {
+  return <div>Agent Flows</div>;
+}
diff --git a/frontend/src/components/PublishEntityModal/SystemPrompts/index.jsx b/frontend/src/components/PublishEntityModal/SystemPrompts/index.jsx
new file mode 100644
index 00000000000..a4786db4b33
--- /dev/null
+++ b/frontend/src/components/PublishEntityModal/SystemPrompts/index.jsx
@@ -0,0 +1,239 @@
+import { useState, useRef } from "react";
+import { useTranslation } from "react-i18next";
+import CommunityHub from "@/models/communityHub";
+import showToast from "@/utils/toast";
+import paths from "@/utils/paths";
+
+export default function SystemPrompts({ entity }) {
+  const { t } = useTranslation();
+  const formRef = useRef(null);
+  const [isSubmitting, setIsSubmitting] = useState(false);
+  const [tags, setTags] = useState([]);
+  const [tagInput, setTagInput] = useState("");
+  const [visibility, setVisibility] = useState("public");
+  const [isSuccess, setIsSuccess] = useState(false);
+  const [itemId, setItemId] = useState(null);
+
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+    setIsSubmitting(true);
+    try {
+      const form = new FormData(formRef.current);
+      const data = {
+        name: form.get("name"),
+        description: form.get("description"),
+        prompt: form.get("prompt"),
+        tags: tags,
+        visibility: visibility,
+      };
+
+      const { success, error, itemId } =
+        await CommunityHub.createSystemPrompt(data);
+      if (!success) throw new Error(error);
+      setItemId(itemId);
+      setIsSuccess(true);
+    } catch (error) {
+      console.error("Failed to publish prompt:", error);
+      showToast(`Failed to publish prompt: ${error.message}`, "error", {
+        clear: true,
+      });
+    } finally {
+      setIsSubmitting(false);
+    }
+  };
+
+  const handleKeyDown = (e) => {
+    if (e.key === "Enter" || e.key === ",") {
+      e.preventDefault();
+      const value = tagInput.trim();
+      if (value && !tags.includes(value)) {
+        setTags([...tags, value]);
+        setTagInput("");
+      }
+    }
+  };
+
+  const removeTag = (tagToRemove) => {
+    setTags(tags.filter((tag) => tag !== tagToRemove));
+  };
+
+  if (isSuccess) {
+    return (
+      <div className="p-6">
+        <div className="flex flex-col items-center justify-center gap-y-4">
+          <h3 className="text-lg font-semibold text-theme-checklist-item-completed-text">
+            {t("chat.prompt.publish.success_title")}
+          </h3>
+          <p className="text-lg text-white text-center max-w-[300px]">
+            {t("chat.prompt.publish.success_description")}
+          </p>
+          <p className="text-white/60 text-center text-sm">
+            {t("chat.prompt.publish.success_thank_you")}
+          </p>
+          <a
+            href={paths.communityHub.viewItem("system-prompt", itemId)}
+            target="_blank"
+            rel="noreferrer"
+            className="w-[265px] bg-theme-bg-secondary hover:bg-theme-hover text-white py-2 px-4 rounded-lg transition-colors mt-4 text-sm font-semibold text-center"
+          >
+            {t("chat.prompt.publish.view_on_hub")}
+          </a>
+        </div>
+      </div>
+    );
+  }
+
+  return (
+    <form ref={formRef} className="flex">
+      <div className="w-1/2 p-6 pt-0 space-y-4">
+        <div>
+          <label className="block text-sm font-semibold text-white mb-1">
+            {t("chat.prompt.publish.name_label")}
+          </label>
+          <div className="text-xs text-white/60 mb-2">
+            {t("chat.prompt.publish.name_description")}
+          </div>
+          <input
+            type="text"
+            name="name"
+            required
+            minLength={3}
+            placeholder={t("chat.prompt.publish.name_placeholder")}
+            className="w-full bg-theme-bg-secondary rounded-lg p-2 text-white text-sm focus:outline-primary-button active:outline-primary-button outline-none placeholder:text-theme-text-placeholder"
+          />
+        </div>
+
+        <div>
+          <label className="block text-sm font-semibold text-white mb-1">
+            {t("chat.prompt.publish.description_label")}
+          </label>
+          <div className="text-xs text-white/60 mb-2">
+            {t("chat.prompt.publish.description_description")}
+          </div>
+          <textarea
+            name="description"
+            required
+            minLength={10}
+            placeholder={t("chat.prompt.publish.description_description")}
+            className="w-full bg-theme-bg-secondary rounded-lg p-2 text-white text-sm focus:outline-primary-button active:outline-primary-button outline-none min-h-[80px] placeholder:text-theme-text-placeholder"
+          />
+        </div>
+
+        <div>
+          <label className="block text-sm font-semibold text-white mb-1">
+            {t("chat.prompt.publish.tags_label")}
+          </label>
+          <div className="text-xs text-white/60 mb-2">
+            {t("chat.prompt.publish.tags_description")}
+          </div>
+          <div className="flex flex-wrap gap-2 p-2 bg-theme-bg-secondary rounded-lg min-h-[42px]">
+            {tags.map((tag, index) => (
+              <span
+                key={index}
+                className="flex items-center gap-1 px-2 py-1 text-sm text-white bg-white/10 rounded-md"
+              >
+                {tag}
+                <button
+                  type="button"
+                  onClick={() => removeTag(tag)}
+                  className="text-white/60 hover:text-white"
+                >
+                  <svg
+                    width="14"
+                    height="14"
+                    viewBox="0 0 256 256"
+                    fill="currentColor"
+                  >
+                    <path d="M208.49 191.51a12 12 0 0 1-17 17L128 145l-63.51 63.49a12 12 0 0 1-17-17L111 128L47.51 64.49a12 12 0 0 1 17-17L128 111l63.51-63.52a12 12 0 0 1 17 17L145 128Z" />
+                  </svg>
+                </button>
+              </span>
+            ))}
+            <input
+              type="text"
+              value={tagInput}
+              onChange={(e) => setTagInput(e.target.value)}
+              onKeyDown={handleKeyDown}
+              placeholder={t("chat.prompt.publish.tags_placeholder")}
+              className="flex-1 min-w-[200px] border-none bg-transparent text-white placeholder:text-theme-text-placeholder p-0 h-[24px] focus:outline-none"
+            />
+          </div>
+        </div>
+
+        <div>
+          <label className="block text-sm font-semibold text-white mb-1">
+            {t("chat.prompt.publish.visibility_label")}
+          </label>
+          <div className="text-xs text-white/60 mb-2">
+            {visibility === "public"
+              ? t("chat.prompt.publish.public_description")
+              : t("chat.prompt.publish.private_description")}
+          </div>
+          <div className="w-fit h-[42px] bg-theme-bg-secondary rounded-lg p-0.5">
+            <div className="flex items-center" role="group">
+              <input
+                type="radio"
+                id="public"
+                name="visibility"
+                value="public"
+                className="peer/public hidden"
+                defaultChecked
+                onChange={(e) => setVisibility(e.target.value)}
+              />
+              <input
+                type="radio"
+                id="private"
+                name="visibility"
+                value="private"
+                className="peer/private hidden"
+                onChange={(e) => setVisibility(e.target.value)}
+              />
+              <label
+                htmlFor="public"
+                className="h-[36px] px-4 rounded-lg text-sm font-medium transition-all duration-200 cursor-pointer text-white/60 hover:text-white peer-checked/public:bg-theme-action-menu-bg peer-checked/public:text-white flex items-center justify-center"
+              >
+                Public
+              </label>
+              <label
+                htmlFor="private"
+                className="h-[36px] px-4 rounded-lg text-sm font-medium transition-all duration-200 cursor-pointer text-white/60 hover:text-white peer-checked/private:bg-theme-action-menu-bg peer-checked/private:text-white flex items-center justify-center"
+              >
+                Private
+              </label>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <div className="w-1/2 p-6 pt-0 space-y-4">
+        <div>
+          <label className="block text-sm font-semibold text-white mb-1">
+            {t("chat.prompt.publish.prompt_label")}
+          </label>
+          <div className="text-xs text-white/60 mb-2">
+            {t("chat.prompt.publish.prompt_description")}
+          </div>
+          <textarea
+            name="prompt"
+            required
+            minLength={10}
+            defaultValue={entity}
+            placeholder={t("chat.prompt.publish.prompt_placeholder")}
+            className="w-full bg-theme-bg-secondary rounded-lg p-2 text-white text-sm focus:outline-primary-button active:outline-primary-button outline-none min-h-[300px] placeholder:text-theme-text-placeholder"
+          />
+        </div>
+
+        <button
+          type="button"
+          onClick={handleSubmit}
+          disabled={isSubmitting}
+          className="w-full bg-cta-button hover:bg-opacity-80 text-theme-bg-primary font-medium py-2 px-4 rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
+        >
+          {isSubmitting
+            ? t("chat.prompt.publish.publishing")
+            : t("chat.prompt.publish.publish_button")}
+        </button>
+      </div>
+    </form>
+  );
+}
diff --git a/frontend/src/components/PublishEntityModal/index.jsx b/frontend/src/components/PublishEntityModal/index.jsx
new file mode 100644
index 00000000000..0bcf96d7550
--- /dev/null
+++ b/frontend/src/components/PublishEntityModal/index.jsx
@@ -0,0 +1,53 @@
+import { X } from "@phosphor-icons/react";
+import { useTranslation } from "react-i18next";
+import SystemPrompts from "./SystemPrompts";
+import UnauthenticatedHubModal from "@/components/UnauthenticatedHubModal";
+import { useCommunityHubAuth } from "@/hooks/useCommunityHubAuth";
+
+export default function PublishEntityModal({
+  show,
+  onClose,
+  entityType,
+  entity,
+}) {
+  const { t } = useTranslation();
+  const { isAuthenticated, loading } = useCommunityHubAuth();
+  if (!show) return null;
+
+  if (loading) return null;
+  if (!isAuthenticated) {
+    return <UnauthenticatedHubModal show={show} onClose={onClose} />;
+  }
+
+  const renderEntityForm = () => {
+    switch (entityType) {
+      case "system-prompt":
+        return <SystemPrompts entity={entity} />;
+      // Other entities
+      default:
+        return null;
+    }
+  };
+
+  return (
+    <div className="fixed inset-0 bg-black bg-opacity-80 flex items-center justify-center z-50">
+      <div className="relative w-[900px] max-w-full bg-theme-bg-primary rounded-lg shadow border border-theme-modal-border">
+        <div className="relative p-6">
+          <div className="w-full flex gap-x-2 items-center">
+            <h3 className="text-xl font-semibold text-white">
+              {t(`chat.prompt.publish.modal_title`)}
+            </h3>
+          </div>
+          <button
+            onClick={onClose}
+            type="button"
+            className="absolute top-4 right-4 transition-all duration-300 bg-transparent rounded-lg text-sm p-1 inline-flex items-center hover:bg-theme-modal-border hover:border-theme-modal-border hover:border-opacity-50 border-transparent border"
+          >
+            <X size={18} weight="bold" className="text-white" />
+          </button>
+        </div>
+        {renderEntityForm()}
+      </div>
+    </div>
+  );
+}
diff --git a/frontend/src/components/UnauthenticatedHubModal/index.jsx b/frontend/src/components/UnauthenticatedHubModal/index.jsx
new file mode 100644
index 00000000000..1e6aef6a2d2
--- /dev/null
+++ b/frontend/src/components/UnauthenticatedHubModal/index.jsx
@@ -0,0 +1,39 @@
+import { X } from "@phosphor-icons/react";
+import { useTranslation } from "react-i18next";
+import paths from "@/utils/paths";
+import { Link } from "react-router-dom";
+
+export default function UnauthenticatedHubModal({ show, onClose }) {
+  const { t } = useTranslation();
+  if (!show) return null;
+
+  return (
+    <div className="fixed inset-0 bg-black bg-opacity-80 flex items-center justify-center z-50">
+      <div className="relative w-[400px] max-w-full bg-theme-bg-primary rounded-lg shadow border border-theme-modal-border">
+        <div className="p-6">
+          <button
+            onClick={onClose}
+            type="button"
+            className="absolute top-4 right-4 transition-all duration-300 bg-transparent rounded-lg text-sm p-1 inline-flex items-center hover:bg-theme-modal-border hover:border-theme-modal-border hover:border-opacity-50 border-transparent border"
+          >
+            <X size={18} weight="bold" className="text-white" />
+          </button>
+          <div className="flex flex-col items-center justify-center gap-y-4">
+            <h3 className="text-lg font-semibold text-white">
+              {t("chat.prompt.publish.unauthenticated.title")}
+            </h3>
+            <p className="text-lg text-white text-center max-w-[300px]">
+              {t("chat.prompt.publish.unauthenticated.description")}
+            </p>
+            <Link
+              to={paths.communityHub.authentication()}
+              className="w-[265px] bg-theme-bg-secondary hover:bg-theme-hover text-white py-2 px-4 rounded-lg transition-colors mt-4 text-sm font-semibold text-center"
+            >
+              {t("chat.prompt.publish.unauthenticated.button")}
+            </Link>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
diff --git a/frontend/src/hooks/useCommunityHubAuth.js b/frontend/src/hooks/useCommunityHubAuth.js
new file mode 100644
index 00000000000..d5f74b50afb
--- /dev/null
+++ b/frontend/src/hooks/useCommunityHubAuth.js
@@ -0,0 +1,25 @@
+import { useState, useEffect } from "react";
+import CommunityHub from "@/models/communityHub";
+
+export function useCommunityHubAuth() {
+  const [isAuthenticated, setIsAuthenticated] = useState(false);
+  const [loading, setLoading] = useState(true);
+
+  useEffect(() => {
+    async function checkAuth() {
+      setLoading(true);
+      try {
+        const { connectionKey } = await CommunityHub.getSettings();
+        setIsAuthenticated(!!connectionKey);
+      } catch (error) {
+        console.error("Error checking hub auth:", error);
+        setIsAuthenticated(false);
+      } finally {
+        setLoading(false);
+      }
+    }
+    checkAuth();
+  }, []);
+
+  return { isAuthenticated, loading };
+}
diff --git a/frontend/src/locales/en/common.js b/frontend/src/locales/en/common.js
index b151e4ffd9f..bd218e5dcd9 100644
--- a/frontend/src/locales/en/common.js
+++ b/frontend/src/locales/en/common.js
@@ -367,6 +367,12 @@ const TRANSLATIONS = {
         prompt_placeholder: "Enter your system prompt here...",
         publish_button: "Publish to Community Hub",
         publishing: "Publishing...",
+        unauthenticated: {
+          title: "Authentication Required",
+          description:
+            "You need to authenticate with the AnythingLLM Community Hub before publishing prompts.",
+          button: "Connect to Community Hub",
+        },
       },
     },
     refusal: {
diff --git a/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/PublishPromptModal/index.jsx b/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/PublishPromptModal/index.jsx
deleted file mode 100644
index 51937e82fc4..00000000000
--- a/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/PublishPromptModal/index.jsx
+++ /dev/null
@@ -1,279 +0,0 @@
-import { X } from "@phosphor-icons/react";
-import { useState, useRef } from "react";
-import CommunityHub from "@/models/communityHub";
-import showToast from "@/utils/toast";
-import { useTranslation } from "react-i18next";
-import paths from "@/utils/paths";
-
-export default function PublishPromptModal({ show, onClose, currentPrompt }) {
-  const { t } = useTranslation();
-  const formRef = useRef(null);
-  const [isSubmitting, setIsSubmitting] = useState(false);
-  const [tags, setTags] = useState([]);
-  const [tagInput, setTagInput] = useState("");
-  const [visibility, setVisibility] = useState("public");
-  const [isSuccess, setIsSuccess] = useState(false);
-  const [itemId, setItemId] = useState(null);
-  if (!show) return null;
-
-  const handleClose = () => {
-    setIsSuccess(false);
-    setItemId(null);
-    setTags([]);
-    setTagInput("");
-    onClose();
-  };
-
-  const handleSubmit = async (e) => {
-    e.preventDefault();
-    setIsSubmitting(true);
-    try {
-      const form = new FormData(formRef.current);
-      const data = {
-        name: form.get("name"),
-        description: form.get("description"),
-        prompt: form.get("prompt"),
-        tags: tags,
-        visibility: visibility,
-      };
-
-      const { success, error, itemId } =
-        await CommunityHub.createSystemPrompt(data);
-      if (!success) throw new Error(error);
-      setItemId(itemId);
-      setIsSuccess(true);
-    } catch (error) {
-      console.error("Failed to publish prompt:", error);
-      showToast(`Failed to publish prompt: ${error.message}`, "error", {
-        clear: true,
-      });
-    } finally {
-      setIsSubmitting(false);
-    }
-  };
-
-  const handleKeyDown = (e) => {
-    if (e.key === "Enter" || e.key === ",") {
-      e.preventDefault();
-      const value = tagInput.trim();
-      if (value && !tags.includes(value)) {
-        setTags([...tags, value]);
-        setTagInput("");
-      }
-    }
-  };
-
-  const removeTag = (tagToRemove) => {
-    setTags(tags.filter((tag) => tag !== tagToRemove));
-  };
-
-  if (isSuccess) {
-    return (
-      <div className="fixed inset-0 bg-black bg-opacity-80 flex items-center justify-center z-50">
-        <div className="relative w-[400px] max-w-full bg-theme-bg-primary rounded-lg shadow border border-theme-modal-border">
-          <div className="p-6">
-            <button
-              onClick={handleClose}
-              type="button"
-              className="absolute top-4 right-4 transition-all duration-300 bg-transparent rounded-lg text-sm p-1 inline-flex items-center hover:bg-theme-modal-border hover:border-theme-modal-border hover:border-opacity-50 border-transparent border"
-            >
-              <X size={18} weight="bold" className="text-white" />
-            </button>
-            <div className="flex flex-col items-center justify-center gap-y-4">
-              <h3 className="text-lg font-semibold text-theme-checklist-item-completed-text">
-                {t("chat.prompt.publish.success_title")}
-              </h3>
-              <p className="text-lg text-white text-center max-w-[300px]">
-                {t("chat.prompt.publish.success_description")}
-              </p>
-              <p className="text-white/60 text-center text-sm">
-                {t("chat.prompt.publish.success_thank_you")}
-              </p>
-              <a
-                href={paths.communityHub.viewItem("system-prompt", itemId)}
-                target="_blank"
-                rel="noreferrer"
-                className="w-[265px] bg-theme-bg-secondary hover:bg-theme-hover text-white py-2 px-4 rounded-lg transition-colors mt-4 text-sm font-semibold text-center"
-              >
-                {t("chat.prompt.publish.view_on_hub")}
-              </a>
-            </div>
-          </div>
-        </div>
-      </div>
-    );
-  }
-
-  return (
-    <div className="fixed inset-0 bg-black bg-opacity-80 flex items-center justify-center z-50">
-      <div className="relative w-[900px] max-w-full bg-theme-bg-primary rounded-lg shadow border border-theme-modal-border">
-        <div className="relative p-6">
-          <div className="w-full flex gap-x-2 items-center">
-            <h3 className="text-xl font-semibold text-white">
-              {t("chat.prompt.publish.modal_title")}
-            </h3>
-          </div>
-          <button
-            onClick={onClose}
-            type="button"
-            className="absolute top-4 right-4 transition-all duration-300 bg-transparent rounded-lg text-sm p-1 inline-flex items-center hover:bg-theme-modal-border hover:border-theme-modal-border hover:border-opacity-50 border-transparent border"
-          >
-            <X size={18} weight="bold" className="text-white" />
-          </button>
-        </div>
-
-        <form ref={formRef} className="flex">
-          <div className="w-1/2 p-6 pt-0 space-y-4">
-            <div>
-              <label className="block text-sm font-semibold text-white mb-1">
-                {t("chat.prompt.publish.name_label")}
-              </label>
-              <div className="text-xs text-white/60 mb-2">
-                {t("chat.prompt.publish.name_description")}
-              </div>
-              <input
-                type="text"
-                name="name"
-                required
-                minLength={3}
-                placeholder={t("chat.prompt.publish.name_placeholder")}
-                className="w-full bg-theme-bg-secondary rounded-lg p-2 text-white text-sm focus:outline-primary-button active:outline-primary-button outline-none placeholder:text-theme-text-placeholder"
-              />
-            </div>
-
-            <div>
-              <label className="block text-sm font-semibold text-white mb-1">
-                {t("chat.prompt.publish.description_label")}
-              </label>
-              <div className="text-xs text-white/60 mb-2">
-                {t("chat.prompt.publish.description_description")}
-              </div>
-              <textarea
-                name="description"
-                required
-                minLength={10}
-                placeholder={t("chat.prompt.publish.description_description")}
-                className="w-full bg-theme-bg-secondary rounded-lg p-2 text-white text-sm focus:outline-primary-button active:outline-primary-button outline-none min-h-[80px] placeholder:text-theme-text-placeholder"
-              />
-            </div>
-
-            <div>
-              <label className="block text-sm font-semibold text-white mb-1">
-                {t("chat.prompt.publish.tags_label")}
-              </label>
-              <div className="text-xs text-white/60 mb-2">
-                {t("chat.prompt.publish.tags_description")}
-              </div>
-              <div className="flex flex-wrap gap-2 p-2 bg-theme-bg-secondary rounded-lg min-h-[42px]">
-                {tags.map((tag, index) => (
-                  <span
-                    key={index}
-                    className="flex items-center gap-1 px-2 py-1 text-sm text-white bg-white/10 rounded-md"
-                  >
-                    {tag}
-                    <button
-                      type="button"
-                      onClick={() => removeTag(tag)}
-                      className="text-white/60 hover:text-white"
-                    >
-                      <svg
-                        width="14"
-                        height="14"
-                        viewBox="0 0 256 256"
-                        fill="currentColor"
-                      >
-                        <path d="M208.49 191.51a12 12 0 0 1-17 17L128 145l-63.51 63.49a12 12 0 0 1-17-17L111 128L47.51 64.49a12 12 0 0 1 17-17L128 111l63.51-63.52a12 12 0 0 1 17 17L145 128Z" />
-                      </svg>
-                    </button>
-                  </span>
-                ))}
-                <input
-                  type="text"
-                  value={tagInput}
-                  onChange={(e) => setTagInput(e.target.value)}
-                  onKeyDown={handleKeyDown}
-                  placeholder={t("chat.prompt.publish.tags_placeholder")}
-                  className="flex-1 min-w-[200px] border-none bg-transparent text-white placeholder:text-theme-text-placeholder p-0 h-[24px] focus:outline-none"
-                />
-              </div>
-            </div>
-
-            <div>
-              <label className="block text-sm font-semibold text-white mb-1">
-                {t("chat.prompt.publish.visibility_label")}
-              </label>
-              <div className="text-xs text-white/60 mb-2">
-                {visibility === "public"
-                  ? t("chat.prompt.publish.public_description")
-                  : t("chat.prompt.publish.private_description")}
-              </div>
-              <div className="w-fit h-[42px] bg-theme-bg-secondary rounded-lg p-0.5">
-                <div className="flex items-center" role="group">
-                  <input
-                    type="radio"
-                    id="public"
-                    name="visibility"
-                    value="public"
-                    className="peer/public hidden"
-                    defaultChecked
-                    onChange={(e) => setVisibility(e.target.value)}
-                  />
-                  <input
-                    type="radio"
-                    id="private"
-                    name="visibility"
-                    value="private"
-                    className="peer/private hidden"
-                    onChange={(e) => setVisibility(e.target.value)}
-                  />
-                  <label
-                    htmlFor="public"
-                    className="h-[36px] px-4 rounded-lg text-sm font-medium transition-all duration-200 cursor-pointer text-white/60 hover:text-white peer-checked/public:bg-theme-action-menu-bg peer-checked/public:text-white flex items-center justify-center"
-                  >
-                    Public
-                  </label>
-                  <label
-                    htmlFor="private"
-                    className="h-[36px] px-4 rounded-lg text-sm font-medium transition-all duration-200 cursor-pointer text-white/60 hover:text-white peer-checked/private:bg-theme-action-menu-bg peer-checked/private:text-white flex items-center justify-center"
-                  >
-                    Private
-                  </label>
-                </div>
-              </div>
-            </div>
-          </div>
-
-          <div className="w-1/2 p-6 pt-0 space-y-4">
-            <div>
-              <label className="block text-sm font-semibold text-white mb-1">
-                {t("chat.prompt.publish.prompt_label")}
-              </label>
-              <div className="text-xs text-white/60 mb-2">
-                {t("chat.prompt.publish.prompt_description")}
-              </div>
-              <textarea
-                name="prompt"
-                required
-                minLength={10}
-                defaultValue={currentPrompt}
-                placeholder={t("chat.prompt.publish.prompt_placeholder")}
-                className="w-full bg-theme-bg-secondary rounded-lg p-2 text-white text-sm focus:outline-primary-button active:outline-primary-button outline-none min-h-[300px] placeholder:text-theme-text-placeholder"
-              />
-            </div>
-
-            <button
-              type="button"
-              onClick={handleSubmit}
-              disabled={isSubmitting}
-              className="w-full bg-cta-button hover:bg-opacity-80 text-theme-bg-primary font-medium py-2 px-4 rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
-            >
-              {isSubmitting
-                ? t("chat.prompt.publish.publishing")
-                : t("chat.prompt.publish.publish_button")}
-            </button>
-          </div>
-        </form>
-      </div>
-    </div>
-  );
-}
diff --git a/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/index.jsx b/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/index.jsx
index df003b3359d..714f2e19749 100644
--- a/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/index.jsx
+++ b/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/index.jsx
@@ -6,7 +6,7 @@ import Highlighter from "react-highlight-words";
 import { Link, useSearchParams } from "react-router-dom";
 import paths from "@/utils/paths";
 import ChatPromptHistory from "./ChatPromptHistory";
-import PublishPromptModal from "./PublishPromptModal";
+import PublishEntityModal from "@/components/PublishEntityModal";
 
 // TODO: Move to backend and have user-language sensitive default prompt
 const DEFAULT_PROMPT =
@@ -23,6 +23,7 @@ export default function ChatPromptSettings({ workspace, setHasChanges }) {
   const historyButtonRef = useRef(null);
   const [searchParams] = useSearchParams();
   const [showPublishModal, setShowPublishModal] = useState(false);
+  const [currentPrompt, setCurrentPrompt] = useState(null);
 
   const handleRestore = (prompt) => {
     setPrompt(prompt);
@@ -68,6 +69,12 @@ export default function ChatPromptSettings({ workspace, setHasChanges }) {
     };
   }, []);
 
+  const handlePublish = (prompt) => {
+    setCurrentPrompt(prompt);
+    setShowPublishModal(true);
+    setShowPromptHistory(false);
+  };
+
   return (
     <>
       <ChatPromptHistory
@@ -75,19 +82,16 @@ export default function ChatPromptSettings({ workspace, setHasChanges }) {
         workspaceSlug={workspace.slug}
         show={showPromptHistory}
         onRestore={handleRestore}
-        onPublish={(prompt) => {
-          setPrompt(prompt);
-          setShowPromptHistory(false);
-          setShowPublishModal(true);
-        }}
+        onPublish={handlePublish}
         onClose={() => {
           setShowPromptHistory(false);
         }}
       />
-      <PublishPromptModal
+      <PublishEntityModal
         show={showPublishModal}
         onClose={() => setShowPublishModal(false)}
-        currentPrompt={prompt}
+        entityType="system-prompt"
+        entity={currentPrompt}
       />
       <div>
         <div className="flex flex-col">
@@ -208,7 +212,10 @@ export default function ChatPromptSettings({ workspace, setHasChanges }) {
                 </button>
                 <button
                   type="button"
-                  onClick={() => setShowPublishModal(true)}
+                  onClick={() => {
+                    setCurrentPrompt(prompt);
+                    setShowPublishModal(true);
+                  }}
                   className="text-primary-button hover:text-white light:hover:text-black text-xs font-medium"
                 >
                   Publish to Community Hub

From 201451413d46ba840de2d9d0f16c82c363cc615d Mon Sep 17 00:00:00 2001
From: shatfield4 <seanhatfield5@gmail.com>
Date: Thu, 12 Jun 2025 16:48:42 -0700
Subject: [PATCH 06/20] normalize translations

---
 frontend/src/locales/ar/common.js    | 5 +++++
 frontend/src/locales/da/common.js    | 5 +++++
 frontend/src/locales/de/common.js    | 5 +++++
 frontend/src/locales/es/common.js    | 5 +++++
 frontend/src/locales/fa/common.js    | 5 +++++
 frontend/src/locales/fr/common.js    | 5 +++++
 frontend/src/locales/he/common.js    | 5 +++++
 frontend/src/locales/it/common.js    | 5 +++++
 frontend/src/locales/ja/common.js    | 5 +++++
 frontend/src/locales/ko/common.js    | 5 +++++
 frontend/src/locales/lv/common.js    | 5 +++++
 frontend/src/locales/nl/common.js    | 5 +++++
 frontend/src/locales/pt_BR/common.js | 5 +++++
 frontend/src/locales/ru/common.js    | 5 +++++
 frontend/src/locales/tr/common.js    | 5 +++++
 frontend/src/locales/vn/common.js    | 5 +++++
 frontend/src/locales/zh/common.js    | 5 +++++
 frontend/src/locales/zh_TW/common.js | 5 +++++
 18 files changed, 90 insertions(+)

diff --git a/frontend/src/locales/ar/common.js b/frontend/src/locales/ar/common.js
index e9aa30e764e..917448158d9 100644
--- a/frontend/src/locales/ar/common.js
+++ b/frontend/src/locales/ar/common.js
@@ -264,6 +264,11 @@ const TRANSLATIONS = {
         prompt_placeholder: null,
         publish_button: null,
         publishing: null,
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
       },
     },
     refusal: {
diff --git a/frontend/src/locales/da/common.js b/frontend/src/locales/da/common.js
index 5d545ae1d7c..550df85e27c 100644
--- a/frontend/src/locales/da/common.js
+++ b/frontend/src/locales/da/common.js
@@ -265,6 +265,11 @@ const TRANSLATIONS = {
         prompt_placeholder: null,
         publish_button: null,
         publishing: null,
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
       },
     },
     refusal: {
diff --git a/frontend/src/locales/de/common.js b/frontend/src/locales/de/common.js
index 0a08d067929..1aef04f87ad 100644
--- a/frontend/src/locales/de/common.js
+++ b/frontend/src/locales/de/common.js
@@ -257,6 +257,11 @@ const TRANSLATIONS = {
         prompt_placeholder: null,
         publish_button: null,
         publishing: null,
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
       },
     },
     refusal: {
diff --git a/frontend/src/locales/es/common.js b/frontend/src/locales/es/common.js
index 750b30c3088..d808681444b 100644
--- a/frontend/src/locales/es/common.js
+++ b/frontend/src/locales/es/common.js
@@ -259,6 +259,11 @@ const TRANSLATIONS = {
         prompt_placeholder: null,
         publish_button: null,
         publishing: null,
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
       },
     },
     refusal: {
diff --git a/frontend/src/locales/fa/common.js b/frontend/src/locales/fa/common.js
index 50aab358640..4582841f9a3 100644
--- a/frontend/src/locales/fa/common.js
+++ b/frontend/src/locales/fa/common.js
@@ -255,6 +255,11 @@ const TRANSLATIONS = {
         prompt_placeholder: null,
         publish_button: null,
         publishing: null,
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
       },
     },
     refusal: {
diff --git a/frontend/src/locales/fr/common.js b/frontend/src/locales/fr/common.js
index f19c643b495..e3f3aeabcbb 100644
--- a/frontend/src/locales/fr/common.js
+++ b/frontend/src/locales/fr/common.js
@@ -260,6 +260,11 @@ const TRANSLATIONS = {
         prompt_placeholder: null,
         publish_button: null,
         publishing: null,
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
       },
     },
     refusal: {
diff --git a/frontend/src/locales/he/common.js b/frontend/src/locales/he/common.js
index d494c5e9085..a0e98218a69 100644
--- a/frontend/src/locales/he/common.js
+++ b/frontend/src/locales/he/common.js
@@ -253,6 +253,11 @@ const TRANSLATIONS = {
         prompt_placeholder: null,
         publish_button: null,
         publishing: null,
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
       },
     },
     refusal: {
diff --git a/frontend/src/locales/it/common.js b/frontend/src/locales/it/common.js
index 76b48c538d6..7d46fbe9052 100644
--- a/frontend/src/locales/it/common.js
+++ b/frontend/src/locales/it/common.js
@@ -258,6 +258,11 @@ const TRANSLATIONS = {
         prompt_placeholder: null,
         publish_button: null,
         publishing: null,
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
       },
     },
     refusal: {
diff --git a/frontend/src/locales/ja/common.js b/frontend/src/locales/ja/common.js
index 22451662fd8..9bc9d17c087 100644
--- a/frontend/src/locales/ja/common.js
+++ b/frontend/src/locales/ja/common.js
@@ -264,6 +264,11 @@ const TRANSLATIONS = {
         prompt_placeholder: null,
         publish_button: null,
         publishing: null,
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
       },
     },
     refusal: {
diff --git a/frontend/src/locales/ko/common.js b/frontend/src/locales/ko/common.js
index bf3bad619e0..f4732f61858 100644
--- a/frontend/src/locales/ko/common.js
+++ b/frontend/src/locales/ko/common.js
@@ -253,6 +253,11 @@ const TRANSLATIONS = {
         prompt_placeholder: null,
         publish_button: null,
         publishing: null,
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
       },
     },
     refusal: {
diff --git a/frontend/src/locales/lv/common.js b/frontend/src/locales/lv/common.js
index 3ddbd361514..6736a356d13 100644
--- a/frontend/src/locales/lv/common.js
+++ b/frontend/src/locales/lv/common.js
@@ -349,6 +349,11 @@ const TRANSLATIONS = {
         prompt_placeholder: null,
         publish_button: null,
         publishing: null,
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
       },
     },
     refusal: {
diff --git a/frontend/src/locales/nl/common.js b/frontend/src/locales/nl/common.js
index a00690b5af8..447c7623698 100644
--- a/frontend/src/locales/nl/common.js
+++ b/frontend/src/locales/nl/common.js
@@ -257,6 +257,11 @@ const TRANSLATIONS = {
         prompt_placeholder: null,
         publish_button: null,
         publishing: null,
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
       },
     },
     refusal: {
diff --git a/frontend/src/locales/pt_BR/common.js b/frontend/src/locales/pt_BR/common.js
index ea0e2ab54a6..97734d4a1c6 100644
--- a/frontend/src/locales/pt_BR/common.js
+++ b/frontend/src/locales/pt_BR/common.js
@@ -346,6 +346,11 @@ const TRANSLATIONS = {
         prompt_placeholder: null,
         publish_button: null,
         publishing: null,
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
       },
     },
     refusal: {
diff --git a/frontend/src/locales/ru/common.js b/frontend/src/locales/ru/common.js
index 121e926e81d..2711d07ed8a 100644
--- a/frontend/src/locales/ru/common.js
+++ b/frontend/src/locales/ru/common.js
@@ -266,6 +266,11 @@ const TRANSLATIONS = {
         prompt_placeholder: null,
         publish_button: null,
         publishing: null,
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
       },
     },
     refusal: {
diff --git a/frontend/src/locales/tr/common.js b/frontend/src/locales/tr/common.js
index b179dfea1c3..0b41670a5fe 100644
--- a/frontend/src/locales/tr/common.js
+++ b/frontend/src/locales/tr/common.js
@@ -257,6 +257,11 @@ const TRANSLATIONS = {
         prompt_placeholder: null,
         publish_button: null,
         publishing: null,
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
       },
     },
     refusal: {
diff --git a/frontend/src/locales/vn/common.js b/frontend/src/locales/vn/common.js
index 4f12c15ad65..7b61a057717 100644
--- a/frontend/src/locales/vn/common.js
+++ b/frontend/src/locales/vn/common.js
@@ -256,6 +256,11 @@ const TRANSLATIONS = {
         prompt_placeholder: null,
         publish_button: null,
         publishing: null,
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
       },
     },
     refusal: {
diff --git a/frontend/src/locales/zh/common.js b/frontend/src/locales/zh/common.js
index 1f7ecf5ce32..e971c192ff2 100644
--- a/frontend/src/locales/zh/common.js
+++ b/frontend/src/locales/zh/common.js
@@ -336,6 +336,11 @@ const TRANSLATIONS = {
         prompt_placeholder: null,
         publish_button: null,
         publishing: null,
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
       },
     },
     refusal: {
diff --git a/frontend/src/locales/zh_TW/common.js b/frontend/src/locales/zh_TW/common.js
index 9fd766ee741..0e691d205bd 100644
--- a/frontend/src/locales/zh_TW/common.js
+++ b/frontend/src/locales/zh_TW/common.js
@@ -254,6 +254,11 @@ const TRANSLATIONS = {
         prompt_placeholder: null,
         publish_button: null,
         publishing: null,
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
       },
     },
     refusal: {

From 929d70b4aa46ecca607a9fea8c74bc224ea173e9 Mon Sep 17 00:00:00 2001
From: shatfield4 <seanhatfield5@gmail.com>
Date: Thu, 12 Jun 2025 17:15:15 -0700
Subject: [PATCH 07/20] fix ui for success screen

---
 .../SystemPrompts/index.jsx                   | 291 +++++++++---------
 .../components/PublishEntityModal/index.jsx   |  16 +-
 2 files changed, 158 insertions(+), 149 deletions(-)

diff --git a/frontend/src/components/PublishEntityModal/SystemPrompts/index.jsx b/frontend/src/components/PublishEntityModal/SystemPrompts/index.jsx
index a4786db4b33..cc64fd8ec95 100644
--- a/frontend/src/components/PublishEntityModal/SystemPrompts/index.jsx
+++ b/frontend/src/components/PublishEntityModal/SystemPrompts/index.jsx
@@ -1,10 +1,10 @@
-import { useState, useRef } from "react";
+import { useState, useRef, useEffect } from "react";
 import { useTranslation } from "react-i18next";
 import CommunityHub from "@/models/communityHub";
 import showToast from "@/utils/toast";
 import paths from "@/utils/paths";
 
-export default function SystemPrompts({ entity }) {
+export default function SystemPrompts({ entity, onSuccessChange }) {
   const { t } = useTranslation();
   const formRef = useRef(null);
   const [isSubmitting, setIsSubmitting] = useState(false);
@@ -14,6 +14,10 @@ export default function SystemPrompts({ entity }) {
   const [isSuccess, setIsSuccess] = useState(false);
   const [itemId, setItemId] = useState(null);
 
+  useEffect(() => {
+    onSuccessChange(isSuccess);
+  }, [isSuccess, onSuccessChange]);
+
   const handleSubmit = async (e) => {
     e.preventDefault();
     setIsSubmitting(true);
@@ -59,7 +63,7 @@ export default function SystemPrompts({ entity }) {
 
   if (isSuccess) {
     return (
-      <div className="p-6">
+      <div className="p-6 -mt-12">
         <div className="flex flex-col items-center justify-center gap-y-4">
           <h3 className="text-lg font-semibold text-theme-checklist-item-completed-text">
             {t("chat.prompt.publish.success_title")}
@@ -84,156 +88,163 @@ export default function SystemPrompts({ entity }) {
   }
 
   return (
-    <form ref={formRef} className="flex">
-      <div className="w-1/2 p-6 pt-0 space-y-4">
-        <div>
-          <label className="block text-sm font-semibold text-white mb-1">
-            {t("chat.prompt.publish.name_label")}
-          </label>
-          <div className="text-xs text-white/60 mb-2">
-            {t("chat.prompt.publish.name_description")}
-          </div>
-          <input
-            type="text"
-            name="name"
-            required
-            minLength={3}
-            placeholder={t("chat.prompt.publish.name_placeholder")}
-            className="w-full bg-theme-bg-secondary rounded-lg p-2 text-white text-sm focus:outline-primary-button active:outline-primary-button outline-none placeholder:text-theme-text-placeholder"
-          />
-        </div>
-
-        <div>
-          <label className="block text-sm font-semibold text-white mb-1">
-            {t("chat.prompt.publish.description_label")}
-          </label>
-          <div className="text-xs text-white/60 mb-2">
-            {t("chat.prompt.publish.description_description")}
-          </div>
-          <textarea
-            name="description"
-            required
-            minLength={10}
-            placeholder={t("chat.prompt.publish.description_description")}
-            className="w-full bg-theme-bg-secondary rounded-lg p-2 text-white text-sm focus:outline-primary-button active:outline-primary-button outline-none min-h-[80px] placeholder:text-theme-text-placeholder"
-          />
-        </div>
-
-        <div>
-          <label className="block text-sm font-semibold text-white mb-1">
-            {t("chat.prompt.publish.tags_label")}
-          </label>
-          <div className="text-xs text-white/60 mb-2">
-            {t("chat.prompt.publish.tags_description")}
-          </div>
-          <div className="flex flex-wrap gap-2 p-2 bg-theme-bg-secondary rounded-lg min-h-[42px]">
-            {tags.map((tag, index) => (
-              <span
-                key={index}
-                className="flex items-center gap-1 px-2 py-1 text-sm text-white bg-white/10 rounded-md"
-              >
-                {tag}
-                <button
-                  type="button"
-                  onClick={() => removeTag(tag)}
-                  className="text-white/60 hover:text-white"
-                >
-                  <svg
-                    width="14"
-                    height="14"
-                    viewBox="0 0 256 256"
-                    fill="currentColor"
-                  >
-                    <path d="M208.49 191.51a12 12 0 0 1-17 17L128 145l-63.51 63.49a12 12 0 0 1-17-17L111 128L47.51 64.49a12 12 0 0 1 17-17L128 111l63.51-63.52a12 12 0 0 1 17 17L145 128Z" />
-                  </svg>
-                </button>
-              </span>
-            ))}
+    <>
+      <div className="w-full flex gap-x-2 items-center mb-3 -mt-8">
+        <h3 className="text-xl font-semibold text-white px-6 py-3">
+          {t(`chat.prompt.publish.modal_title`)}
+        </h3>
+      </div>
+      <form ref={formRef} className="flex">
+        <div className="w-1/2 p-6 pt-0 space-y-4">
+          <div>
+            <label className="block text-sm font-semibold text-white mb-1">
+              {t("chat.prompt.publish.name_label")}
+            </label>
+            <div className="text-xs text-white/60 mb-2">
+              {t("chat.prompt.publish.name_description")}
+            </div>
             <input
               type="text"
-              value={tagInput}
-              onChange={(e) => setTagInput(e.target.value)}
-              onKeyDown={handleKeyDown}
-              placeholder={t("chat.prompt.publish.tags_placeholder")}
-              className="flex-1 min-w-[200px] border-none bg-transparent text-white placeholder:text-theme-text-placeholder p-0 h-[24px] focus:outline-none"
+              name="name"
+              required
+              minLength={3}
+              placeholder={t("chat.prompt.publish.name_placeholder")}
+              className="w-full bg-theme-bg-secondary rounded-lg p-2 text-white text-sm focus:outline-primary-button active:outline-primary-button outline-none placeholder:text-theme-text-placeholder"
             />
           </div>
-        </div>
 
-        <div>
-          <label className="block text-sm font-semibold text-white mb-1">
-            {t("chat.prompt.publish.visibility_label")}
-          </label>
-          <div className="text-xs text-white/60 mb-2">
-            {visibility === "public"
-              ? t("chat.prompt.publish.public_description")
-              : t("chat.prompt.publish.private_description")}
+          <div>
+            <label className="block text-sm font-semibold text-white mb-1">
+              {t("chat.prompt.publish.description_label")}
+            </label>
+            <div className="text-xs text-white/60 mb-2">
+              {t("chat.prompt.publish.description_description")}
+            </div>
+            <textarea
+              name="description"
+              required
+              minLength={10}
+              placeholder={t("chat.prompt.publish.description_description")}
+              className="w-full bg-theme-bg-secondary rounded-lg p-2 text-white text-sm focus:outline-primary-button active:outline-primary-button outline-none min-h-[80px] placeholder:text-theme-text-placeholder"
+            />
           </div>
-          <div className="w-fit h-[42px] bg-theme-bg-secondary rounded-lg p-0.5">
-            <div className="flex items-center" role="group">
-              <input
-                type="radio"
-                id="public"
-                name="visibility"
-                value="public"
-                className="peer/public hidden"
-                defaultChecked
-                onChange={(e) => setVisibility(e.target.value)}
-              />
+
+          <div>
+            <label className="block text-sm font-semibold text-white mb-1">
+              {t("chat.prompt.publish.tags_label")}
+            </label>
+            <div className="text-xs text-white/60 mb-2">
+              {t("chat.prompt.publish.tags_description")}
+            </div>
+            <div className="flex flex-wrap gap-2 p-2 bg-theme-bg-secondary rounded-lg min-h-[42px]">
+              {tags.map((tag, index) => (
+                <span
+                  key={index}
+                  className="flex items-center gap-1 px-2 py-1 text-sm text-white bg-white/10 rounded-md"
+                >
+                  {tag}
+                  <button
+                    type="button"
+                    onClick={() => removeTag(tag)}
+                    className="text-white/60 hover:text-white"
+                  >
+                    <svg
+                      width="14"
+                      height="14"
+                      viewBox="0 0 256 256"
+                      fill="currentColor"
+                    >
+                      <path d="M208.49 191.51a12 12 0 0 1-17 17L128 145l-63.51 63.49a12 12 0 0 1-17-17L111 128L47.51 64.49a12 12 0 0 1 17-17L128 111l63.51-63.52a12 12 0 0 1 17 17L145 128Z" />
+                    </svg>
+                  </button>
+                </span>
+              ))}
               <input
-                type="radio"
-                id="private"
-                name="visibility"
-                value="private"
-                className="peer/private hidden"
-                onChange={(e) => setVisibility(e.target.value)}
+                type="text"
+                value={tagInput}
+                onChange={(e) => setTagInput(e.target.value)}
+                onKeyDown={handleKeyDown}
+                placeholder={t("chat.prompt.publish.tags_placeholder")}
+                className="flex-1 min-w-[200px] border-none bg-transparent text-white placeholder:text-theme-text-placeholder p-0 h-[24px] focus:outline-none"
               />
-              <label
-                htmlFor="public"
-                className="h-[36px] px-4 rounded-lg text-sm font-medium transition-all duration-200 cursor-pointer text-white/60 hover:text-white peer-checked/public:bg-theme-action-menu-bg peer-checked/public:text-white flex items-center justify-center"
-              >
-                Public
-              </label>
-              <label
-                htmlFor="private"
-                className="h-[36px] px-4 rounded-lg text-sm font-medium transition-all duration-200 cursor-pointer text-white/60 hover:text-white peer-checked/private:bg-theme-action-menu-bg peer-checked/private:text-white flex items-center justify-center"
-              >
-                Private
-              </label>
             </div>
           </div>
-        </div>
-      </div>
 
-      <div className="w-1/2 p-6 pt-0 space-y-4">
-        <div>
-          <label className="block text-sm font-semibold text-white mb-1">
-            {t("chat.prompt.publish.prompt_label")}
-          </label>
-          <div className="text-xs text-white/60 mb-2">
-            {t("chat.prompt.publish.prompt_description")}
+          <div>
+            <label className="block text-sm font-semibold text-white mb-1">
+              {t("chat.prompt.publish.visibility_label")}
+            </label>
+            <div className="text-xs text-white/60 mb-2">
+              {visibility === "public"
+                ? t("chat.prompt.publish.public_description")
+                : t("chat.prompt.publish.private_description")}
+            </div>
+            <div className="w-fit h-[42px] bg-theme-bg-secondary rounded-lg p-0.5">
+              <div className="flex items-center" role="group">
+                <input
+                  type="radio"
+                  id="public"
+                  name="visibility"
+                  value="public"
+                  className="peer/public hidden"
+                  defaultChecked
+                  onChange={(e) => setVisibility(e.target.value)}
+                />
+                <input
+                  type="radio"
+                  id="private"
+                  name="visibility"
+                  value="private"
+                  className="peer/private hidden"
+                  onChange={(e) => setVisibility(e.target.value)}
+                />
+                <label
+                  htmlFor="public"
+                  className="h-[36px] px-4 rounded-lg text-sm font-medium transition-all duration-200 cursor-pointer text-white/60 hover:text-white peer-checked/public:bg-theme-action-menu-bg peer-checked/public:text-white flex items-center justify-center"
+                >
+                  Public
+                </label>
+                <label
+                  htmlFor="private"
+                  className="h-[36px] px-4 rounded-lg text-sm font-medium transition-all duration-200 cursor-pointer text-white/60 hover:text-white peer-checked/private:bg-theme-action-menu-bg peer-checked/private:text-white flex items-center justify-center"
+                >
+                  Private
+                </label>
+              </div>
+            </div>
           </div>
-          <textarea
-            name="prompt"
-            required
-            minLength={10}
-            defaultValue={entity}
-            placeholder={t("chat.prompt.publish.prompt_placeholder")}
-            className="w-full bg-theme-bg-secondary rounded-lg p-2 text-white text-sm focus:outline-primary-button active:outline-primary-button outline-none min-h-[300px] placeholder:text-theme-text-placeholder"
-          />
         </div>
 
-        <button
-          type="button"
-          onClick={handleSubmit}
-          disabled={isSubmitting}
-          className="w-full bg-cta-button hover:bg-opacity-80 text-theme-bg-primary font-medium py-2 px-4 rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
-        >
-          {isSubmitting
-            ? t("chat.prompt.publish.publishing")
-            : t("chat.prompt.publish.publish_button")}
-        </button>
-      </div>
-    </form>
+        <div className="w-1/2 p-6 pt-0 space-y-4">
+          <div>
+            <label className="block text-sm font-semibold text-white mb-1">
+              {t("chat.prompt.publish.prompt_label")}
+            </label>
+            <div className="text-xs text-white/60 mb-2">
+              {t("chat.prompt.publish.prompt_description")}
+            </div>
+            <textarea
+              name="prompt"
+              required
+              minLength={10}
+              defaultValue={entity}
+              placeholder={t("chat.prompt.publish.prompt_placeholder")}
+              className="w-full bg-theme-bg-secondary rounded-lg p-2 text-white text-sm focus:outline-primary-button active:outline-primary-button outline-none min-h-[300px] placeholder:text-theme-text-placeholder"
+            />
+          </div>
+
+          <button
+            type="button"
+            onClick={handleSubmit}
+            disabled={isSubmitting}
+            className="w-full bg-cta-button hover:bg-opacity-80 text-theme-bg-primary font-medium py-2 px-4 rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
+          >
+            {isSubmitting
+              ? t("chat.prompt.publish.publishing")
+              : t("chat.prompt.publish.publish_button")}
+          </button>
+        </div>
+      </form>
+    </>
   );
 }
diff --git a/frontend/src/components/PublishEntityModal/index.jsx b/frontend/src/components/PublishEntityModal/index.jsx
index 0bcf96d7550..c91970ed868 100644
--- a/frontend/src/components/PublishEntityModal/index.jsx
+++ b/frontend/src/components/PublishEntityModal/index.jsx
@@ -1,8 +1,8 @@
 import { X } from "@phosphor-icons/react";
-import { useTranslation } from "react-i18next";
 import SystemPrompts from "./SystemPrompts";
 import UnauthenticatedHubModal from "@/components/UnauthenticatedHubModal";
 import { useCommunityHubAuth } from "@/hooks/useCommunityHubAuth";
+import { useState } from "react";
 
 export default function PublishEntityModal({
   show,
@@ -10,8 +10,9 @@ export default function PublishEntityModal({
   entityType,
   entity,
 }) {
-  const { t } = useTranslation();
   const { isAuthenticated, loading } = useCommunityHubAuth();
+  const [isSuccess, setIsSuccess] = useState(false);
+
   if (!show) return null;
 
   if (loading) return null;
@@ -22,7 +23,7 @@ export default function PublishEntityModal({
   const renderEntityForm = () => {
     switch (entityType) {
       case "system-prompt":
-        return <SystemPrompts entity={entity} />;
+        return <SystemPrompts entity={entity} onSuccessChange={setIsSuccess} />;
       // Other entities
       default:
         return null;
@@ -31,13 +32,10 @@ export default function PublishEntityModal({
 
   return (
     <div className="fixed inset-0 bg-black bg-opacity-80 flex items-center justify-center z-50">
-      <div className="relative w-[900px] max-w-full bg-theme-bg-primary rounded-lg shadow border border-theme-modal-border">
+      <div
+        className={`relative ${isSuccess ? "w-[400px]" : "w-[900px]"} max-w-full bg-theme-bg-primary rounded-lg shadow border border-theme-modal-border`}
+      >
         <div className="relative p-6">
-          <div className="w-full flex gap-x-2 items-center">
-            <h3 className="text-xl font-semibold text-white">
-              {t(`chat.prompt.publish.modal_title`)}
-            </h3>
-          </div>
           <button
             onClick={onClose}
             type="button"

From cfe3e986d419bb396a073ca12a61fcc88cb75498 Mon Sep 17 00:00:00 2001
From: timothycarambat <rambat1010@gmail.com>
Date: Fri, 13 Jun 2025 12:07:28 -0700
Subject: [PATCH 08/20] refactor, auth checks, UI/UX, and naming conventions to
 be more clear

---
 .../PublishEntityModal/AgentFlows/index.jsx   |  4 --
 .../SystemPrompts/index.jsx                   | 60 +++++++---------
 .../components/PublishEntityModal/index.jsx   | 26 +++----
 .../UnauthenticatedHubModal/index.jsx         |  7 +-
 frontend/src/hooks/useCommunityHubAuth.js     |  9 ++-
 frontend/src/locales/en/common.js             |  2 +-
 .../PromptHistoryItem/index.jsx               |  8 +--
 .../ChatPromptHistory/index.jsx               |  4 +-
 .../ChatSettings/ChatPromptSettings/index.jsx | 68 ++++++++++++-------
 server/endpoints/communityHub.js              | 25 +++----
 server/models/communityHub.js                 | 23 ++++---
 11 files changed, 120 insertions(+), 116 deletions(-)
 delete mode 100644 frontend/src/components/PublishEntityModal/AgentFlows/index.jsx

diff --git a/frontend/src/components/PublishEntityModal/AgentFlows/index.jsx b/frontend/src/components/PublishEntityModal/AgentFlows/index.jsx
deleted file mode 100644
index 651c8232c19..00000000000
--- a/frontend/src/components/PublishEntityModal/AgentFlows/index.jsx
+++ /dev/null
@@ -1,4 +0,0 @@
-// TODO: Placeholder for agent flows
-export default function AgentFlows() {
-  return <div>Agent Flows</div>;
-}
diff --git a/frontend/src/components/PublishEntityModal/SystemPrompts/index.jsx b/frontend/src/components/PublishEntityModal/SystemPrompts/index.jsx
index cc64fd8ec95..433c48809df 100644
--- a/frontend/src/components/PublishEntityModal/SystemPrompts/index.jsx
+++ b/frontend/src/components/PublishEntityModal/SystemPrompts/index.jsx
@@ -3,8 +3,9 @@ import { useTranslation } from "react-i18next";
 import CommunityHub from "@/models/communityHub";
 import showToast from "@/utils/toast";
 import paths from "@/utils/paths";
+import { X } from "@phosphor-icons/react/dist/ssr";
 
-export default function SystemPrompts({ entity, onSuccessChange }) {
+export default function SystemPrompts({ entity }) {
   const { t } = useTranslation();
   const formRef = useRef(null);
   const [isSubmitting, setIsSubmitting] = useState(false);
@@ -14,12 +15,9 @@ export default function SystemPrompts({ entity, onSuccessChange }) {
   const [isSuccess, setIsSuccess] = useState(false);
   const [itemId, setItemId] = useState(null);
 
-  useEffect(() => {
-    onSuccessChange(isSuccess);
-  }, [isSuccess, onSuccessChange]);
-
   const handleSubmit = async (e) => {
     e.preventDefault();
+    e.stopPropagation();
     setIsSubmitting(true);
     try {
       const form = new FormData(formRef.current);
@@ -50,8 +48,9 @@ export default function SystemPrompts({ entity, onSuccessChange }) {
     if (e.key === "Enter" || e.key === ",") {
       e.preventDefault();
       const value = tagInput.trim();
+      if (value.length > 20) return;
       if (value && !tags.includes(value)) {
-        setTags([...tags, value]);
+        setTags((prevTags) => [...prevTags, value].slice(0, 5)); // Limit to 5 tags
         setTagInput("");
       }
     }
@@ -64,21 +63,21 @@ export default function SystemPrompts({ entity, onSuccessChange }) {
   if (isSuccess) {
     return (
       <div className="p-6 -mt-12">
-        <div className="flex flex-col items-center justify-center gap-y-4">
-          <h3 className="text-lg font-semibold text-theme-checklist-item-completed-text">
+        <div className="flex flex-col items-center justify-center gap-y-2">
+          <h3 className="text-lg font-semibold text-theme-text-primary">
             {t("chat.prompt.publish.success_title")}
           </h3>
-          <p className="text-lg text-white text-center max-w-[300px]">
+          <p className="text-lg text-theme-text-primary text-center max-w-2xl">
             {t("chat.prompt.publish.success_description")}
           </p>
-          <p className="text-white/60 text-center text-sm">
+          <p className="text-theme-text-secondary text-center text-sm">
             {t("chat.prompt.publish.success_thank_you")}
           </p>
           <a
             href={paths.communityHub.viewItem("system-prompt", itemId)}
             target="_blank"
             rel="noreferrer"
-            className="w-[265px] bg-theme-bg-secondary hover:bg-theme-hover text-white py-2 px-4 rounded-lg transition-colors mt-4 text-sm font-semibold text-center"
+            className="w-[265px] bg-theme-bg-secondary hover:bg-theme-sidebar-item-hover text-theme-text-primary py-2 px-4 rounded-lg transition-colors mt-4 text-sm font-semibold text-center"
           >
             {t("chat.prompt.publish.view_on_hub")}
           </a>
@@ -90,17 +89,17 @@ export default function SystemPrompts({ entity, onSuccessChange }) {
   return (
     <>
       <div className="w-full flex gap-x-2 items-center mb-3 -mt-8">
-        <h3 className="text-xl font-semibold text-white px-6 py-3">
+        <h3 className="text-xl font-semibold text-theme-text-primary px-6 py-3">
           {t(`chat.prompt.publish.modal_title`)}
         </h3>
       </div>
-      <form ref={formRef} className="flex">
+      <form ref={formRef} className="flex" onSubmit={handleSubmit}>
         <div className="w-1/2 p-6 pt-0 space-y-4">
           <div>
-            <label className="block text-sm font-semibold text-white mb-1">
+            <label className="block text-sm font-semibold text-theme-text-primary mb-1">
               {t("chat.prompt.publish.name_label")}
             </label>
-            <div className="text-xs text-white/60 mb-2">
+            <div className="text-xs text-theme-text-secondary mb-2">
               {t("chat.prompt.publish.name_description")}
             </div>
             <input
@@ -108,13 +107,14 @@ export default function SystemPrompts({ entity, onSuccessChange }) {
               name="name"
               required
               minLength={3}
+              maxLength={300}
               placeholder={t("chat.prompt.publish.name_placeholder")}
-              className="w-full bg-theme-bg-secondary rounded-lg p-2 text-white text-sm focus:outline-primary-button active:outline-primary-button outline-none placeholder:text-theme-text-placeholder"
+              className="w-full bg-theme-bg-secondary rounded-lg p-2 text-theme-text-primary text-sm focus:outline-primary-button active:outline-primary-button outline-none placeholder:text-theme-text-placeholder"
             />
           </div>
 
           <div>
-            <label className="block text-sm font-semibold text-white mb-1">
+            <label className="block text-sm font-semibold text-theme-text-primary mb-1">
               {t("chat.prompt.publish.description_label")}
             </label>
             <div className="text-xs text-white/60 mb-2">
@@ -124,11 +124,11 @@ export default function SystemPrompts({ entity, onSuccessChange }) {
               name="description"
               required
               minLength={10}
+              maxLength={1000}
               placeholder={t("chat.prompt.publish.description_description")}
               className="w-full bg-theme-bg-secondary rounded-lg p-2 text-white text-sm focus:outline-primary-button active:outline-primary-button outline-none min-h-[80px] placeholder:text-theme-text-placeholder"
             />
           </div>
-
           <div>
             <label className="block text-sm font-semibold text-white mb-1">
               {t("chat.prompt.publish.tags_label")}
@@ -140,22 +140,15 @@ export default function SystemPrompts({ entity, onSuccessChange }) {
               {tags.map((tag, index) => (
                 <span
                   key={index}
-                  className="flex items-center gap-1 px-2 py-1 text-sm text-white bg-white/10 rounded-md"
+                  className="flex items-center gap-1 px-2 py-1 text-sm text-theme-text-primary bg-white/10 light:bg-black/10 rounded-md"
                 >
                   {tag}
                   <button
                     type="button"
                     onClick={() => removeTag(tag)}
-                    className="text-white/60 hover:text-white"
+                    className="border-none text-theme-text-primary hover:text-theme-text-secondary cursor-pointer"
                   >
-                    <svg
-                      width="14"
-                      height="14"
-                      viewBox="0 0 256 256"
-                      fill="currentColor"
-                    >
-                      <path d="M208.49 191.51a12 12 0 0 1-17 17L128 145l-63.51 63.49a12 12 0 0 1-17-17L111 128L47.51 64.49a12 12 0 0 1 17-17L128 111l63.51-63.52a12 12 0 0 1 17 17L145 128Z" />
-                    </svg>
+                    <X size={14} />
                   </button>
                 </span>
               ))}
@@ -165,7 +158,7 @@ export default function SystemPrompts({ entity, onSuccessChange }) {
                 onChange={(e) => setTagInput(e.target.value)}
                 onKeyDown={handleKeyDown}
                 placeholder={t("chat.prompt.publish.tags_placeholder")}
-                className="flex-1 min-w-[200px] border-none bg-transparent text-white placeholder:text-theme-text-placeholder p-0 h-[24px] focus:outline-none"
+                className="flex-1 min-w-[200px] border-none text-sm bg-transparent text-theme-text-primary placeholder:text-theme-text-placeholder p-0 h-[24px] focus:outline-none"
               />
             </div>
           </div>
@@ -200,13 +193,13 @@ export default function SystemPrompts({ entity, onSuccessChange }) {
                 />
                 <label
                   htmlFor="public"
-                  className="h-[36px] px-4 rounded-lg text-sm font-medium transition-all duration-200 cursor-pointer text-white/60 hover:text-white peer-checked/public:bg-theme-action-menu-bg peer-checked/public:text-white flex items-center justify-center"
+                  className="h-[36px] px-4 rounded-lg text-sm font-medium transition-all duration-200 cursor-pointer text-theme-text-primary hover:text-theme-text-secondary peer-checked/public:bg-theme-sidebar-item-hover peer-checked/public:text-theme-primary-button flex items-center justify-center"
                 >
                   Public
                 </label>
                 <label
                   htmlFor="private"
-                  className="h-[36px] px-4 rounded-lg text-sm font-medium transition-all duration-200 cursor-pointer text-white/60 hover:text-white peer-checked/private:bg-theme-action-menu-bg peer-checked/private:text-white flex items-center justify-center"
+                  className="h-[36px] px-4 rounded-lg text-sm font-medium transition-all duration-200 cursor-pointer text-theme-text-primary hover:text-theme-text-secondary peer-checked/private:bg-theme-sidebar-item-hover peer-checked/private:text-theme-primary-button flex items-center justify-center"
                 >
                   Private
                 </label>
@@ -234,10 +227,9 @@ export default function SystemPrompts({ entity, onSuccessChange }) {
           </div>
 
           <button
-            type="button"
-            onClick={handleSubmit}
+            type="submit"
             disabled={isSubmitting}
-            className="w-full bg-cta-button hover:bg-opacity-80 text-theme-bg-primary font-medium py-2 px-4 rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
+            className="w-full bg-cta-button hover:opacity-80 text-theme-text-primary font-medium py-2 px-4 rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
           >
             {isSubmitting
               ? t("chat.prompt.publish.publishing")
diff --git a/frontend/src/components/PublishEntityModal/index.jsx b/frontend/src/components/PublishEntityModal/index.jsx
index c91970ed868..b3f7af4265a 100644
--- a/frontend/src/components/PublishEntityModal/index.jsx
+++ b/frontend/src/components/PublishEntityModal/index.jsx
@@ -1,8 +1,8 @@
 import { X } from "@phosphor-icons/react";
-import SystemPrompts from "./SystemPrompts";
-import UnauthenticatedHubModal from "@/components/UnauthenticatedHubModal";
 import { useCommunityHubAuth } from "@/hooks/useCommunityHubAuth";
-import { useState } from "react";
+import UnauthenticatedHubModal from "@/components/UnauthenticatedHubModal";
+import SystemPrompts from "./SystemPrompts";
+import ModalWrapper from "../ModalWrapper";
 
 export default function PublishEntityModal({
   show,
@@ -11,30 +11,22 @@ export default function PublishEntityModal({
   entity,
 }) {
   const { isAuthenticated, loading } = useCommunityHubAuth();
-  const [isSuccess, setIsSuccess] = useState(false);
-
-  if (!show) return null;
-
-  if (loading) return null;
-  if (!isAuthenticated) {
+  if (!show || loading) return null;
+  if (!isAuthenticated)
     return <UnauthenticatedHubModal show={show} onClose={onClose} />;
-  }
 
   const renderEntityForm = () => {
     switch (entityType) {
       case "system-prompt":
-        return <SystemPrompts entity={entity} onSuccessChange={setIsSuccess} />;
-      // Other entities
+        return <SystemPrompts entity={entity} />;
       default:
         return null;
     }
   };
 
   return (
-    <div className="fixed inset-0 bg-black bg-opacity-80 flex items-center justify-center z-50">
-      <div
-        className={`relative ${isSuccess ? "w-[400px]" : "w-[900px]"} max-w-full bg-theme-bg-primary rounded-lg shadow border border-theme-modal-border`}
-      >
+    <ModalWrapper isOpen={show}>
+      <div className="relative max-w-[900px] bg-theme-bg-primary rounded-lg shadow border border-theme-modal-border">
         <div className="relative p-6">
           <button
             onClick={onClose}
@@ -46,6 +38,6 @@ export default function PublishEntityModal({
         </div>
         {renderEntityForm()}
       </div>
-    </div>
+    </ModalWrapper>
   );
 }
diff --git a/frontend/src/components/UnauthenticatedHubModal/index.jsx b/frontend/src/components/UnauthenticatedHubModal/index.jsx
index 1e6aef6a2d2..b7eab3fafd0 100644
--- a/frontend/src/components/UnauthenticatedHubModal/index.jsx
+++ b/frontend/src/components/UnauthenticatedHubModal/index.jsx
@@ -2,13 +2,14 @@ import { X } from "@phosphor-icons/react";
 import { useTranslation } from "react-i18next";
 import paths from "@/utils/paths";
 import { Link } from "react-router-dom";
+import ModalWrapper from "../ModalWrapper";
 
 export default function UnauthenticatedHubModal({ show, onClose }) {
   const { t } = useTranslation();
   if (!show) return null;
 
   return (
-    <div className="fixed inset-0 bg-black bg-opacity-80 flex items-center justify-center z-50">
+    <ModalWrapper isOpen={show}>
       <div className="relative w-[400px] max-w-full bg-theme-bg-primary rounded-lg shadow border border-theme-modal-border">
         <div className="p-6">
           <button
@@ -27,13 +28,13 @@ export default function UnauthenticatedHubModal({ show, onClose }) {
             </p>
             <Link
               to={paths.communityHub.authentication()}
-              className="w-[265px] bg-theme-bg-secondary hover:bg-theme-hover text-white py-2 px-4 rounded-lg transition-colors mt-4 text-sm font-semibold text-center"
+              className="w-[265px] bg-theme-bg-secondary hover:bg-theme-sidebar-item-hover text-theme-text-primary py-2 px-4 rounded-lg transition-colors mt-4 text-sm font-semibold text-center"
             >
               {t("chat.prompt.publish.unauthenticated.button")}
             </Link>
           </div>
         </div>
       </div>
-    </div>
+    </ModalWrapper>
   );
 }
diff --git a/frontend/src/hooks/useCommunityHubAuth.js b/frontend/src/hooks/useCommunityHubAuth.js
index d5f74b50afb..848659029e3 100644
--- a/frontend/src/hooks/useCommunityHubAuth.js
+++ b/frontend/src/hooks/useCommunityHubAuth.js
@@ -1,12 +1,17 @@
 import { useState, useEffect } from "react";
 import CommunityHub from "@/models/communityHub";
 
+/**
+ * Hook to check if the user is authenticated with the community hub by checking
+ * the user defined connection key in the settings.
+ * @returns {{isAuthenticated: boolean, loading: boolean}} An object containing the authentication status and loading state.
+ */
 export function useCommunityHubAuth() {
   const [isAuthenticated, setIsAuthenticated] = useState(false);
   const [loading, setLoading] = useState(true);
 
   useEffect(() => {
-    async function checkAuth() {
+    async function checkCommunityHubAuth() {
       setLoading(true);
       try {
         const { connectionKey } = await CommunityHub.getSettings();
@@ -18,7 +23,7 @@ export function useCommunityHubAuth() {
         setLoading(false);
       }
     }
-    checkAuth();
+    checkCommunityHubAuth();
   }, []);
 
   return { isAuthenticated, loading };
diff --git a/frontend/src/locales/en/common.js b/frontend/src/locales/en/common.js
index bd218e5dcd9..a79cb5109fd 100644
--- a/frontend/src/locales/en/common.js
+++ b/frontend/src/locales/en/common.js
@@ -358,7 +358,7 @@ const TRANSLATIONS = {
           "This is the description of your system prompt. Use this to describe the purpose of your system prompt.",
         tags_label: "Tags",
         tags_description:
-          "Tags are used to label your system prompt for easier searching. You can add multiple tags.",
+          "Tags are used to label your system prompt for easier searching. You can add multiple tags. Max 5 tags. Max 20 characters per tag.",
         tags_placeholder: "Type and press Enter to add tags",
         visibility_label: "Visibility",
         prompt_label: "Prompt",
diff --git a/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/ChatPromptHistory/PromptHistoryItem/index.jsx b/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/ChatPromptHistory/PromptHistoryItem/index.jsx
index c55aaed7154..278574a798f 100644
--- a/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/ChatPromptHistory/PromptHistoryItem/index.jsx
+++ b/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/ChatPromptHistory/PromptHistoryItem/index.jsx
@@ -14,7 +14,7 @@ export default function PromptHistoryItem({
   user,
   onRestore,
   setHistory,
-  onPublish,
+  onPublishClick,
 }) {
   const { t } = useTranslation();
   const [showMenu, setShowMenu] = useState(false);
@@ -87,17 +87,17 @@ export default function PromptHistoryItem({
               >
                 <button
                   type="button"
-                  className="px-[10px] py-[6px] text-sm text-white hover:bg-theme-hover cursor-pointer border-none w-full text-left whitespace-nowrap"
+                  className="px-[10px] py-[6px] text-sm text-white hover:bg-theme-sidebar-item-hover rounded-t-lg cursor-pointer border-none w-full text-left whitespace-nowrap"
                   onClick={() => {
                     setShowMenu(false);
-                    onPublish(prompt);
+                    onPublishClick(prompt);
                   }}
                 >
                   {t("chat.prompt.history.publish")}
                 </button>
                 <button
                   type="button"
-                  className="px-[10px] py-[6px] text-sm text-white hover:bg-theme-hover cursor-pointer border-none w-full text-left whitespace-nowrap"
+                  className="px-[10px] py-[6px] text-sm text-white hover:bg-red-500/60 light:hover:bg-red-300/80 rounded-b-lg cursor-pointer border-none w-full text-left whitespace-nowrap"
                   onClick={() => {
                     setShowMenu(false);
                     deleteHistory(id);
diff --git a/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/ChatPromptHistory/index.jsx b/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/ChatPromptHistory/index.jsx
index 531bf4cc74d..b395caf44dd 100644
--- a/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/ChatPromptHistory/index.jsx
+++ b/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/ChatPromptHistory/index.jsx
@@ -7,7 +7,7 @@ import * as Skeleton from "react-loading-skeleton";
 import "react-loading-skeleton/dist/skeleton.css";
 
 export default forwardRef(function ChatPromptHistory(
-  { show, workspaceSlug, onRestore, onClose, onPublish },
+  { show, workspaceSlug, onRestore, onClose, onPublishClick },
   ref
 ) {
   const { t } = useTranslation();
@@ -92,7 +92,7 @@ export default forwardRef(function ChatPromptHistory(
               id={item.id}
               {...item}
               onRestore={() => onRestore(item.prompt)}
-              onPublish={onPublish}
+              onPublishClick={onPublishClick}
               setHistory={setHistory}
             />
           ))
diff --git a/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/index.jsx b/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/index.jsx
index 714f2e19749..1bd90742f4f 100644
--- a/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/index.jsx
+++ b/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/index.jsx
@@ -7,6 +7,7 @@ import { Link, useSearchParams } from "react-router-dom";
 import paths from "@/utils/paths";
 import ChatPromptHistory from "./ChatPromptHistory";
 import PublishEntityModal from "@/components/PublishEntityModal";
+import { useModal } from "@/hooks/useModal";
 
 // TODO: Move to backend and have user-language sensitive default prompt
 const DEFAULT_PROMPT =
@@ -22,15 +23,12 @@ export default function ChatPromptSettings({ workspace, setHasChanges }) {
   const promptHistoryRef = useRef(null);
   const historyButtonRef = useRef(null);
   const [searchParams] = useSearchParams();
-  const [showPublishModal, setShowPublishModal] = useState(false);
-  const [currentPrompt, setCurrentPrompt] = useState(null);
-
-  const handleRestore = (prompt) => {
-    setPrompt(prompt);
-    setShowPromptHistory(false);
-    setHasChanges(true);
-    // TODO: Autosave on restore
-  };
+  const {
+    isOpen: showPublishModal,
+    closeModal: closePublishModal,
+    openModal: openPublishModal,
+  } = useModal();
+  const [currentPrompt, setCurrentPrompt] = useState(chatPrompt(workspace));
 
   useEffect(() => {
     async function setupVariableHighlighting() {
@@ -69,10 +67,16 @@ export default function ChatPromptSettings({ workspace, setHasChanges }) {
     };
   }, []);
 
-  const handlePublish = (prompt) => {
+  const handleRestore = (prompt) => {
+    setPrompt(prompt);
+    setShowPromptHistory(false);
+    setHasChanges(true);
+  };
+
+  const handlePublishClick = (prompt) => {
     setCurrentPrompt(prompt);
-    setShowPublishModal(true);
     setShowPromptHistory(false);
+    openPublishModal();
   };
 
   return (
@@ -82,17 +86,11 @@ export default function ChatPromptSettings({ workspace, setHasChanges }) {
         workspaceSlug={workspace.slug}
         show={showPromptHistory}
         onRestore={handleRestore}
-        onPublish={handlePublish}
+        onPublishClick={handlePublishClick}
         onClose={() => {
           setShowPromptHistory(false);
         }}
       />
-      <PublishEntityModal
-        show={showPublishModal}
-        onClose={() => setShowPublishModal(false)}
-        entityType="system-prompt"
-        entity={currentPrompt}
-      />
       <div>
         <div className="flex flex-col">
           <div className="flex items-center justify-between">
@@ -210,21 +208,41 @@ export default function ChatPromptSettings({ workspace, setHasChanges }) {
                 >
                   Clear
                 </button>
-                <button
-                  type="button"
+                <PublishPromptCTA
+                  hidden={
+                    isEditing ||
+                    prompt === DEFAULT_PROMPT ||
+                    prompt?.trim().length < 10
+                  }
                   onClick={() => {
                     setCurrentPrompt(prompt);
-                    setShowPublishModal(true);
+                    openPublishModal();
                   }}
-                  className="text-primary-button hover:text-white light:hover:text-black text-xs font-medium"
-                >
-                  Publish to Community Hub
-                </button>
+                />
               </>
             )}
           </div>
         </div>
       </div>
+      <PublishEntityModal
+        show={showPublishModal}
+        onClose={closePublishModal}
+        entityType="system-prompt"
+        entity={currentPrompt}
+      />
     </>
   );
 }
+
+function PublishPromptCTA({ hidden = false, onClick }) {
+  if (hidden) return null;
+  return (
+    <button
+      type="button"
+      onClick={onClick}
+      className="border-none text-primary-button hover:text-white light:hover:text-black text-xs font-medium"
+    >
+      Publish to Community Hub
+    </button>
+  );
+}
diff --git a/server/endpoints/communityHub.js b/server/endpoints/communityHub.js
index c6eaac97434..241434a69ab 100644
--- a/server/endpoints/communityHub.js
+++ b/server/endpoints/communityHub.js
@@ -182,36 +182,29 @@ function communityHubEndpoints(app) {
     }
   );
 
-  /**
-   * Uploads a new system prompt to the community hub
-   */
   app.post(
-    "/community-hub/system-prompt/create",
+    "/community-hub/:communityHubItemType/create",
     [validatedRequest, flexUserRoleValid([ROLES.admin])],
     async (request, response) => {
       try {
+        const { communityHubItemType } = request.params;
         const { connectionKey } = await SystemSettings.hubSettings();
-        if (!connectionKey) {
+        if (!connectionKey)
           throw new Error("Community Hub connection key not found");
-        }
 
         const data = reqBody(request);
-        const { success, error, itemId } =
-          await CommunityHub.createSystemPrompt(data, connectionKey);
+        const { success, error, itemId } = await CommunityHub.createStaticItem(
+          communityHubItemType,
+          data,
+          connectionKey
+        );
         if (!success) throw new Error(error);
 
-        await Telemetry.sendTelemetry("community_hub_publish", {
-          itemType: "system-prompt",
-          visibility: data.visibility,
-        });
         await EventLogs.logEvent(
           "community_hub_publish",
-          {
-            itemType: "system-prompt",
-          },
+          { itemType: communityHubItemType },
           response.locals?.user?.id
         );
-
         response
           .status(200)
           .json({ success: true, error: null, item: { id: itemId } });
diff --git a/server/models/communityHub.js b/server/models/communityHub.js
index fc46eb7d6a9..89aa59b6081 100644
--- a/server/models/communityHub.js
+++ b/server/models/communityHub.js
@@ -9,6 +9,7 @@ const CommunityHub = {
     process.env.NODE_ENV === "development"
       ? "http://127.0.0.1:5001/anythingllm-hub/us-central1/external/v1"
       : "https://hub.external.anythingllm.com/v1",
+  supportedStaticItemTypes: ["system-prompt"],
 
   /**
    * Validate an import ID and return the entity type and ID.
@@ -174,16 +175,22 @@ const CommunityHub = {
   },
 
   /**
-   * Create a new system prompt in the community hub
-   * @param {Object} data - The system prompt data
+   * Create a new item in the community hub - Only supports STATIC items for now.
+   * @param {string} itemType - The type of item to create
+   * @param {object} data - The item data
    * @param {string} connectionKey - The hub connection key
    * @returns {Promise<{success: boolean, error: string | null}>}
    */
-  createSystemPrompt: async function (data, connectionKey) {
+  createStaticItem: async function (itemType, data, connectionKey) {
     if (!connectionKey)
       return { success: false, error: "Connection key is required" };
+    if (!this.supportedStaticItemTypes.includes(itemType))
+      return { success: false, error: "Unsupported item type" };
 
-    return await fetch(`${this.apiBase}/system-prompts/create`, {
+    // If the item has specical considerations or preprocessing, we can delegate that below before sending the request.
+    // eg: Agent flow files and such.
+
+    return await fetch(`${this.apiBase}/${itemType}/create`, {
       method: "POST",
       headers: {
         "Content-Type": "application/json",
@@ -191,13 +198,13 @@ const CommunityHub = {
       },
       body: JSON.stringify(data),
     })
-      .then(async (response) => {
-        const result = await response.json();
-        if (!response.ok) throw new Error(result.error || response.statusText);
+      .then((response) => response.json())
+      .then((result) => {
+        if (!!result.error) throw new Error(result.error || "Unknown error");
         return { success: true, error: null, itemId: result.item.id };
       })
       .catch((error) => {
-        console.error("Error creating system prompt:", error);
+        console.error(`Error creating ${itemType}:`, error);
         return { success: false, error: error.message };
       });
   },

From fe28e0f7c0506696677c5dccb52b36a3845b64c4 Mon Sep 17 00:00:00 2001
From: shatfield4 <seanhatfield5@gmail.com>
Date: Fri, 13 Jun 2025 12:48:38 -0700
Subject: [PATCH 09/20] move components to CommunityHub folder + small ui tweak

---
 .../PublishEntityModal/SystemPrompts/index.jsx                | 4 ++--
 .../{ => CommunityHub}/PublishEntityModal/index.jsx           | 4 ++--
 .../{ => CommunityHub}/UnauthenticatedHubModal/index.jsx      | 2 +-
 .../ChatSettings/ChatPromptSettings/index.jsx                 | 2 +-
 4 files changed, 6 insertions(+), 6 deletions(-)
 rename frontend/src/components/{ => CommunityHub}/PublishEntityModal/SystemPrompts/index.jsx (99%)
 rename frontend/src/components/{ => CommunityHub}/PublishEntityModal/index.jsx (90%)
 rename frontend/src/components/{ => CommunityHub}/UnauthenticatedHubModal/index.jsx (96%)

diff --git a/frontend/src/components/PublishEntityModal/SystemPrompts/index.jsx b/frontend/src/components/CommunityHub/PublishEntityModal/SystemPrompts/index.jsx
similarity index 99%
rename from frontend/src/components/PublishEntityModal/SystemPrompts/index.jsx
rename to frontend/src/components/CommunityHub/PublishEntityModal/SystemPrompts/index.jsx
index 433c48809df..a3187922f4c 100644
--- a/frontend/src/components/PublishEntityModal/SystemPrompts/index.jsx
+++ b/frontend/src/components/CommunityHub/PublishEntityModal/SystemPrompts/index.jsx
@@ -1,4 +1,4 @@
-import { useState, useRef, useEffect } from "react";
+import { useState, useRef } from "react";
 import { useTranslation } from "react-i18next";
 import CommunityHub from "@/models/communityHub";
 import showToast from "@/utils/toast";
@@ -62,7 +62,7 @@ export default function SystemPrompts({ entity }) {
 
   if (isSuccess) {
     return (
-      <div className="p-6 -mt-12">
+      <div className="p-6 -mt-12 w-[400px]">
         <div className="flex flex-col items-center justify-center gap-y-2">
           <h3 className="text-lg font-semibold text-theme-text-primary">
             {t("chat.prompt.publish.success_title")}
diff --git a/frontend/src/components/PublishEntityModal/index.jsx b/frontend/src/components/CommunityHub/PublishEntityModal/index.jsx
similarity index 90%
rename from frontend/src/components/PublishEntityModal/index.jsx
rename to frontend/src/components/CommunityHub/PublishEntityModal/index.jsx
index b3f7af4265a..2d606e65f58 100644
--- a/frontend/src/components/PublishEntityModal/index.jsx
+++ b/frontend/src/components/CommunityHub/PublishEntityModal/index.jsx
@@ -1,8 +1,8 @@
 import { X } from "@phosphor-icons/react";
 import { useCommunityHubAuth } from "@/hooks/useCommunityHubAuth";
-import UnauthenticatedHubModal from "@/components/UnauthenticatedHubModal";
+import UnauthenticatedHubModal from "@/components/CommunityHub/UnauthenticatedHubModal";
 import SystemPrompts from "./SystemPrompts";
-import ModalWrapper from "../ModalWrapper";
+import ModalWrapper from "@/components/ModalWrapper";
 
 export default function PublishEntityModal({
   show,
diff --git a/frontend/src/components/UnauthenticatedHubModal/index.jsx b/frontend/src/components/CommunityHub/UnauthenticatedHubModal/index.jsx
similarity index 96%
rename from frontend/src/components/UnauthenticatedHubModal/index.jsx
rename to frontend/src/components/CommunityHub/UnauthenticatedHubModal/index.jsx
index b7eab3fafd0..91665cd2d02 100644
--- a/frontend/src/components/UnauthenticatedHubModal/index.jsx
+++ b/frontend/src/components/CommunityHub/UnauthenticatedHubModal/index.jsx
@@ -2,7 +2,7 @@ import { X } from "@phosphor-icons/react";
 import { useTranslation } from "react-i18next";
 import paths from "@/utils/paths";
 import { Link } from "react-router-dom";
-import ModalWrapper from "../ModalWrapper";
+import ModalWrapper from "@/components/ModalWrapper";
 
 export default function UnauthenticatedHubModal({ show, onClose }) {
   const { t } = useTranslation();
diff --git a/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/index.jsx b/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/index.jsx
index 1bd90742f4f..a27583a58ee 100644
--- a/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/index.jsx
+++ b/frontend/src/pages/WorkspaceSettings/ChatSettings/ChatPromptSettings/index.jsx
@@ -6,7 +6,7 @@ import Highlighter from "react-highlight-words";
 import { Link, useSearchParams } from "react-router-dom";
 import paths from "@/utils/paths";
 import ChatPromptHistory from "./ChatPromptHistory";
-import PublishEntityModal from "@/components/PublishEntityModal";
+import PublishEntityModal from "@/components/CommunityHub/PublishEntityModal";
 import { useModal } from "@/hooks/useModal";
 
 // TODO: Move to backend and have user-language sensitive default prompt

From a55917df476f4e998b25a46ed2dd715e643c9b53 Mon Sep 17 00:00:00 2001
From: shatfield4 <seanhatfield5@gmail.com>
Date: Fri, 13 Jun 2025 18:10:34 -0700
Subject: [PATCH 10/20] wip publish agent flows to community hub

---
 .../PublishEntityModal/AgentFlow/index.jsx    | 287 ++++++++++++++++++
 .../CommunityHub/PublishEntityModal/index.jsx |   3 +
 frontend/src/locales/en/common.js             |  24 ++
 frontend/src/models/communityHub.js           |  13 +
 .../Admin/AgentBuilder/HeaderMenu/index.jsx   |   7 +
 .../src/pages/Admin/AgentBuilder/index.jsx    |  31 ++
 6 files changed, 365 insertions(+)
 create mode 100644 frontend/src/components/CommunityHub/PublishEntityModal/AgentFlow/index.jsx

diff --git a/frontend/src/components/CommunityHub/PublishEntityModal/AgentFlow/index.jsx b/frontend/src/components/CommunityHub/PublishEntityModal/AgentFlow/index.jsx
new file mode 100644
index 00000000000..8a674118ee7
--- /dev/null
+++ b/frontend/src/components/CommunityHub/PublishEntityModal/AgentFlow/index.jsx
@@ -0,0 +1,287 @@
+import { useState, useRef } from "react";
+import { useTranslation } from "react-i18next";
+import CommunityHub from "@/models/communityHub";
+import showToast from "@/utils/toast";
+import paths from "@/utils/paths";
+import { X, CaretRight } from "@phosphor-icons/react/dist/ssr";
+import { BLOCK_INFO } from "@/pages/Admin/AgentBuilder/BlockList";
+
+export default function AgentFlow({ entity }) {
+  const { t } = useTranslation();
+  const formRef = useRef(null);
+  const [isSubmitting, setIsSubmitting] = useState(false);
+  const [tags, setTags] = useState([]);
+  const [tagInput, setTagInput] = useState("");
+  const [visibility, setVisibility] = useState("public");
+  const [isSuccess, setIsSuccess] = useState(false);
+  const [itemId, setItemId] = useState(null);
+  const [expandedStep, setExpandedStep] = useState(null);
+
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    setIsSubmitting(true);
+    try {
+      const form = new FormData(formRef.current);
+      const data = {
+        name: form.get("name"),
+        description: form.get("description"),
+        steps: entity.steps,
+        tags: tags,
+        visibility: visibility,
+      };
+      const { success, error, itemId } =
+        await CommunityHub.createAgentFlow(data);
+      if (!success) throw new Error(error);
+      setItemId(itemId);
+      setIsSuccess(true);
+    } catch (error) {
+      console.error("Failed to publish agent flow:", error);
+      showToast(`Failed to publish agent flow: ${error.message}`, "error", {
+        clear: true,
+      });
+    } finally {
+      setIsSubmitting(false);
+    }
+  };
+
+  const handleKeyDown = (e) => {
+    if (e.key === "Enter" || e.key === ",") {
+      e.preventDefault();
+      const value = tagInput.trim();
+      if (value.length > 20) return;
+      if (value && !tags.includes(value)) {
+        setTags((prevTags) => [...prevTags, value].slice(0, 5)); // Limit to 5 tags
+        setTagInput("");
+      }
+    }
+  };
+
+  const removeTag = (tagToRemove) => {
+    setTags(tags.filter((tag) => tag !== tagToRemove));
+  };
+
+  if (isSuccess) {
+    return (
+      <div className="p-6 -mt-12 w-[400px]">
+        <div className="flex flex-col items-center justify-center gap-y-2">
+          <h3 className="text-lg font-semibold text-theme-text-primary">
+            {t("chat.prompt.publish.agent_flow.success_title")}
+          </h3>
+          <p className="text-lg text-theme-text-primary text-center max-w-2xl">
+            {t("chat.prompt.publish.agent_flow.success_description")}
+          </p>
+          <p className="text-theme-text-secondary text-center text-sm">
+            {t("chat.prompt.publish.agent_flow.success_thank_you")}
+          </p>
+          <a
+            href={paths.communityHub.viewItem("agent-flow", itemId)}
+            target="_blank"
+            rel="noreferrer"
+            className="w-[265px] bg-theme-bg-secondary hover:bg-theme-sidebar-item-hover text-theme-text-primary py-2 px-4 rounded-lg transition-colors mt-4 text-sm font-semibold text-center"
+          >
+            {t("chat.prompt.publish.agent_flow.view_on_hub")}
+          </a>
+        </div>
+      </div>
+    );
+  }
+
+  return (
+    <>
+      <div className="w-full flex gap-x-2 items-center mb-3 -mt-8">
+        <h3 className="text-xl font-semibold text-theme-text-primary px-6 py-3">
+          {t("chat.prompt.publish.agent_flow.modal_title")}
+        </h3>
+      </div>
+      <form ref={formRef} className="flex" onSubmit={handleSubmit}>
+        <div className="w-1/2 p-6 pt-0 space-y-4">
+          <div>
+            <label className="block text-sm font-semibold text-theme-text-primary mb-1">
+              {t("chat.prompt.publish.agent_flow.name_label")}
+            </label>
+            <div className="text-xs text-theme-text-secondary mb-2">
+              {t("chat.prompt.publish.agent_flow.name_description")}
+            </div>
+            <input
+              type="text"
+              name="name"
+              required
+              minLength={3}
+              maxLength={300}
+              defaultValue={entity.name}
+              placeholder={t("chat.prompt.publish.agent_flow.name_placeholder")}
+              className="w-full bg-theme-bg-secondary rounded-lg p-2 text-theme-text-primary text-sm focus:outline-primary-button active:outline-primary-button outline-none placeholder:text-theme-text-placeholder"
+            />
+          </div>
+
+          <div>
+            <label className="block text-sm font-semibold text-theme-text-primary mb-1">
+              {t("chat.prompt.publish.agent_flow.description_label")}
+            </label>
+            <div className="text-xs text-white/60 mb-2">
+              {t("chat.prompt.publish.agent_flow.description_description")}
+            </div>
+            <textarea
+              name="description"
+              required
+              minLength={10}
+              maxLength={1000}
+              defaultValue={entity.description}
+              placeholder={t(
+                "chat.prompt.publish.agent_flow.description_description"
+              )}
+              className="w-full bg-theme-bg-secondary rounded-lg p-2 text-white text-sm focus:outline-primary-button active:outline-primary-button outline-none min-h-[80px] placeholder:text-theme-text-placeholder"
+            />
+          </div>
+          <div>
+            <label className="block text-sm font-semibold text-white mb-1">
+              {t("chat.prompt.publish.agent_flow.tags_label")}
+            </label>
+            <div className="text-xs text-white/60 mb-2">
+              {t("chat.prompt.publish.agent_flow.tags_description")}
+            </div>
+            <div className="flex flex-wrap gap-2 p-2 bg-theme-bg-secondary rounded-lg min-h-[42px]">
+              {tags.map((tag, index) => (
+                <span
+                  key={index}
+                  className="flex items-center gap-1 px-2 py-1 text-sm text-theme-text-primary bg-white/10 light:bg-black/10 rounded-md"
+                >
+                  {tag}
+                  <button
+                    type="button"
+                    onClick={() => removeTag(tag)}
+                    className="border-none text-theme-text-primary hover:text-theme-text-secondary cursor-pointer"
+                  >
+                    <X size={14} />
+                  </button>
+                </span>
+              ))}
+              <input
+                type="text"
+                value={tagInput}
+                onChange={(e) => setTagInput(e.target.value)}
+                onKeyDown={handleKeyDown}
+                placeholder={t(
+                  "chat.prompt.publish.agent_flow.tags_placeholder"
+                )}
+                className="flex-1 min-w-[200px] border-none text-sm bg-transparent text-theme-text-primary placeholder:text-theme-text-placeholder p-0 h-[24px] focus:outline-none"
+              />
+            </div>
+          </div>
+
+          <div>
+            <label className="block text-sm font-semibold text-white mb-1">
+              {t("chat.prompt.publish.agent_flow.visibility_label")}
+            </label>
+            <div className="text-xs text-white/60 mb-2">
+              {visibility === "public"
+                ? t("chat.prompt.publish.agent_flow.public_description")
+                : t("chat.prompt.publish.agent_flow.private_description")}
+            </div>
+            <div className="w-fit h-[42px] bg-theme-bg-secondary rounded-lg p-0.5">
+              <div className="flex items-center" role="group">
+                <input
+                  type="radio"
+                  id="public"
+                  name="visibility"
+                  value="public"
+                  className="peer/public hidden"
+                  defaultChecked
+                  onChange={(e) => setVisibility(e.target.value)}
+                />
+                <input
+                  type="radio"
+                  id="private"
+                  name="visibility"
+                  value="private"
+                  className="peer/private hidden"
+                  onChange={(e) => setVisibility(e.target.value)}
+                />
+                <label
+                  htmlFor="public"
+                  className="h-[36px] px-4 rounded-lg text-sm font-medium transition-all duration-200 cursor-pointer text-theme-text-primary hover:text-theme-text-secondary peer-checked/public:bg-theme-sidebar-item-hover peer-checked/public:text-theme-primary-button flex items-center justify-center"
+                >
+                  Public
+                </label>
+                <label
+                  htmlFor="private"
+                  className="h-[36px] px-4 rounded-lg text-sm font-medium transition-all duration-200 cursor-pointer text-theme-text-primary hover:text-theme-text-secondary peer-checked/private:bg-theme-sidebar-item-hover peer-checked/private:text-theme-primary-button flex items-center justify-center"
+                >
+                  Private
+                </label>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div className="w-1/2 p-6 pt-0 flex flex-col gap-y-4">
+          <div>
+            <label className="block text-sm font-semibold text-theme-text-primary mb-1">
+              Flow Steps
+            </label>
+            <div className="text-xs text-white/60">
+              The steps the agent will follow when the flow is triggered.
+            </div>
+          </div>
+          <div className="flex flex-col gap-y-0.5">
+            {entity.steps && entity.steps.length > 0 ? (
+              entity.steps.map((step, idx) => {
+                const info = BLOCK_INFO[step.type];
+                const isExpanded = expandedStep === idx;
+                const summary = info?.getSummary
+                  ? info.getSummary(step.config)
+                  : "";
+                return (
+                  <div key={idx} className="flex flex-col items-center w-full">
+                    <div
+                      className="flex items-center gap-x-3 bg-theme-bg-secondary rounded-lg px-3 py-2 w-full cursor-pointer group"
+                      onClick={() => setExpandedStep(isExpanded ? null : idx)}
+                    >
+                      <span>{info?.icon}</span>
+                      <span className="text-theme-text-primary text-sm font-medium flex-1">
+                        {info?.label || step.type}
+                      </span>
+                      <span
+                        className={
+                          isExpanded
+                            ? "text-theme-text-secondary text-xs ml-2 whitespace-pre-line break-words"
+                            : "text-theme-text-secondary text-xs ml-2 overflow-hidden text-ellipsis whitespace-nowrap max-w-[220px]"
+                        }
+                        style={{ minWidth: 0 }}
+                      >
+                        {summary}
+                      </span>
+                      <span
+                        className={`ml-2 text-theme-text-secondary transition-transform duration-200 ${isExpanded ? "rotate-90" : ""}`}
+                      >
+                        <CaretRight size={16} />
+                      </span>
+                    </div>
+                    {idx < entity.steps.length - 1 && (
+                      <span className="text-theme-text-secondary text-lg my-1">
+                        ↓
+                      </span>
+                    )}
+                  </div>
+                );
+              })
+            ) : (
+              <div className="text-theme-text-secondary text-xs">
+                No steps defined.
+              </div>
+            )}
+          </div>
+          <button
+            type="submit"
+            disabled={isSubmitting}
+            className="w-full mt-4 bg-primary-button hover:bg-primary-button/80 text-black light:text-white py-2 px-4 rounded-lg transition-colors text-sm font-semibold flex items-center justify-center gap-2"
+          >
+            {isSubmitting
+              ? t("chat.prompt.publish.agent_flow.submitting")
+              : t("chat.prompt.publish.agent_flow.submit")}
+          </button>
+        </div>
+      </form>
+    </>
+  );
+}
diff --git a/frontend/src/components/CommunityHub/PublishEntityModal/index.jsx b/frontend/src/components/CommunityHub/PublishEntityModal/index.jsx
index 2d606e65f58..6f1afe80eed 100644
--- a/frontend/src/components/CommunityHub/PublishEntityModal/index.jsx
+++ b/frontend/src/components/CommunityHub/PublishEntityModal/index.jsx
@@ -2,6 +2,7 @@ import { X } from "@phosphor-icons/react";
 import { useCommunityHubAuth } from "@/hooks/useCommunityHubAuth";
 import UnauthenticatedHubModal from "@/components/CommunityHub/UnauthenticatedHubModal";
 import SystemPrompts from "./SystemPrompts";
+import AgentFlow from "./AgentFlow";
 import ModalWrapper from "@/components/ModalWrapper";
 
 export default function PublishEntityModal({
@@ -19,6 +20,8 @@ export default function PublishEntityModal({
     switch (entityType) {
       case "system-prompt":
         return <SystemPrompts entity={entity} />;
+      case "agent-flow":
+        return <AgentFlow entity={entity} />;
       default:
         return null;
     }
diff --git a/frontend/src/locales/en/common.js b/frontend/src/locales/en/common.js
index a79cb5109fd..41f75e83837 100644
--- a/frontend/src/locales/en/common.js
+++ b/frontend/src/locales/en/common.js
@@ -373,6 +373,30 @@ const TRANSLATIONS = {
             "You need to authenticate with the AnythingLLM Community Hub before publishing prompts.",
           button: "Connect to Community Hub",
         },
+        agent_flow: {
+          public_description: "Public agent flows are visible to everyone.",
+          private_description: "Private agent flows are only visible to you.",
+          success_title: "Success!",
+          success_description:
+            "Your Agent Flow has been published to the Community Hub!",
+          success_thank_you: "Thank you for sharing to the Community!",
+          view_on_hub: "View on Community Hub",
+          modal_title: "Publish Agent Flow",
+          name_label: "Name",
+          name_description: "This is the display name of your agent flow.",
+          name_placeholder: "My Agent Flow",
+          description_label: "Description",
+          description_description:
+            "This is the description of your agent flow. Use this to describe the purpose of your agent flow.",
+          tags_label: "Tags",
+          tags_description:
+            "Tags are used to label your agent flow for easier searching. You can add multiple tags. Max 5 tags. Max 20 characters per tag.",
+          tags_placeholder: "Type and press Enter to add tags",
+          visibility_label: "Visibility",
+          publish_button: "Publish to Community Hub",
+          submitting: "Publishing...",
+          submit: "Publish to Community Hub",
+        },
       },
     },
     refusal: {
diff --git a/frontend/src/models/communityHub.js b/frontend/src/models/communityHub.js
index d3e5f0fb871..d8357dbed52 100644
--- a/frontend/src/models/communityHub.js
+++ b/frontend/src/models/communityHub.js
@@ -181,6 +181,19 @@ const CommunityHub = {
         error: e.message,
       }));
   },
+
+  createAgentFlow: async (data) => {
+    return await fetch(`${API_BASE}/community-hub/agent-flow/create`, {
+      method: "POST",
+      headers: baseHeaders(),
+      body: JSON.stringify(data),
+    }).then(async (res) => {
+      const response = await res.json();
+      if (!res.ok)
+        throw new Error(response.error || "Failed to create agent flow");
+      return { success: true, error: null, itemId: response.item?.id };
+    });
+  },
 };
 
 export default CommunityHub;
diff --git a/frontend/src/pages/Admin/AgentBuilder/HeaderMenu/index.jsx b/frontend/src/pages/Admin/AgentBuilder/HeaderMenu/index.jsx
index b16884de88e..0f745d4d1af 100644
--- a/frontend/src/pages/Admin/AgentBuilder/HeaderMenu/index.jsx
+++ b/frontend/src/pages/Admin/AgentBuilder/HeaderMenu/index.jsx
@@ -10,6 +10,7 @@ export default function HeaderMenu({
   availableFlows = [],
   onNewFlow,
   onSaveFlow,
+  onPublishFlow,
 }) {
   const { flowId = null } = useParams();
   const [showDropdown, setShowDropdown] = useState(false);
@@ -121,6 +122,12 @@ export default function HeaderMenu({
               <Plus className="w-4 h-4" />
               New Flow
             </button>
+            <button
+              onClick={onPublishFlow}
+              className="flex items-center gap-x-2 text-theme-text-primary text-sm font-medium px-3 py-2 rounded-lg border border-primary-button bg-theme-settings-input-bg hover:bg-primary-button/80 transition-colors duration-300"
+            >
+              Publish Flow
+            </button>
             <button
               onClick={onSaveFlow}
               className="border-none bg-primary-button hover:opacity-80 text-black light:text-white px-3 py-2 rounded-lg text-sm font-medium transition-all duration-300 flex items-center justify-center gap-2"
diff --git a/frontend/src/pages/Admin/AgentBuilder/index.jsx b/frontend/src/pages/Admin/AgentBuilder/index.jsx
index 72b4d5c88b8..71dface104f 100644
--- a/frontend/src/pages/Admin/AgentBuilder/index.jsx
+++ b/frontend/src/pages/Admin/AgentBuilder/index.jsx
@@ -9,6 +9,7 @@ import AgentFlows from "@/models/agentFlows";
 import { useTheme } from "@/hooks/useTheme";
 import HeaderMenu from "./HeaderMenu";
 import paths from "@/utils/paths";
+import PublishEntityModal from "@/components/CommunityHub/PublishEntityModal";
 
 const DEFAULT_BLOCKS = [
   {
@@ -52,6 +53,7 @@ export default function AgentBuilder() {
   const [selectedFlowForDetails, setSelectedFlowForDetails] = useState(null);
   const nameRef = useRef(null);
   const descriptionRef = useRef(null);
+  const [showPublishModal, setShowPublishModal] = useState(false);
 
   useEffect(() => {
     loadAvailableFlows();
@@ -307,6 +309,27 @@ export default function AgentBuilder() {
     setBlocks(newBlocks);
   };
 
+  // Handler for publish modal
+  const handlePublishFlow = () => {
+    setShowPublishModal(true);
+  };
+
+  // Compose the entity object for publishing (flow config)
+  const flowInfoBlock = blocks.find(
+    (block) => block.type === BLOCK_TYPES.FLOW_INFO
+  );
+  const flowEntity = {
+    name: flowInfoBlock?.config?.name || "",
+    description: flowInfoBlock?.config?.description || "",
+    steps: blocks
+      .filter(
+        (block) =>
+          block.type !== BLOCK_TYPES.FINISH &&
+          block.type !== BLOCK_TYPES.FLOW_INFO
+      )
+      .map((block) => ({ type: block.type, config: block.config })),
+  };
+
   return (
     <div
       style={{
@@ -319,12 +342,20 @@ export default function AgentBuilder() {
       }}
       className="w-full h-screen flex bg-theme-bg-primary"
     >
+      {/* Publish Modal */}
+      <PublishEntityModal
+        show={showPublishModal}
+        onClose={() => setShowPublishModal(false)}
+        entityType="agent-flow"
+        entity={flowEntity}
+      />
       <div className="w-full flex flex-col">
         <HeaderMenu
           agentName={agentName}
           availableFlows={availableFlows}
           onNewFlow={clearFlow}
           onSaveFlow={saveFlow}
+          onPublishFlow={handlePublishFlow}
         />
         <div className="flex-1 p-6 overflow-y-auto">
           <div className="max-w-xl mx-auto mt-14">

From 09160c6df13d040709090a9ac1476baa07b72993 Mon Sep 17 00:00:00 2001
From: shatfield4 <seanhatfield5@gmail.com>
Date: Mon, 16 Jun 2025 15:56:09 -0700
Subject: [PATCH 11/20] rework translations/implement uploading agent flows

---
 .../PublishEntityModal/AgentFlow/index.jsx    | 129 ++++++++----------
 .../SystemPrompts/index.jsx                   |  52 ++++---
 .../UnauthenticatedHubModal/index.jsx         |   6 +-
 frontend/src/locales/en/common.js             | 123 +++++++++--------
 .../Admin/AgentBuilder/HeaderMenu/index.jsx   |   4 +-
 server/models/communityHub.js                 |   2 +-
 6 files changed, 156 insertions(+), 160 deletions(-)

diff --git a/frontend/src/components/CommunityHub/PublishEntityModal/AgentFlow/index.jsx b/frontend/src/components/CommunityHub/PublishEntityModal/AgentFlow/index.jsx
index 8a674118ee7..c2e8a039879 100644
--- a/frontend/src/components/CommunityHub/PublishEntityModal/AgentFlow/index.jsx
+++ b/frontend/src/components/CommunityHub/PublishEntityModal/AgentFlow/index.jsx
@@ -26,9 +26,15 @@ export default function AgentFlow({ entity }) {
       const data = {
         name: form.get("name"),
         description: form.get("description"),
-        steps: entity.steps,
         tags: tags,
         visibility: visibility,
+        flow: JSON.stringify({
+          name: form.get("name"),
+          description: form.get("description"),
+          steps: entity.steps,
+          tags: tags,
+          visibility: visibility,
+        }),
       };
       const { success, error, itemId } =
         await CommunityHub.createAgentFlow(data);
@@ -66,13 +72,13 @@ export default function AgentFlow({ entity }) {
       <div className="p-6 -mt-12 w-[400px]">
         <div className="flex flex-col items-center justify-center gap-y-2">
           <h3 className="text-lg font-semibold text-theme-text-primary">
-            {t("chat.prompt.publish.agent_flow.success_title")}
+            {t("community_hub.publish.agent_flow.success_title")}
           </h3>
           <p className="text-lg text-theme-text-primary text-center max-w-2xl">
-            {t("chat.prompt.publish.agent_flow.success_description")}
+            {t("community_hub.publish.agent_flow.success_description")}
           </p>
           <p className="text-theme-text-secondary text-center text-sm">
-            {t("chat.prompt.publish.agent_flow.success_thank_you")}
+            {t("community_hub.publish.agent_flow.success_thank_you")}
           </p>
           <a
             href={paths.communityHub.viewItem("agent-flow", itemId)}
@@ -80,7 +86,7 @@ export default function AgentFlow({ entity }) {
             rel="noreferrer"
             className="w-[265px] bg-theme-bg-secondary hover:bg-theme-sidebar-item-hover text-theme-text-primary py-2 px-4 rounded-lg transition-colors mt-4 text-sm font-semibold text-center"
           >
-            {t("chat.prompt.publish.agent_flow.view_on_hub")}
+            {t("community_hub.publish.agent_flow.view_on_hub")}
           </a>
         </div>
       </div>
@@ -91,17 +97,17 @@ export default function AgentFlow({ entity }) {
     <>
       <div className="w-full flex gap-x-2 items-center mb-3 -mt-8">
         <h3 className="text-xl font-semibold text-theme-text-primary px-6 py-3">
-          {t("chat.prompt.publish.agent_flow.modal_title")}
+          {t("community_hub.publish.agent_flow.modal_title")}
         </h3>
       </div>
       <form ref={formRef} className="flex" onSubmit={handleSubmit}>
         <div className="w-1/2 p-6 pt-0 space-y-4">
           <div>
             <label className="block text-sm font-semibold text-theme-text-primary mb-1">
-              {t("chat.prompt.publish.agent_flow.name_label")}
+              {t("community_hub.publish.agent_flow.name_label")}
             </label>
             <div className="text-xs text-theme-text-secondary mb-2">
-              {t("chat.prompt.publish.agent_flow.name_description")}
+              {t("community_hub.publish.agent_flow.name_description")}
             </div>
             <input
               type="text"
@@ -110,17 +116,19 @@ export default function AgentFlow({ entity }) {
               minLength={3}
               maxLength={300}
               defaultValue={entity.name}
-              placeholder={t("chat.prompt.publish.agent_flow.name_placeholder")}
+              placeholder={t(
+                "community_hub.publish.agent_flow.name_placeholder"
+              )}
               className="w-full bg-theme-bg-secondary rounded-lg p-2 text-theme-text-primary text-sm focus:outline-primary-button active:outline-primary-button outline-none placeholder:text-theme-text-placeholder"
             />
           </div>
 
           <div>
             <label className="block text-sm font-semibold text-theme-text-primary mb-1">
-              {t("chat.prompt.publish.agent_flow.description_label")}
+              {t("community_hub.publish.agent_flow.description_label")}
             </label>
             <div className="text-xs text-white/60 mb-2">
-              {t("chat.prompt.publish.agent_flow.description_description")}
+              {t("community_hub.publish.agent_flow.description_description")}
             </div>
             <textarea
               name="description"
@@ -129,17 +137,17 @@ export default function AgentFlow({ entity }) {
               maxLength={1000}
               defaultValue={entity.description}
               placeholder={t(
-                "chat.prompt.publish.agent_flow.description_description"
+                "community_hub.publish.agent_flow.description_description"
               )}
               className="w-full bg-theme-bg-secondary rounded-lg p-2 text-white text-sm focus:outline-primary-button active:outline-primary-button outline-none min-h-[80px] placeholder:text-theme-text-placeholder"
             />
           </div>
           <div>
             <label className="block text-sm font-semibold text-white mb-1">
-              {t("chat.prompt.publish.agent_flow.tags_label")}
+              {t("community_hub.publish.agent_flow.tags_label")}
             </label>
             <div className="text-xs text-white/60 mb-2">
-              {t("chat.prompt.publish.agent_flow.tags_description")}
+              {t("community_hub.publish.agent_flow.tags_description")}
             </div>
             <div className="flex flex-wrap gap-2 p-2 bg-theme-bg-secondary rounded-lg min-h-[42px]">
               {tags.map((tag, index) => (
@@ -163,54 +171,23 @@ export default function AgentFlow({ entity }) {
                 onChange={(e) => setTagInput(e.target.value)}
                 onKeyDown={handleKeyDown}
                 placeholder={t(
-                  "chat.prompt.publish.agent_flow.tags_placeholder"
+                  "community_hub.publish.agent_flow.tags_placeholder"
                 )}
                 className="flex-1 min-w-[200px] border-none text-sm bg-transparent text-theme-text-primary placeholder:text-theme-text-placeholder p-0 h-[24px] focus:outline-none"
               />
             </div>
           </div>
-
           <div>
             <label className="block text-sm font-semibold text-white mb-1">
-              {t("chat.prompt.publish.agent_flow.visibility_label")}
+              {t("community_hub.publish.agent_flow.visibility_label")}
             </label>
             <div className="text-xs text-white/60 mb-2">
-              {visibility === "public"
-                ? t("chat.prompt.publish.agent_flow.public_description")
-                : t("chat.prompt.publish.agent_flow.private_description")}
+              {t("community_hub.publish.agent_flow.private_description")}
             </div>
-            <div className="w-fit h-[42px] bg-theme-bg-secondary rounded-lg p-0.5">
-              <div className="flex items-center" role="group">
-                <input
-                  type="radio"
-                  id="public"
-                  name="visibility"
-                  value="public"
-                  className="peer/public hidden"
-                  defaultChecked
-                  onChange={(e) => setVisibility(e.target.value)}
-                />
-                <input
-                  type="radio"
-                  id="private"
-                  name="visibility"
-                  value="private"
-                  className="peer/private hidden"
-                  onChange={(e) => setVisibility(e.target.value)}
-                />
-                <label
-                  htmlFor="public"
-                  className="h-[36px] px-4 rounded-lg text-sm font-medium transition-all duration-200 cursor-pointer text-theme-text-primary hover:text-theme-text-secondary peer-checked/public:bg-theme-sidebar-item-hover peer-checked/public:text-theme-primary-button flex items-center justify-center"
-                >
-                  Public
-                </label>
-                <label
-                  htmlFor="private"
-                  className="h-[36px] px-4 rounded-lg text-sm font-medium transition-all duration-200 cursor-pointer text-theme-text-primary hover:text-theme-text-secondary peer-checked/private:bg-theme-sidebar-item-hover peer-checked/private:text-theme-primary-button flex items-center justify-center"
-                >
-                  Private
-                </label>
-              </div>
+            <div className="bg-theme-bg-secondary rounded-lg p-2 mt-2">
+              <span className="text-xs text-theme-text-secondary">
+                {t("community_hub.publish.agent_flow.privacy_note")}
+              </span>
             </div>
           </div>
         </div>
@@ -234,28 +211,30 @@ export default function AgentFlow({ entity }) {
                 return (
                   <div key={idx} className="flex flex-col items-center w-full">
                     <div
-                      className="flex items-center gap-x-3 bg-theme-bg-secondary rounded-lg px-3 py-2 w-full cursor-pointer group"
+                      className="flex flex-col bg-theme-bg-secondary rounded-lg px-3 py-2 w-full cursor-pointer group"
                       onClick={() => setExpandedStep(isExpanded ? null : idx)}
                     >
-                      <span>{info?.icon}</span>
-                      <span className="text-theme-text-primary text-sm font-medium flex-1">
-                        {info?.label || step.type}
-                      </span>
-                      <span
-                        className={
-                          isExpanded
-                            ? "text-theme-text-secondary text-xs ml-2 whitespace-pre-line break-words"
-                            : "text-theme-text-secondary text-xs ml-2 overflow-hidden text-ellipsis whitespace-nowrap max-w-[220px]"
-                        }
-                        style={{ minWidth: 0 }}
-                      >
-                        {summary}
-                      </span>
-                      <span
-                        className={`ml-2 text-theme-text-secondary transition-transform duration-200 ${isExpanded ? "rotate-90" : ""}`}
-                      >
-                        <CaretRight size={16} />
-                      </span>
+                      <div className="flex items-center gap-x-3 w-full">
+                        <span>{info?.icon}</span>
+                        <span className="text-theme-text-primary text-sm font-medium flex-1">
+                          {info?.label || step.type}
+                        </span>
+                        {!isExpanded && (
+                          <span className="text-theme-text-secondary text-xs ml-2 overflow-hidden text-ellipsis whitespace-nowrap max-w-[120px] min-w-0">
+                            {summary}
+                          </span>
+                        )}
+                        <span
+                          className={`ml-2 text-theme-text-secondary transition-transform duration-200 ${isExpanded ? "rotate-90" : ""}`}
+                        >
+                          <CaretRight size={16} />
+                        </span>
+                      </div>
+                      {isExpanded && summary && (
+                        <div className="w-full text-theme-text-secondary text-xs mt-1 whitespace-pre-line break-words">
+                          {summary}
+                        </div>
+                      )}
                     </div>
                     {idx < entity.steps.length - 1 && (
                       <span className="text-theme-text-secondary text-lg my-1">
@@ -274,11 +253,11 @@ export default function AgentFlow({ entity }) {
           <button
             type="submit"
             disabled={isSubmitting}
-            className="w-full mt-4 bg-primary-button hover:bg-primary-button/80 text-black light:text-white py-2 px-4 rounded-lg transition-colors text-sm font-semibold flex items-center justify-center gap-2"
+            className="mt-4 w-full bg-cta-button hover:opacity-80 text-theme-text-primary font-medium py-2 px-4 rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
           >
             {isSubmitting
-              ? t("chat.prompt.publish.agent_flow.submitting")
-              : t("chat.prompt.publish.agent_flow.submit")}
+              ? t("community_hub.publish.agent_flow.submitting")
+              : t("community_hub.publish.agent_flow.submit")}
           </button>
         </div>
       </form>
diff --git a/frontend/src/components/CommunityHub/PublishEntityModal/SystemPrompts/index.jsx b/frontend/src/components/CommunityHub/PublishEntityModal/SystemPrompts/index.jsx
index a3187922f4c..6cc7e8cec84 100644
--- a/frontend/src/components/CommunityHub/PublishEntityModal/SystemPrompts/index.jsx
+++ b/frontend/src/components/CommunityHub/PublishEntityModal/SystemPrompts/index.jsx
@@ -65,13 +65,13 @@ export default function SystemPrompts({ entity }) {
       <div className="p-6 -mt-12 w-[400px]">
         <div className="flex flex-col items-center justify-center gap-y-2">
           <h3 className="text-lg font-semibold text-theme-text-primary">
-            {t("chat.prompt.publish.success_title")}
+            {t("community_hub.publish.system_prompt.success_title")}
           </h3>
           <p className="text-lg text-theme-text-primary text-center max-w-2xl">
-            {t("chat.prompt.publish.success_description")}
+            {t("community_hub.publish.system_prompt.success_description")}
           </p>
           <p className="text-theme-text-secondary text-center text-sm">
-            {t("chat.prompt.publish.success_thank_you")}
+            {t("community_hub.publish.system_prompt.success_thank_you")}
           </p>
           <a
             href={paths.communityHub.viewItem("system-prompt", itemId)}
@@ -79,7 +79,7 @@ export default function SystemPrompts({ entity }) {
             rel="noreferrer"
             className="w-[265px] bg-theme-bg-secondary hover:bg-theme-sidebar-item-hover text-theme-text-primary py-2 px-4 rounded-lg transition-colors mt-4 text-sm font-semibold text-center"
           >
-            {t("chat.prompt.publish.view_on_hub")}
+            {t("community_hub.publish.system_prompt.view_on_hub")}
           </a>
         </div>
       </div>
@@ -90,17 +90,17 @@ export default function SystemPrompts({ entity }) {
     <>
       <div className="w-full flex gap-x-2 items-center mb-3 -mt-8">
         <h3 className="text-xl font-semibold text-theme-text-primary px-6 py-3">
-          {t(`chat.prompt.publish.modal_title`)}
+          {t(`community_hub.publish.system_prompt.modal_title`)}
         </h3>
       </div>
       <form ref={formRef} className="flex" onSubmit={handleSubmit}>
         <div className="w-1/2 p-6 pt-0 space-y-4">
           <div>
             <label className="block text-sm font-semibold text-theme-text-primary mb-1">
-              {t("chat.prompt.publish.name_label")}
+              {t("community_hub.publish.system_prompt.name_label")}
             </label>
             <div className="text-xs text-theme-text-secondary mb-2">
-              {t("chat.prompt.publish.name_description")}
+              {t("community_hub.publish.system_prompt.name_description")}
             </div>
             <input
               type="text"
@@ -108,33 +108,37 @@ export default function SystemPrompts({ entity }) {
               required
               minLength={3}
               maxLength={300}
-              placeholder={t("chat.prompt.publish.name_placeholder")}
+              placeholder={t(
+                "community_hub.publish.system_prompt.name_placeholder"
+              )}
               className="w-full bg-theme-bg-secondary rounded-lg p-2 text-theme-text-primary text-sm focus:outline-primary-button active:outline-primary-button outline-none placeholder:text-theme-text-placeholder"
             />
           </div>
 
           <div>
             <label className="block text-sm font-semibold text-theme-text-primary mb-1">
-              {t("chat.prompt.publish.description_label")}
+              {t("community_hub.publish.system_prompt.description_label")}
             </label>
             <div className="text-xs text-white/60 mb-2">
-              {t("chat.prompt.publish.description_description")}
+              {t("community_hub.publish.system_prompt.description_description")}
             </div>
             <textarea
               name="description"
               required
               minLength={10}
               maxLength={1000}
-              placeholder={t("chat.prompt.publish.description_description")}
+              placeholder={t(
+                "community_hub.publish.system_prompt.description_description"
+              )}
               className="w-full bg-theme-bg-secondary rounded-lg p-2 text-white text-sm focus:outline-primary-button active:outline-primary-button outline-none min-h-[80px] placeholder:text-theme-text-placeholder"
             />
           </div>
           <div>
             <label className="block text-sm font-semibold text-white mb-1">
-              {t("chat.prompt.publish.tags_label")}
+              {t("community_hub.publish.system_prompt.tags_label")}
             </label>
             <div className="text-xs text-white/60 mb-2">
-              {t("chat.prompt.publish.tags_description")}
+              {t("community_hub.publish.system_prompt.tags_description")}
             </div>
             <div className="flex flex-wrap gap-2 p-2 bg-theme-bg-secondary rounded-lg min-h-[42px]">
               {tags.map((tag, index) => (
@@ -157,7 +161,9 @@ export default function SystemPrompts({ entity }) {
                 value={tagInput}
                 onChange={(e) => setTagInput(e.target.value)}
                 onKeyDown={handleKeyDown}
-                placeholder={t("chat.prompt.publish.tags_placeholder")}
+                placeholder={t(
+                  "community_hub.publish.system_prompt.tags_placeholder"
+                )}
                 className="flex-1 min-w-[200px] border-none text-sm bg-transparent text-theme-text-primary placeholder:text-theme-text-placeholder p-0 h-[24px] focus:outline-none"
               />
             </div>
@@ -165,12 +171,12 @@ export default function SystemPrompts({ entity }) {
 
           <div>
             <label className="block text-sm font-semibold text-white mb-1">
-              {t("chat.prompt.publish.visibility_label")}
+              {t("community_hub.publish.system_prompt.visibility_label")}
             </label>
             <div className="text-xs text-white/60 mb-2">
               {visibility === "public"
-                ? t("chat.prompt.publish.public_description")
-                : t("chat.prompt.publish.private_description")}
+                ? t("community_hub.publish.system_prompt.public_description")
+                : t("community_hub.publish.system_prompt.private_description")}
             </div>
             <div className="w-fit h-[42px] bg-theme-bg-secondary rounded-lg p-0.5">
               <div className="flex items-center" role="group">
@@ -211,17 +217,19 @@ export default function SystemPrompts({ entity }) {
         <div className="w-1/2 p-6 pt-0 space-y-4">
           <div>
             <label className="block text-sm font-semibold text-white mb-1">
-              {t("chat.prompt.publish.prompt_label")}
+              {t("community_hub.publish.system_prompt.prompt_label")}
             </label>
             <div className="text-xs text-white/60 mb-2">
-              {t("chat.prompt.publish.prompt_description")}
+              {t("community_hub.publish.system_prompt.prompt_description")}
             </div>
             <textarea
               name="prompt"
               required
               minLength={10}
               defaultValue={entity}
-              placeholder={t("chat.prompt.publish.prompt_placeholder")}
+              placeholder={t(
+                "community_hub.publish.system_prompt.prompt_placeholder"
+              )}
               className="w-full bg-theme-bg-secondary rounded-lg p-2 text-white text-sm focus:outline-primary-button active:outline-primary-button outline-none min-h-[300px] placeholder:text-theme-text-placeholder"
             />
           </div>
@@ -232,8 +240,8 @@ export default function SystemPrompts({ entity }) {
             className="w-full bg-cta-button hover:opacity-80 text-theme-text-primary font-medium py-2 px-4 rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
           >
             {isSubmitting
-              ? t("chat.prompt.publish.publishing")
-              : t("chat.prompt.publish.publish_button")}
+              ? t("community_hub.publish.system_prompt.submitting")
+              : t("community_hub.publish.system_prompt.publish_button")}
           </button>
         </div>
       </form>
diff --git a/frontend/src/components/CommunityHub/UnauthenticatedHubModal/index.jsx b/frontend/src/components/CommunityHub/UnauthenticatedHubModal/index.jsx
index 91665cd2d02..21860ed4ab3 100644
--- a/frontend/src/components/CommunityHub/UnauthenticatedHubModal/index.jsx
+++ b/frontend/src/components/CommunityHub/UnauthenticatedHubModal/index.jsx
@@ -21,16 +21,16 @@ export default function UnauthenticatedHubModal({ show, onClose }) {
           </button>
           <div className="flex flex-col items-center justify-center gap-y-4">
             <h3 className="text-lg font-semibold text-white">
-              {t("chat.prompt.publish.unauthenticated.title")}
+              {t("community_hub.publish.generic.unauthenticated.title")}
             </h3>
             <p className="text-lg text-white text-center max-w-[300px]">
-              {t("chat.prompt.publish.unauthenticated.description")}
+              {t("community_hub.publish.generic.unauthenticated.description")}
             </p>
             <Link
               to={paths.communityHub.authentication()}
               className="w-[265px] bg-theme-bg-secondary hover:bg-theme-sidebar-item-hover text-theme-text-primary py-2 px-4 rounded-lg transition-colors mt-4 text-sm font-semibold text-center"
             >
-              {t("chat.prompt.publish.unauthenticated.button")}
+              {t("community_hub.publish.generic.unauthenticated.button")}
             </Link>
           </div>
         </div>
diff --git a/frontend/src/locales/en/common.js b/frontend/src/locales/en/common.js
index 41f75e83837..11375eb7d88 100644
--- a/frontend/src/locales/en/common.js
+++ b/frontend/src/locales/en/common.js
@@ -341,63 +341,6 @@ const TRANSLATIONS = {
           "Are you sure you want to clear all history? This action cannot be undone.",
         expand: "Expand",
       },
-      publish: {
-        public_description: "Public system prompts are visible to everyone.",
-        private_description: "Private system prompts are only visible to you.",
-        success_title: "Success!",
-        success_description:
-          "Your System Prompt has been published to the Community Hub!",
-        success_thank_you: "Thank you for sharing to the Community!",
-        view_on_hub: "View on Community Hub",
-        modal_title: "Publish System Prompt",
-        name_label: "Name",
-        name_description: "This is the display name of your system prompt.",
-        name_placeholder: "My System Prompt",
-        description_label: "Description",
-        description_description:
-          "This is the description of your system prompt. Use this to describe the purpose of your system prompt.",
-        tags_label: "Tags",
-        tags_description:
-          "Tags are used to label your system prompt for easier searching. You can add multiple tags. Max 5 tags. Max 20 characters per tag.",
-        tags_placeholder: "Type and press Enter to add tags",
-        visibility_label: "Visibility",
-        prompt_label: "Prompt",
-        prompt_description:
-          "This is the actual slash command that will be used to guide the LLM.",
-        prompt_placeholder: "Enter your system prompt here...",
-        publish_button: "Publish to Community Hub",
-        publishing: "Publishing...",
-        unauthenticated: {
-          title: "Authentication Required",
-          description:
-            "You need to authenticate with the AnythingLLM Community Hub before publishing prompts.",
-          button: "Connect to Community Hub",
-        },
-        agent_flow: {
-          public_description: "Public agent flows are visible to everyone.",
-          private_description: "Private agent flows are only visible to you.",
-          success_title: "Success!",
-          success_description:
-            "Your Agent Flow has been published to the Community Hub!",
-          success_thank_you: "Thank you for sharing to the Community!",
-          view_on_hub: "View on Community Hub",
-          modal_title: "Publish Agent Flow",
-          name_label: "Name",
-          name_description: "This is the display name of your agent flow.",
-          name_placeholder: "My Agent Flow",
-          description_label: "Description",
-          description_description:
-            "This is the description of your agent flow. Use this to describe the purpose of your agent flow.",
-          tags_label: "Tags",
-          tags_description:
-            "Tags are used to label your agent flow for easier searching. You can add multiple tags. Max 5 tags. Max 20 characters per tag.",
-          tags_placeholder: "Type and press Enter to add tags",
-          visibility_label: "Visibility",
-          publish_button: "Publish to Community Hub",
-          submitting: "Publishing...",
-          submit: "Publish to Community Hub",
-        },
-      },
     },
     refusal: {
       title: "Query mode refusal response",
@@ -1085,6 +1028,72 @@ const TRANSLATIONS = {
       showLLMSelector: "Show workspace LLM Selector",
     },
   },
+  community_hub: {
+    publish: {
+      system_prompt: {
+        success_title: "Success!",
+        success_description:
+          "Your System Prompt has been published to the Community Hub!",
+        success_thank_you: "Thank you for sharing to the Community!",
+        view_on_hub: "View on Community Hub",
+        modal_title: "Publish System Prompt",
+        name_label: "Name",
+        name_description: "This is the display name of your system prompt.",
+        name_placeholder: "My System Prompt",
+        description_label: "Description",
+        description_description:
+          "This is the description of your system prompt. Use this to describe the purpose of your system prompt.",
+        tags_label: "Tags",
+        tags_description:
+          "Tags are used to label your system prompt for easier searching. You can add multiple tags. Max 5 tags. Max 20 characters per tag.",
+        tags_placeholder: "Type and press Enter to add tags",
+        visibility_label: "Visibility",
+        public_description: "Public system prompts are visible to everyone.",
+        private_description: "Private system prompts are only visible to you.",
+        publish_button: "Publish to Community Hub",
+        submitting: "Publishing...",
+        submit: "Publish to Community Hub",
+        prompt_label: "Prompt",
+        prompt_description:
+          "This is the actual system prompt that will be used to guide the LLM.",
+        prompt_placeholder: "Enter your system prompt here...",
+      },
+      agent_flow: {
+        public_description: "Public agent flows are visible to everyone.",
+        private_description: "Private agent flows are only visible to you.",
+        success_title: "Success!",
+        success_description:
+          "Your Agent Flow has been published to the Community Hub!",
+        success_thank_you: "Thank you for sharing to the Community!",
+        view_on_hub: "View on Community Hub",
+        modal_title: "Publish Agent Flow",
+        name_label: "Name",
+        name_description: "This is the display name of your agent flow.",
+        name_placeholder: "My Agent Flow",
+        description_label: "Description",
+        description_description:
+          "This is the description of your agent flow. Use this to describe the purpose of your agent flow.",
+        tags_label: "Tags",
+        tags_description:
+          "Tags are used to label your agent flow for easier searching. You can add multiple tags. Max 5 tags. Max 20 characters per tag.",
+        tags_placeholder: "Type and press Enter to add tags",
+        visibility_label: "Visibility",
+        publish_button: "Publish to Community Hub",
+        submitting: "Publishing...",
+        submit: "Publish to Community Hub",
+        privacy_note:
+          "Agent flows are always uploaded as private to protect any sensitive data. You can change the visibility in the Community Hub after publishing. Please verify your flow does not contain any sensitive or private information before publishing.",
+      },
+      generic: {
+        unauthenticated: {
+          title: "Authentication Required",
+          description:
+            "You need to authenticate with the AnythingLLM Community Hub before publishing items.",
+          button: "Connect to Community Hub",
+        },
+      },
+    },
+  },
 };
 
 export default TRANSLATIONS;
diff --git a/frontend/src/pages/Admin/AgentBuilder/HeaderMenu/index.jsx b/frontend/src/pages/Admin/AgentBuilder/HeaderMenu/index.jsx
index 0f745d4d1af..908a7ae88b3 100644
--- a/frontend/src/pages/Admin/AgentBuilder/HeaderMenu/index.jsx
+++ b/frontend/src/pages/Admin/AgentBuilder/HeaderMenu/index.jsx
@@ -124,9 +124,9 @@ export default function HeaderMenu({
             </button>
             <button
               onClick={onPublishFlow}
-              className="flex items-center gap-x-2 text-theme-text-primary text-sm font-medium px-3 py-2 rounded-lg border border-primary-button bg-theme-settings-input-bg hover:bg-primary-button/80 transition-colors duration-300"
+              className="px-3 py-2 rounded-lg text-sm font-medium flex items-center justify-center gap-2 border bg-white text-black hover:bg-gray-100 transition-all duration-300 dark:bg-white dark:text-black dark:hover:bg-gray-200 light:bg-white light:text-black light:border light:hover:bg-gray-100"
             >
-              Publish Flow
+              Publish
             </button>
             <button
               onClick={onSaveFlow}
diff --git a/server/models/communityHub.js b/server/models/communityHub.js
index 89aa59b6081..d3b97d411a8 100644
--- a/server/models/communityHub.js
+++ b/server/models/communityHub.js
@@ -9,7 +9,7 @@ const CommunityHub = {
     process.env.NODE_ENV === "development"
       ? "http://127.0.0.1:5001/anythingllm-hub/us-central1/external/v1"
       : "https://hub.external.anythingllm.com/v1",
-  supportedStaticItemTypes: ["system-prompt"],
+  supportedStaticItemTypes: ["system-prompt", "agent-flow"],
 
   /**
    * Validate an import ID and return the entity type and ID.

From 6b5b6ac668643c3dde2d133179401ffc5b666b3c Mon Sep 17 00:00:00 2001
From: shatfield4 <seanhatfield5@gmail.com>
Date: Mon, 16 Jun 2025 16:00:44 -0700
Subject: [PATCH 12/20] normalize/restructure translations

---
 frontend/src/locales/ar/common.js    | 85 +++++++++++++++++++---------
 frontend/src/locales/da/common.js    | 85 +++++++++++++++++++---------
 frontend/src/locales/de/common.js    | 85 +++++++++++++++++++---------
 frontend/src/locales/es/common.js    | 85 +++++++++++++++++++---------
 frontend/src/locales/fa/common.js    | 85 +++++++++++++++++++---------
 frontend/src/locales/fr/common.js    | 85 +++++++++++++++++++---------
 frontend/src/locales/he/common.js    | 85 +++++++++++++++++++---------
 frontend/src/locales/it/common.js    | 85 +++++++++++++++++++---------
 frontend/src/locales/ja/common.js    | 85 +++++++++++++++++++---------
 frontend/src/locales/ko/common.js    | 85 +++++++++++++++++++---------
 frontend/src/locales/lv/common.js    | 85 +++++++++++++++++++---------
 frontend/src/locales/nl/common.js    | 85 +++++++++++++++++++---------
 frontend/src/locales/pt_BR/common.js | 85 +++++++++++++++++++---------
 frontend/src/locales/ru/common.js    | 85 +++++++++++++++++++---------
 frontend/src/locales/tr/common.js    | 85 +++++++++++++++++++---------
 frontend/src/locales/vn/common.js    | 85 +++++++++++++++++++---------
 frontend/src/locales/zh/common.js    | 85 +++++++++++++++++++---------
 frontend/src/locales/zh_TW/common.js | 85 +++++++++++++++++++---------
 18 files changed, 1026 insertions(+), 504 deletions(-)

diff --git a/frontend/src/locales/ar/common.js b/frontend/src/locales/ar/common.js
index 917448158d9..f8d0ba3e173 100644
--- a/frontend/src/locales/ar/common.js
+++ b/frontend/src/locales/ar/common.js
@@ -242,34 +242,6 @@ const TRANSLATIONS = {
         expand: null,
         publish: null,
       },
-      publish: {
-        public_description: null,
-        private_description: null,
-        success_title: null,
-        success_description: null,
-        success_thank_you: null,
-        view_on_hub: null,
-        modal_title: null,
-        name_label: null,
-        name_description: null,
-        name_placeholder: null,
-        description_label: null,
-        description_description: null,
-        tags_label: null,
-        tags_description: null,
-        tags_placeholder: null,
-        visibility_label: null,
-        prompt_label: null,
-        prompt_description: null,
-        prompt_placeholder: null,
-        publish_button: null,
-        publishing: null,
-        unauthenticated: {
-          title: null,
-          description: null,
-          button: null,
-        },
-      },
     },
     refusal: {
       title: "الرد على رفض وضعية الاستعلام",
@@ -955,6 +927,63 @@ const TRANSLATIONS = {
       showLLMSelector: null,
     },
   },
+  community_hub: {
+    publish: {
+      system_prompt: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
+      agent_flow: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        privacy_note: null,
+      },
+      generic: {
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
+      },
+    },
+  },
 };
 
 export default TRANSLATIONS;
diff --git a/frontend/src/locales/da/common.js b/frontend/src/locales/da/common.js
index 550df85e27c..8d2bbb90811 100644
--- a/frontend/src/locales/da/common.js
+++ b/frontend/src/locales/da/common.js
@@ -243,34 +243,6 @@ const TRANSLATIONS = {
         expand: null,
         publish: null,
       },
-      publish: {
-        public_description: null,
-        private_description: null,
-        success_title: null,
-        success_description: null,
-        success_thank_you: null,
-        view_on_hub: null,
-        modal_title: null,
-        name_label: null,
-        name_description: null,
-        name_placeholder: null,
-        description_label: null,
-        description_description: null,
-        tags_label: null,
-        tags_description: null,
-        tags_placeholder: null,
-        visibility_label: null,
-        prompt_label: null,
-        prompt_description: null,
-        prompt_placeholder: null,
-        publish_button: null,
-        publishing: null,
-        unauthenticated: {
-          title: null,
-          description: null,
-          button: null,
-        },
-      },
     },
     refusal: {
       title: "Afvisningssvar for forespørgsels-tilstand",
@@ -994,6 +966,63 @@ const TRANSLATIONS = {
       showLLMSelector: null,
     },
   },
+  community_hub: {
+    publish: {
+      system_prompt: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
+      agent_flow: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        privacy_note: null,
+      },
+      generic: {
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
+      },
+    },
+  },
 };
 
 export default TRANSLATIONS;
diff --git a/frontend/src/locales/de/common.js b/frontend/src/locales/de/common.js
index 1aef04f87ad..0c368b76377 100644
--- a/frontend/src/locales/de/common.js
+++ b/frontend/src/locales/de/common.js
@@ -235,34 +235,6 @@ const TRANSLATIONS = {
         expand: null,
         publish: null,
       },
-      publish: {
-        public_description: null,
-        private_description: null,
-        success_title: null,
-        success_description: null,
-        success_thank_you: null,
-        view_on_hub: null,
-        modal_title: null,
-        name_label: null,
-        name_description: null,
-        name_placeholder: null,
-        description_label: null,
-        description_description: null,
-        tags_label: null,
-        tags_description: null,
-        tags_placeholder: null,
-        visibility_label: null,
-        prompt_label: null,
-        prompt_description: null,
-        prompt_placeholder: null,
-        publish_button: null,
-        publishing: null,
-        unauthenticated: {
-          title: null,
-          description: null,
-          button: null,
-        },
-      },
     },
     refusal: {
       title: "Abfragemodus-Ablehnungsantwort",
@@ -999,6 +971,63 @@ const TRANSLATIONS = {
       showLLMSelector: null,
     },
   },
+  community_hub: {
+    publish: {
+      system_prompt: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
+      agent_flow: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        privacy_note: null,
+      },
+      generic: {
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
+      },
+    },
+  },
 };
 
 export default TRANSLATIONS;
diff --git a/frontend/src/locales/es/common.js b/frontend/src/locales/es/common.js
index d808681444b..3275fb6a040 100644
--- a/frontend/src/locales/es/common.js
+++ b/frontend/src/locales/es/common.js
@@ -237,34 +237,6 @@ const TRANSLATIONS = {
         expand: null,
         publish: null,
       },
-      publish: {
-        public_description: null,
-        private_description: null,
-        success_title: null,
-        success_description: null,
-        success_thank_you: null,
-        view_on_hub: null,
-        modal_title: null,
-        name_label: null,
-        name_description: null,
-        name_placeholder: null,
-        description_label: null,
-        description_description: null,
-        tags_label: null,
-        tags_description: null,
-        tags_placeholder: null,
-        visibility_label: null,
-        prompt_label: null,
-        prompt_description: null,
-        prompt_placeholder: null,
-        publish_button: null,
-        publishing: null,
-        unauthenticated: {
-          title: null,
-          description: null,
-          button: null,
-        },
-      },
     },
     refusal: {
       title: "Respuesta de rechazo en modo consulta",
@@ -959,6 +931,63 @@ const TRANSLATIONS = {
       showLLMSelector: null,
     },
   },
+  community_hub: {
+    publish: {
+      system_prompt: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
+      agent_flow: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        privacy_note: null,
+      },
+      generic: {
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
+      },
+    },
+  },
 };
 
 export default TRANSLATIONS;
diff --git a/frontend/src/locales/fa/common.js b/frontend/src/locales/fa/common.js
index 4582841f9a3..d2c1e734794 100644
--- a/frontend/src/locales/fa/common.js
+++ b/frontend/src/locales/fa/common.js
@@ -233,34 +233,6 @@ const TRANSLATIONS = {
         expand: null,
         publish: null,
       },
-      publish: {
-        public_description: null,
-        private_description: null,
-        success_title: null,
-        success_description: null,
-        success_thank_you: null,
-        view_on_hub: null,
-        modal_title: null,
-        name_label: null,
-        name_description: null,
-        name_placeholder: null,
-        description_label: null,
-        description_description: null,
-        tags_label: null,
-        tags_description: null,
-        tags_placeholder: null,
-        visibility_label: null,
-        prompt_label: null,
-        prompt_description: null,
-        prompt_placeholder: null,
-        publish_button: null,
-        publishing: null,
-        unauthenticated: {
-          title: null,
-          description: null,
-          button: null,
-        },
-      },
     },
     refusal: {
       title: "پاسخ رد در حالت پرس‌وجو",
@@ -947,6 +919,63 @@ const TRANSLATIONS = {
       showLLMSelector: null,
     },
   },
+  community_hub: {
+    publish: {
+      system_prompt: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
+      agent_flow: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        privacy_note: null,
+      },
+      generic: {
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
+      },
+    },
+  },
 };
 
 export default TRANSLATIONS;
diff --git a/frontend/src/locales/fr/common.js b/frontend/src/locales/fr/common.js
index e3f3aeabcbb..ecf5a114994 100644
--- a/frontend/src/locales/fr/common.js
+++ b/frontend/src/locales/fr/common.js
@@ -238,34 +238,6 @@ const TRANSLATIONS = {
         expand: null,
         publish: null,
       },
-      publish: {
-        public_description: null,
-        private_description: null,
-        success_title: null,
-        success_description: null,
-        success_thank_you: null,
-        view_on_hub: null,
-        modal_title: null,
-        name_label: null,
-        name_description: null,
-        name_placeholder: null,
-        description_label: null,
-        description_description: null,
-        tags_label: null,
-        tags_description: null,
-        tags_placeholder: null,
-        visibility_label: null,
-        prompt_label: null,
-        prompt_description: null,
-        prompt_placeholder: null,
-        publish_button: null,
-        publishing: null,
-        unauthenticated: {
-          title: null,
-          description: null,
-          button: null,
-        },
-      },
     },
     refusal: {
       title: "Réponse de refus en mode requête",
@@ -955,6 +927,63 @@ const TRANSLATIONS = {
       showLLMSelector: null,
     },
   },
+  community_hub: {
+    publish: {
+      system_prompt: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
+      agent_flow: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        privacy_note: null,
+      },
+      generic: {
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
+      },
+    },
+  },
 };
 
 export default TRANSLATIONS;
diff --git a/frontend/src/locales/he/common.js b/frontend/src/locales/he/common.js
index a0e98218a69..3bb1bd0f618 100644
--- a/frontend/src/locales/he/common.js
+++ b/frontend/src/locales/he/common.js
@@ -231,34 +231,6 @@ const TRANSLATIONS = {
         expand: null,
         publish: null,
       },
-      publish: {
-        public_description: null,
-        private_description: null,
-        success_title: null,
-        success_description: null,
-        success_thank_you: null,
-        view_on_hub: null,
-        modal_title: null,
-        name_label: null,
-        name_description: null,
-        name_placeholder: null,
-        description_label: null,
-        description_description: null,
-        tags_label: null,
-        tags_description: null,
-        tags_placeholder: null,
-        visibility_label: null,
-        prompt_label: null,
-        prompt_description: null,
-        prompt_placeholder: null,
-        publish_button: null,
-        publishing: null,
-        unauthenticated: {
-          title: null,
-          description: null,
-          button: null,
-        },
-      },
     },
     refusal: {
       title: "תגובת סירוב במצב שאילתה",
@@ -940,6 +912,63 @@ const TRANSLATIONS = {
       showLLMSelector: null,
     },
   },
+  community_hub: {
+    publish: {
+      system_prompt: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
+      agent_flow: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        privacy_note: null,
+      },
+      generic: {
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
+      },
+    },
+  },
 };
 
 export default TRANSLATIONS;
diff --git a/frontend/src/locales/it/common.js b/frontend/src/locales/it/common.js
index 7d46fbe9052..d6c42ac2b49 100644
--- a/frontend/src/locales/it/common.js
+++ b/frontend/src/locales/it/common.js
@@ -236,34 +236,6 @@ const TRANSLATIONS = {
         expand: null,
         publish: null,
       },
-      publish: {
-        public_description: null,
-        private_description: null,
-        success_title: null,
-        success_description: null,
-        success_thank_you: null,
-        view_on_hub: null,
-        modal_title: null,
-        name_label: null,
-        name_description: null,
-        name_placeholder: null,
-        description_label: null,
-        description_description: null,
-        tags_label: null,
-        tags_description: null,
-        tags_placeholder: null,
-        visibility_label: null,
-        prompt_label: null,
-        prompt_description: null,
-        prompt_placeholder: null,
-        publish_button: null,
-        publishing: null,
-        unauthenticated: {
-          title: null,
-          description: null,
-          button: null,
-        },
-      },
     },
     refusal: {
       title: "Risposta al rifiuto nella modalità di query",
@@ -953,6 +925,63 @@ const TRANSLATIONS = {
       showLLMSelector: null,
     },
   },
+  community_hub: {
+    publish: {
+      system_prompt: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
+      agent_flow: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        privacy_note: null,
+      },
+      generic: {
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
+      },
+    },
+  },
 };
 
 export default TRANSLATIONS;
diff --git a/frontend/src/locales/ja/common.js b/frontend/src/locales/ja/common.js
index 9bc9d17c087..6d394ddaa2d 100644
--- a/frontend/src/locales/ja/common.js
+++ b/frontend/src/locales/ja/common.js
@@ -242,34 +242,6 @@ const TRANSLATIONS = {
         expand: null,
         publish: null,
       },
-      publish: {
-        public_description: null,
-        private_description: null,
-        success_title: null,
-        success_description: null,
-        success_thank_you: null,
-        view_on_hub: null,
-        modal_title: null,
-        name_label: null,
-        name_description: null,
-        name_placeholder: null,
-        description_label: null,
-        description_description: null,
-        tags_label: null,
-        tags_description: null,
-        tags_placeholder: null,
-        visibility_label: null,
-        prompt_label: null,
-        prompt_description: null,
-        prompt_placeholder: null,
-        publish_button: null,
-        publishing: null,
-        unauthenticated: {
-          title: null,
-          description: null,
-          button: null,
-        },
-      },
     },
     refusal: {
       title: "クエリモード拒否応答",
@@ -989,6 +961,63 @@ const TRANSLATIONS = {
       showLLMSelector: null,
     },
   },
+  community_hub: {
+    publish: {
+      system_prompt: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
+      agent_flow: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        privacy_note: null,
+      },
+      generic: {
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
+      },
+    },
+  },
 };
 
 export default TRANSLATIONS;
diff --git a/frontend/src/locales/ko/common.js b/frontend/src/locales/ko/common.js
index f4732f61858..cda39ef2f05 100644
--- a/frontend/src/locales/ko/common.js
+++ b/frontend/src/locales/ko/common.js
@@ -231,34 +231,6 @@ const TRANSLATIONS = {
         expand: null,
         publish: null,
       },
-      publish: {
-        public_description: null,
-        private_description: null,
-        success_title: null,
-        success_description: null,
-        success_thank_you: null,
-        view_on_hub: null,
-        modal_title: null,
-        name_label: null,
-        name_description: null,
-        name_placeholder: null,
-        description_label: null,
-        description_description: null,
-        tags_label: null,
-        tags_description: null,
-        tags_placeholder: null,
-        visibility_label: null,
-        prompt_label: null,
-        prompt_description: null,
-        prompt_placeholder: null,
-        publish_button: null,
-        publishing: null,
-        unauthenticated: {
-          title: null,
-          description: null,
-          button: null,
-        },
-      },
     },
     refusal: {
       title: "쿼리 모드 거부 응답 메시지",
@@ -940,6 +912,63 @@ const TRANSLATIONS = {
       showLLMSelector: null,
     },
   },
+  community_hub: {
+    publish: {
+      system_prompt: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
+      agent_flow: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        privacy_note: null,
+      },
+      generic: {
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
+      },
+    },
+  },
 };
 
 export default TRANSLATIONS;
diff --git a/frontend/src/locales/lv/common.js b/frontend/src/locales/lv/common.js
index 6736a356d13..e1abcb707f3 100644
--- a/frontend/src/locales/lv/common.js
+++ b/frontend/src/locales/lv/common.js
@@ -327,34 +327,6 @@ const TRANSLATIONS = {
         expand: "Paplašināt",
         publish: null,
       },
-      publish: {
-        public_description: null,
-        private_description: null,
-        success_title: null,
-        success_description: null,
-        success_thank_you: null,
-        view_on_hub: null,
-        modal_title: null,
-        name_label: null,
-        name_description: null,
-        name_placeholder: null,
-        description_label: null,
-        description_description: null,
-        tags_label: null,
-        tags_description: null,
-        tags_placeholder: null,
-        visibility_label: null,
-        prompt_label: null,
-        prompt_description: null,
-        prompt_placeholder: null,
-        publish_button: null,
-        publishing: null,
-        unauthenticated: {
-          title: null,
-          description: null,
-          button: null,
-        },
-      },
     },
     refusal: {
       title: "Vaicājuma režīma atteikuma atbilde",
@@ -1011,6 +983,63 @@ const TRANSLATIONS = {
       showLLMSelector: null,
     },
   },
+  community_hub: {
+    publish: {
+      system_prompt: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
+      agent_flow: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        privacy_note: null,
+      },
+      generic: {
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
+      },
+    },
+  },
 };
 
 export default TRANSLATIONS;
diff --git a/frontend/src/locales/nl/common.js b/frontend/src/locales/nl/common.js
index 447c7623698..4427d091985 100644
--- a/frontend/src/locales/nl/common.js
+++ b/frontend/src/locales/nl/common.js
@@ -235,34 +235,6 @@ const TRANSLATIONS = {
         expand: null,
         publish: null,
       },
-      publish: {
-        public_description: null,
-        private_description: null,
-        success_title: null,
-        success_description: null,
-        success_thank_you: null,
-        view_on_hub: null,
-        modal_title: null,
-        name_label: null,
-        name_description: null,
-        name_placeholder: null,
-        description_label: null,
-        description_description: null,
-        tags_label: null,
-        tags_description: null,
-        tags_placeholder: null,
-        visibility_label: null,
-        prompt_label: null,
-        prompt_description: null,
-        prompt_placeholder: null,
-        publish_button: null,
-        publishing: null,
-        unauthenticated: {
-          title: null,
-          description: null,
-          button: null,
-        },
-      },
     },
     refusal: {
       title: "Afwijzingsreactie in Querymodus",
@@ -950,6 +922,63 @@ const TRANSLATIONS = {
       showLLMSelector: null,
     },
   },
+  community_hub: {
+    publish: {
+      system_prompt: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
+      agent_flow: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        privacy_note: null,
+      },
+      generic: {
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
+      },
+    },
+  },
 };
 
 export default TRANSLATIONS;
diff --git a/frontend/src/locales/pt_BR/common.js b/frontend/src/locales/pt_BR/common.js
index 97734d4a1c6..ef0f8c021a6 100644
--- a/frontend/src/locales/pt_BR/common.js
+++ b/frontend/src/locales/pt_BR/common.js
@@ -324,34 +324,6 @@ const TRANSLATIONS = {
         expand: "Expandir",
         publish: null,
       },
-      publish: {
-        public_description: null,
-        private_description: null,
-        success_title: null,
-        success_description: null,
-        success_thank_you: null,
-        view_on_hub: null,
-        modal_title: null,
-        name_label: null,
-        name_description: null,
-        name_placeholder: null,
-        description_label: null,
-        description_description: null,
-        tags_label: null,
-        tags_description: null,
-        tags_placeholder: null,
-        visibility_label: null,
-        prompt_label: null,
-        prompt_description: null,
-        prompt_placeholder: null,
-        publish_button: null,
-        publishing: null,
-        unauthenticated: {
-          title: null,
-          description: null,
-          button: null,
-        },
-      },
     },
     refusal: {
       title: "Modo Resposta de recusa",
@@ -992,6 +964,63 @@ const TRANSLATIONS = {
       showLLMSelector: null,
     },
   },
+  community_hub: {
+    publish: {
+      system_prompt: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
+      agent_flow: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        privacy_note: null,
+      },
+      generic: {
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
+      },
+    },
+  },
 };
 
 export default TRANSLATIONS;
diff --git a/frontend/src/locales/ru/common.js b/frontend/src/locales/ru/common.js
index 2711d07ed8a..cf0ab8c1417 100644
--- a/frontend/src/locales/ru/common.js
+++ b/frontend/src/locales/ru/common.js
@@ -244,34 +244,6 @@ const TRANSLATIONS = {
         expand: null,
         publish: null,
       },
-      publish: {
-        public_description: null,
-        private_description: null,
-        success_title: null,
-        success_description: null,
-        success_thank_you: null,
-        view_on_hub: null,
-        modal_title: null,
-        name_label: null,
-        name_description: null,
-        name_placeholder: null,
-        description_label: null,
-        description_description: null,
-        tags_label: null,
-        tags_description: null,
-        tags_placeholder: null,
-        visibility_label: null,
-        prompt_label: null,
-        prompt_description: null,
-        prompt_placeholder: null,
-        publish_button: null,
-        publishing: null,
-        unauthenticated: {
-          title: null,
-          description: null,
-          button: null,
-        },
-      },
     },
     refusal: {
       title: "Ответ об отказе в режиме запроса",
@@ -995,6 +967,63 @@ const TRANSLATIONS = {
       showLLMSelector: null,
     },
   },
+  community_hub: {
+    publish: {
+      system_prompt: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
+      agent_flow: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        privacy_note: null,
+      },
+      generic: {
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
+      },
+    },
+  },
 };
 
 export default TRANSLATIONS;
diff --git a/frontend/src/locales/tr/common.js b/frontend/src/locales/tr/common.js
index 0b41670a5fe..329b151ff03 100644
--- a/frontend/src/locales/tr/common.js
+++ b/frontend/src/locales/tr/common.js
@@ -235,34 +235,6 @@ const TRANSLATIONS = {
         expand: null,
         publish: null,
       },
-      publish: {
-        public_description: null,
-        private_description: null,
-        success_title: null,
-        success_description: null,
-        success_thank_you: null,
-        view_on_hub: null,
-        modal_title: null,
-        name_label: null,
-        name_description: null,
-        name_placeholder: null,
-        description_label: null,
-        description_description: null,
-        tags_label: null,
-        tags_description: null,
-        tags_placeholder: null,
-        visibility_label: null,
-        prompt_label: null,
-        prompt_description: null,
-        prompt_placeholder: null,
-        publish_button: null,
-        publishing: null,
-        unauthenticated: {
-          title: null,
-          description: null,
-          button: null,
-        },
-      },
     },
     refusal: {
       title: "Sorgu Modu Ret Yanıtı",
@@ -950,6 +922,63 @@ const TRANSLATIONS = {
       showLLMSelector: null,
     },
   },
+  community_hub: {
+    publish: {
+      system_prompt: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
+      agent_flow: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        privacy_note: null,
+      },
+      generic: {
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
+      },
+    },
+  },
 };
 
 export default TRANSLATIONS;
diff --git a/frontend/src/locales/vn/common.js b/frontend/src/locales/vn/common.js
index 7b61a057717..02d6848ddc4 100644
--- a/frontend/src/locales/vn/common.js
+++ b/frontend/src/locales/vn/common.js
@@ -234,34 +234,6 @@ const TRANSLATIONS = {
         expand: null,
         publish: null,
       },
-      publish: {
-        public_description: null,
-        private_description: null,
-        success_title: null,
-        success_description: null,
-        success_thank_you: null,
-        view_on_hub: null,
-        modal_title: null,
-        name_label: null,
-        name_description: null,
-        name_placeholder: null,
-        description_label: null,
-        description_description: null,
-        tags_label: null,
-        tags_description: null,
-        tags_placeholder: null,
-        visibility_label: null,
-        prompt_label: null,
-        prompt_description: null,
-        prompt_placeholder: null,
-        publish_button: null,
-        publishing: null,
-        unauthenticated: {
-          title: null,
-          description: null,
-          button: null,
-        },
-      },
     },
     refusal: {
       title: "Query mode refusal response",
@@ -949,6 +921,63 @@ const TRANSLATIONS = {
       showLLMSelector: null,
     },
   },
+  community_hub: {
+    publish: {
+      system_prompt: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
+      agent_flow: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        privacy_note: null,
+      },
+      generic: {
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
+      },
+    },
+  },
 };
 
 export default TRANSLATIONS;
diff --git a/frontend/src/locales/zh/common.js b/frontend/src/locales/zh/common.js
index e971c192ff2..1847bc0adfa 100644
--- a/frontend/src/locales/zh/common.js
+++ b/frontend/src/locales/zh/common.js
@@ -314,34 +314,6 @@ const TRANSLATIONS = {
         expand: "展开",
         publish: null,
       },
-      publish: {
-        public_description: null,
-        private_description: null,
-        success_title: null,
-        success_description: null,
-        success_thank_you: null,
-        view_on_hub: null,
-        modal_title: null,
-        name_label: null,
-        name_description: null,
-        name_placeholder: null,
-        description_label: null,
-        description_description: null,
-        tags_label: null,
-        tags_description: null,
-        tags_placeholder: null,
-        visibility_label: null,
-        prompt_label: null,
-        prompt_description: null,
-        prompt_placeholder: null,
-        publish_button: null,
-        publishing: null,
-        unauthenticated: {
-          title: null,
-          description: null,
-          button: null,
-        },
-      },
     },
     refusal: {
       title: "查询模式拒绝响应",
@@ -951,6 +923,63 @@ const TRANSLATIONS = {
       showLLMSelector: null,
     },
   },
+  community_hub: {
+    publish: {
+      system_prompt: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
+      agent_flow: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        privacy_note: null,
+      },
+      generic: {
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
+      },
+    },
+  },
 };
 
 export default TRANSLATIONS;
diff --git a/frontend/src/locales/zh_TW/common.js b/frontend/src/locales/zh_TW/common.js
index 0e691d205bd..c853c3f8731 100644
--- a/frontend/src/locales/zh_TW/common.js
+++ b/frontend/src/locales/zh_TW/common.js
@@ -232,34 +232,6 @@ const TRANSLATIONS = {
         expand: null,
         publish: null,
       },
-      publish: {
-        public_description: null,
-        private_description: null,
-        success_title: null,
-        success_description: null,
-        success_thank_you: null,
-        view_on_hub: null,
-        modal_title: null,
-        name_label: null,
-        name_description: null,
-        name_placeholder: null,
-        description_label: null,
-        description_description: null,
-        tags_label: null,
-        tags_description: null,
-        tags_placeholder: null,
-        visibility_label: null,
-        prompt_label: null,
-        prompt_description: null,
-        prompt_placeholder: null,
-        publish_button: null,
-        publishing: null,
-        unauthenticated: {
-          title: null,
-          description: null,
-          button: null,
-        },
-      },
     },
     refusal: {
       title: "查詢模式拒絕回應",
@@ -952,6 +924,63 @@ const TRANSLATIONS = {
       showLLMSelector: null,
     },
   },
+  community_hub: {
+    publish: {
+      system_prompt: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
+      agent_flow: {
+        public_description: null,
+        private_description: null,
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        publish_button: null,
+        submitting: null,
+        submit: null,
+        privacy_note: null,
+      },
+      generic: {
+        unauthenticated: {
+          title: null,
+          description: null,
+          button: null,
+        },
+      },
+    },
+  },
 };
 
 export default TRANSLATIONS;

From 2389edc0d228b908c561623c1ed1313af2566b3d Mon Sep 17 00:00:00 2001
From: shatfield4 <seanhatfield5@gmail.com>
Date: Mon, 16 Jun 2025 16:16:34 -0700
Subject: [PATCH 13/20] rename component/add jsdoc for consistency

---
 .../PublishEntityModal/{AgentFlow => AgentFlows}/index.jsx | 7 +++----
 .../components/CommunityHub/PublishEntityModal/index.jsx   | 4 ++--
 frontend/src/models/communityHub.js                        | 6 ++++++
 3 files changed, 11 insertions(+), 6 deletions(-)
 rename frontend/src/components/CommunityHub/PublishEntityModal/{AgentFlow => AgentFlows}/index.jsx (98%)

diff --git a/frontend/src/components/CommunityHub/PublishEntityModal/AgentFlow/index.jsx b/frontend/src/components/CommunityHub/PublishEntityModal/AgentFlows/index.jsx
similarity index 98%
rename from frontend/src/components/CommunityHub/PublishEntityModal/AgentFlow/index.jsx
rename to frontend/src/components/CommunityHub/PublishEntityModal/AgentFlows/index.jsx
index c2e8a039879..50d59d5c1c7 100644
--- a/frontend/src/components/CommunityHub/PublishEntityModal/AgentFlow/index.jsx
+++ b/frontend/src/components/CommunityHub/PublishEntityModal/AgentFlows/index.jsx
@@ -6,13 +6,12 @@ import paths from "@/utils/paths";
 import { X, CaretRight } from "@phosphor-icons/react/dist/ssr";
 import { BLOCK_INFO } from "@/pages/Admin/AgentBuilder/BlockList";
 
-export default function AgentFlow({ entity }) {
+export default function AgentFlows({ entity }) {
   const { t } = useTranslation();
   const formRef = useRef(null);
   const [isSubmitting, setIsSubmitting] = useState(false);
   const [tags, setTags] = useState([]);
   const [tagInput, setTagInput] = useState("");
-  const [visibility, setVisibility] = useState("public");
   const [isSuccess, setIsSuccess] = useState(false);
   const [itemId, setItemId] = useState(null);
   const [expandedStep, setExpandedStep] = useState(null);
@@ -27,13 +26,13 @@ export default function AgentFlow({ entity }) {
         name: form.get("name"),
         description: form.get("description"),
         tags: tags,
-        visibility: visibility,
+        visibility: "private",
         flow: JSON.stringify({
           name: form.get("name"),
           description: form.get("description"),
           steps: entity.steps,
           tags: tags,
-          visibility: visibility,
+          visibility: "private",
         }),
       };
       const { success, error, itemId } =
diff --git a/frontend/src/components/CommunityHub/PublishEntityModal/index.jsx b/frontend/src/components/CommunityHub/PublishEntityModal/index.jsx
index 6f1afe80eed..fa73aa7b12d 100644
--- a/frontend/src/components/CommunityHub/PublishEntityModal/index.jsx
+++ b/frontend/src/components/CommunityHub/PublishEntityModal/index.jsx
@@ -2,8 +2,8 @@ import { X } from "@phosphor-icons/react";
 import { useCommunityHubAuth } from "@/hooks/useCommunityHubAuth";
 import UnauthenticatedHubModal from "@/components/CommunityHub/UnauthenticatedHubModal";
 import SystemPrompts from "./SystemPrompts";
-import AgentFlow from "./AgentFlow";
 import ModalWrapper from "@/components/ModalWrapper";
+import AgentFlows from "./AgentFlows";
 
 export default function PublishEntityModal({
   show,
@@ -21,7 +21,7 @@ export default function PublishEntityModal({
       case "system-prompt":
         return <SystemPrompts entity={entity} />;
       case "agent-flow":
-        return <AgentFlow entity={entity} />;
+        return <AgentFlows entity={entity} />;
       default:
         return null;
     }
diff --git a/frontend/src/models/communityHub.js b/frontend/src/models/communityHub.js
index d8357dbed52..21612712578 100644
--- a/frontend/src/models/communityHub.js
+++ b/frontend/src/models/communityHub.js
@@ -182,6 +182,12 @@ const CommunityHub = {
       }));
   },
 
+  /**
+   * Create a new agent flow in the community hub
+   * @param {Object} data - The agent flow data
+   * @returns {Promise<{success: boolean, error: string | null}>}
+   */
+
   createAgentFlow: async (data) => {
     return await fetch(`${API_BASE}/community-hub/agent-flow/create`, {
       method: "POST",

From 8a7c67b78362afe057b89e88dc2dc7f2368dfa64 Mon Sep 17 00:00:00 2001
From: shatfield4 <seanhatfield5@gmail.com>
Date: Mon, 16 Jun 2025 16:22:06 -0700
Subject: [PATCH 14/20] fix en translation

---
 frontend/src/locales/en/common.js | 33 -------------------------------
 1 file changed, 33 deletions(-)

diff --git a/frontend/src/locales/en/common.js b/frontend/src/locales/en/common.js
index ea69e4e5263..11375eb7d88 100644
--- a/frontend/src/locales/en/common.js
+++ b/frontend/src/locales/en/common.js
@@ -341,39 +341,6 @@ const TRANSLATIONS = {
           "Are you sure you want to clear all history? This action cannot be undone.",
         expand: "Expand",
       },
-      publish: {
-        public_description: "Public system prompts are visible to everyone.",
-        private_description: "Private system prompts are only visible to you.",
-        success_title: "Success!",
-        success_description:
-          "Your System Prompt has been published to the Community Hub!",
-        success_thank_you: "Thank you for sharing to the Community!",
-        view_on_hub: "View on Community Hub",
-        modal_title: "Publish System Prompt",
-        name_label: "Name",
-        name_description: "This is the display name of your system prompt.",
-        name_placeholder: "My System Prompt",
-        description_label: "Description",
-        description_description:
-          "This is the description of your system prompt. Use this to describe the purpose of your system prompt.",
-        tags_label: "Tags",
-        tags_description:
-          "Tags are used to label your system prompt for easier searching. You can add multiple tags. Max 5 tags. Max 20 characters per tag.",
-        tags_placeholder: "Type and press Enter to add tags",
-        visibility_label: "Visibility",
-        prompt_label: "Prompt",
-        prompt_description:
-          "This is the actual slash command that will be used to guide the LLM.",
-        prompt_placeholder: "Enter your system prompt here...",
-        publish_button: "Publish to Community Hub",
-        publishing: "Publishing...",
-        unauthenticated: {
-          title: "Authentication Required",
-          description:
-            "You need to authenticate with the AnythingLLM Community Hub before publishing prompts.",
-          button: "Connect to Community Hub",
-        },
-      },
     },
     refusal: {
       title: "Query mode refusal response",

From 316cf474ca32128e49eb81c6d583598a19be6174 Mon Sep 17 00:00:00 2001
From: shatfield4 <seanhatfield5@gmail.com>
Date: Mon, 16 Jun 2025 16:26:50 -0700
Subject: [PATCH 15/20] remove comments/duplicate function from merge conf

---
 .../src/pages/Admin/AgentBuilder/index.jsx    |  3 --
 server/models/communityHub.js                 | 35 -------------------
 2 files changed, 38 deletions(-)

diff --git a/frontend/src/pages/Admin/AgentBuilder/index.jsx b/frontend/src/pages/Admin/AgentBuilder/index.jsx
index 71dface104f..39a5cad894a 100644
--- a/frontend/src/pages/Admin/AgentBuilder/index.jsx
+++ b/frontend/src/pages/Admin/AgentBuilder/index.jsx
@@ -309,12 +309,10 @@ export default function AgentBuilder() {
     setBlocks(newBlocks);
   };
 
-  // Handler for publish modal
   const handlePublishFlow = () => {
     setShowPublishModal(true);
   };
 
-  // Compose the entity object for publishing (flow config)
   const flowInfoBlock = blocks.find(
     (block) => block.type === BLOCK_TYPES.FLOW_INFO
   );
@@ -342,7 +340,6 @@ export default function AgentBuilder() {
       }}
       className="w-full h-screen flex bg-theme-bg-primary"
     >
-      {/* Publish Modal */}
       <PublishEntityModal
         show={showPublishModal}
         onClose={() => setShowPublishModal(false)}
diff --git a/server/models/communityHub.js b/server/models/communityHub.js
index e641d11c147..d3b97d411a8 100644
--- a/server/models/communityHub.js
+++ b/server/models/communityHub.js
@@ -208,41 +208,6 @@ const CommunityHub = {
         return { success: false, error: error.message };
       });
   },
-
-  /**
-   * Create a new item in the community hub - Only supports STATIC items for now.
-   * @param {string} itemType - The type of item to create
-   * @param {object} data - The item data
-   * @param {string} connectionKey - The hub connection key
-   * @returns {Promise<{success: boolean, error: string | null}>}
-   */
-  createStaticItem: async function (itemType, data, connectionKey) {
-    if (!connectionKey)
-      return { success: false, error: "Connection key is required" };
-    if (!this.supportedStaticItemTypes.includes(itemType))
-      return { success: false, error: "Unsupported item type" };
-
-    // If the item has specical considerations or preprocessing, we can delegate that below before sending the request.
-    // eg: Agent flow files and such.
-
-    return await fetch(`${this.apiBase}/${itemType}/create`, {
-      method: "POST",
-      headers: {
-        "Content-Type": "application/json",
-        Authorization: `Bearer ${connectionKey}`,
-      },
-      body: JSON.stringify(data),
-    })
-      .then((response) => response.json())
-      .then((result) => {
-        if (!!result.error) throw new Error(result.error || "Unknown error");
-        return { success: true, error: null, itemId: result.item.id };
-      })
-      .catch((error) => {
-        console.error(`Error creating ${itemType}:`, error);
-        return { success: false, error: error.message };
-      });
-  },
 };
 
 module.exports = { CommunityHub };

From b37a238f16e968511a030859658e8f1f11e3c6b0 Mon Sep 17 00:00:00 2001
From: shatfield4 <seanhatfield5@gmail.com>
Date: Mon, 16 Jun 2025 16:36:43 -0700
Subject: [PATCH 16/20] update styles of publish button in flow builder

---
 frontend/src/pages/Admin/AgentBuilder/HeaderMenu/index.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/pages/Admin/AgentBuilder/HeaderMenu/index.jsx b/frontend/src/pages/Admin/AgentBuilder/HeaderMenu/index.jsx
index 908a7ae88b3..0cfa11d9d8b 100644
--- a/frontend/src/pages/Admin/AgentBuilder/HeaderMenu/index.jsx
+++ b/frontend/src/pages/Admin/AgentBuilder/HeaderMenu/index.jsx
@@ -124,7 +124,7 @@ export default function HeaderMenu({
             </button>
             <button
               onClick={onPublishFlow}
-              className="px-3 py-2 rounded-lg text-sm font-medium flex items-center justify-center gap-2 border bg-white text-black hover:bg-gray-100 transition-all duration-300 dark:bg-white dark:text-black dark:hover:bg-gray-200 light:bg-white light:text-black light:border light:hover:bg-gray-100"
+              className="px-3 py-2 rounded-lg text-sm font-medium flex items-center justify-center gap-2 border border-white/10 bg-theme-bg-primary text-theme-text-primary hover:bg-theme-action-menu-bg transition-all duration-300"
             >
               Publish
             </button>

From 2cc35387550dfc000697963069270c38ac5e1b60 Mon Sep 17 00:00:00 2001
From: shatfield4 <seanhatfield5@gmail.com>
Date: Mon, 16 Jun 2025 16:40:20 -0700
Subject: [PATCH 17/20] resolve ssr icon issue

---
 .../CommunityHub/PublishEntityModal/AgentFlows/index.jsx        | 2 +-
 .../CommunityHub/PublishEntityModal/SystemPrompts/index.jsx     | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/CommunityHub/PublishEntityModal/AgentFlows/index.jsx b/frontend/src/components/CommunityHub/PublishEntityModal/AgentFlows/index.jsx
index 50d59d5c1c7..c19af9aa203 100644
--- a/frontend/src/components/CommunityHub/PublishEntityModal/AgentFlows/index.jsx
+++ b/frontend/src/components/CommunityHub/PublishEntityModal/AgentFlows/index.jsx
@@ -3,7 +3,7 @@ import { useTranslation } from "react-i18next";
 import CommunityHub from "@/models/communityHub";
 import showToast from "@/utils/toast";
 import paths from "@/utils/paths";
-import { X, CaretRight } from "@phosphor-icons/react/dist/ssr";
+import { X, CaretRight } from "@phosphor-icons/react";
 import { BLOCK_INFO } from "@/pages/Admin/AgentBuilder/BlockList";
 
 export default function AgentFlows({ entity }) {
diff --git a/frontend/src/components/CommunityHub/PublishEntityModal/SystemPrompts/index.jsx b/frontend/src/components/CommunityHub/PublishEntityModal/SystemPrompts/index.jsx
index 6cc7e8cec84..69bdf0f3276 100644
--- a/frontend/src/components/CommunityHub/PublishEntityModal/SystemPrompts/index.jsx
+++ b/frontend/src/components/CommunityHub/PublishEntityModal/SystemPrompts/index.jsx
@@ -3,7 +3,7 @@ import { useTranslation } from "react-i18next";
 import CommunityHub from "@/models/communityHub";
 import showToast from "@/utils/toast";
 import paths from "@/utils/paths";
-import { X } from "@phosphor-icons/react/dist/ssr";
+import { X } from "@phosphor-icons/react";
 
 export default function SystemPrompts({ entity }) {
   const { t } = useTranslation();

From c5e783721b3532c44d02ad7fd883b6e3ba258aa4 Mon Sep 17 00:00:00 2001
From: shatfield4 <seanhatfield5@gmail.com>
Date: Wed, 18 Jun 2025 14:28:16 -0700
Subject: [PATCH 18/20] implement uploading slash commands to hub

---
 .../SlashCommands/index.jsx                   | 275 ++++++++++++++++++
 .../CommunityHub/PublishEntityModal/index.jsx |   3 +
 .../SlashCommands/SlashPresets/index.jsx      | 135 +++++++--
 frontend/src/locales/en/common.js             |  31 ++
 frontend/src/models/communityHub.js           |  30 +-
 server/models/communityHub.js                 |   2 +-
 6 files changed, 451 insertions(+), 25 deletions(-)
 create mode 100644 frontend/src/components/CommunityHub/PublishEntityModal/SlashCommands/index.jsx

diff --git a/frontend/src/components/CommunityHub/PublishEntityModal/SlashCommands/index.jsx b/frontend/src/components/CommunityHub/PublishEntityModal/SlashCommands/index.jsx
new file mode 100644
index 00000000000..72a444a200e
--- /dev/null
+++ b/frontend/src/components/CommunityHub/PublishEntityModal/SlashCommands/index.jsx
@@ -0,0 +1,275 @@
+import { useState, useRef } from "react";
+import { useTranslation } from "react-i18next";
+import CommunityHub from "@/models/communityHub";
+import showToast from "@/utils/toast";
+import paths from "@/utils/paths";
+import { X } from "@phosphor-icons/react";
+
+export default function SlashCommands({ entity }) {
+  const { t } = useTranslation();
+  const formRef = useRef(null);
+  const [isSubmitting, setIsSubmitting] = useState(false);
+  const [tags, setTags] = useState([]);
+  const [tagInput, setTagInput] = useState("");
+  const [visibility, setVisibility] = useState("public");
+  const [isSuccess, setIsSuccess] = useState(false);
+  const [itemId, setItemId] = useState(null);
+
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    setIsSubmitting(true);
+    try {
+      const form = new FormData(formRef.current);
+      const data = {
+        name: form.get("name"),
+        description: form.get("description"),
+        command: form.get("command"),
+        prompt: form.get("prompt"),
+        tags: tags,
+        visibility: visibility,
+      };
+
+      const { success, error, itemId } =
+        await CommunityHub.createSlashCommand(data);
+      if (!success) throw new Error(error);
+      setItemId(itemId);
+      setIsSuccess(true);
+    } catch (error) {
+      console.error("Failed to publish slash command:", error);
+      showToast(`Failed to publish slash command: ${error.message}`, "error", {
+        clear: true,
+      });
+    } finally {
+      setIsSubmitting(false);
+    }
+  };
+
+  const handleKeyDown = (e) => {
+    if (e.key === "Enter" || e.key === ",") {
+      e.preventDefault();
+      const value = tagInput.trim();
+      if (value.length > 20) return;
+      if (value && !tags.includes(value)) {
+        setTags((prevTags) => [...prevTags, value].slice(0, 5)); // Limit to 5 tags
+        setTagInput("");
+      }
+    }
+  };
+
+  const removeTag = (tagToRemove) => {
+    setTags(tags.filter((tag) => tag !== tagToRemove));
+  };
+
+  if (isSuccess) {
+    return (
+      <div className="p-6 -mt-12 w-[400px]">
+        <div className="flex flex-col items-center justify-center gap-y-2">
+          <h3 className="text-lg font-semibold text-theme-text-primary">
+            {t("community_hub.publish.slash_command.success_title")}
+          </h3>
+          <p className="text-lg text-theme-text-primary text-center max-w-2xl">
+            {t("community_hub.publish.slash_command.success_description")}
+          </p>
+          <p className="text-theme-text-secondary text-center text-sm">
+            {t("community_hub.publish.slash_command.success_thank_you")}
+          </p>
+          <a
+            href={paths.communityHub.viewItem("slash-command", itemId)}
+            target="_blank"
+            rel="noreferrer"
+            className="w-[265px] bg-theme-bg-secondary hover:bg-theme-sidebar-item-hover text-theme-text-primary py-2 px-4 rounded-lg transition-colors mt-4 text-sm font-semibold text-center"
+          >
+            {t("community_hub.publish.slash_command.view_on_hub")}
+          </a>
+        </div>
+      </div>
+    );
+  }
+
+  return (
+    <>
+      <div className="w-full flex gap-x-2 items-center mb-3 -mt-8">
+        <h3 className="text-xl font-semibold text-theme-text-primary px-6 py-3">
+          {t("community_hub.publish.slash_command.modal_title")}
+        </h3>
+      </div>
+      <form ref={formRef} className="flex" onSubmit={handleSubmit}>
+        <div className="w-1/2 p-6 pt-0 space-y-4">
+          <div>
+            <label className="block text-sm font-semibold text-theme-text-primary mb-1">
+              {t("community_hub.publish.slash_command.name_label")}
+            </label>
+            <div className="text-xs text-theme-text-secondary mb-2">
+              {t("community_hub.publish.slash_command.name_description")}
+            </div>
+            <input
+              type="text"
+              name="name"
+              required
+              minLength={3}
+              maxLength={300}
+              defaultValue={entity.name}
+              placeholder={t(
+                "community_hub.publish.slash_command.name_placeholder"
+              )}
+              className="w-full bg-theme-bg-secondary rounded-lg p-2 text-theme-text-primary text-sm focus:outline-primary-button active:outline-primary-button outline-none placeholder:text-theme-text-placeholder"
+            />
+          </div>
+
+          <div>
+            <label className="block text-sm font-semibold text-theme-text-primary mb-1">
+              {t("community_hub.publish.slash_command.description_label")}
+            </label>
+            <div className="text-xs text-white/60 mb-2">
+              {t("community_hub.publish.slash_command.description_description")}
+            </div>
+            <textarea
+              name="description"
+              required
+              minLength={10}
+              maxLength={1000}
+              defaultValue={entity.description}
+              placeholder={t(
+                "community_hub.publish.slash_command.description_placeholder"
+              )}
+              className="w-full bg-theme-bg-secondary rounded-lg p-2 text-white text-sm focus:outline-primary-button active:outline-primary-button outline-none min-h-[80px] placeholder:text-theme-text-placeholder"
+            />
+          </div>
+
+          <div>
+            <label className="block text-sm font-semibold text-theme-text-primary mb-1">
+              {t("community_hub.publish.slash_command.command_label")}
+            </label>
+            <div className="text-xs text-white/60 mb-2">
+              {t("community_hub.publish.slash_command.command_description")}
+            </div>
+            <input
+              type="text"
+              name="command"
+              required
+              minLength={1}
+              maxLength={50}
+              defaultValue={entity.command}
+              placeholder={t(
+                "community_hub.publish.slash_command.command_placeholder"
+              )}
+              className="w-full bg-theme-bg-secondary rounded-lg p-2 text-theme-text-primary text-sm focus:outline-primary-button active:outline-primary-button outline-none placeholder:text-theme-text-placeholder"
+            />
+          </div>
+
+          <div>
+            <label className="block text-sm font-semibold text-white mb-1">
+              {t("community_hub.publish.slash_command.tags_label")}
+            </label>
+            <div className="text-xs text-white/60 mb-2">
+              {t("community_hub.publish.slash_command.tags_description")}
+            </div>
+            <div className="flex flex-wrap gap-2 p-2 bg-theme-bg-secondary rounded-lg min-h-[42px]">
+              {tags.map((tag, index) => (
+                <span
+                  key={index}
+                  className="flex items-center gap-1 px-2 py-1 text-sm text-theme-text-primary bg-white/10 light:bg-black/10 rounded-md"
+                >
+                  {tag}
+                  <button
+                    type="button"
+                    onClick={() => removeTag(tag)}
+                    className="border-none text-theme-text-primary hover:text-theme-text-secondary cursor-pointer"
+                  >
+                    <X size={14} />
+                  </button>
+                </span>
+              ))}
+              <input
+                type="text"
+                value={tagInput}
+                onChange={(e) => setTagInput(e.target.value)}
+                onKeyDown={handleKeyDown}
+                placeholder={t(
+                  "community_hub.publish.slash_command.tags_placeholder"
+                )}
+                className="flex-1 min-w-[200px] border-none text-sm bg-transparent text-theme-text-primary placeholder:text-theme-text-placeholder p-0 h-[24px] focus:outline-none"
+              />
+            </div>
+          </div>
+
+          <div>
+            <label className="block text-sm font-semibold text-white mb-1">
+              {t("community_hub.publish.slash_command.visibility_label")}
+            </label>
+            <div className="text-xs text-white/60 mb-2">
+              {visibility === "public"
+                ? t("community_hub.publish.slash_command.public_description")
+                : t("community_hub.publish.slash_command.private_description")}
+            </div>
+            <div className="w-fit h-[42px] bg-theme-bg-secondary rounded-lg p-0.5">
+              <div className="flex items-center" role="group">
+                <input
+                  type="radio"
+                  id="public"
+                  name="visibility"
+                  value="public"
+                  className="peer/public hidden"
+                  defaultChecked
+                  onChange={(e) => setVisibility(e.target.value)}
+                />
+                <input
+                  type="radio"
+                  id="private"
+                  name="visibility"
+                  value="private"
+                  className="peer/private hidden"
+                  onChange={(e) => setVisibility(e.target.value)}
+                />
+                <label
+                  htmlFor="public"
+                  className="h-[36px] px-4 rounded-lg text-sm font-medium transition-all duration-200 cursor-pointer text-theme-text-primary hover:text-theme-text-secondary peer-checked/public:bg-theme-sidebar-item-hover peer-checked/public:text-theme-primary-button flex items-center justify-center"
+                >
+                  Public
+                </label>
+                <label
+                  htmlFor="private"
+                  className="h-[36px] px-4 rounded-lg text-sm font-medium transition-all duration-200 cursor-pointer text-theme-text-primary hover:text-theme-text-secondary peer-checked/private:bg-theme-sidebar-item-hover peer-checked/private:text-theme-primary-button flex items-center justify-center"
+                >
+                  Private
+                </label>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <div className="w-1/2 p-6 pt-0 space-y-4">
+          <div>
+            <label className="block text-sm font-semibold text-white mb-1">
+              {t("community_hub.publish.slash_command.prompt_label")}
+            </label>
+            <div className="text-xs text-white/60 mb-2">
+              {t("community_hub.publish.slash_command.prompt_description")}
+            </div>
+            <textarea
+              name="prompt"
+              required
+              minLength={10}
+              defaultValue={entity.prompt}
+              placeholder={t(
+                "community_hub.publish.slash_command.prompt_placeholder"
+              )}
+              className="w-full bg-theme-bg-secondary rounded-lg p-2 text-white text-sm focus:outline-primary-button active:outline-primary-button outline-none min-h-[300px] placeholder:text-theme-text-placeholder"
+            />
+          </div>
+
+          <button
+            type="submit"
+            disabled={isSubmitting}
+            className="w-full bg-cta-button hover:opacity-80 text-theme-text-primary font-medium py-2 px-4 rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
+          >
+            {isSubmitting
+              ? t("community_hub.publish.slash_command.submitting")
+              : t("community_hub.publish.slash_command.publish_button")}
+          </button>
+        </div>
+      </form>
+    </>
+  );
+}
diff --git a/frontend/src/components/CommunityHub/PublishEntityModal/index.jsx b/frontend/src/components/CommunityHub/PublishEntityModal/index.jsx
index fa73aa7b12d..59d242ea322 100644
--- a/frontend/src/components/CommunityHub/PublishEntityModal/index.jsx
+++ b/frontend/src/components/CommunityHub/PublishEntityModal/index.jsx
@@ -4,6 +4,7 @@ import UnauthenticatedHubModal from "@/components/CommunityHub/UnauthenticatedHu
 import SystemPrompts from "./SystemPrompts";
 import ModalWrapper from "@/components/ModalWrapper";
 import AgentFlows from "./AgentFlows";
+import SlashCommands from "./SlashCommands";
 
 export default function PublishEntityModal({
   show,
@@ -22,6 +23,8 @@ export default function PublishEntityModal({
         return <SystemPrompts entity={entity} />;
       case "agent-flow":
         return <AgentFlows entity={entity} />;
+      case "slash-command":
+        return <SlashCommands entity={entity} />;
       default:
         return null;
     }
diff --git a/frontend/src/components/WorkspaceChat/ChatContainer/PromptInput/SlashCommands/SlashPresets/index.jsx b/frontend/src/components/WorkspaceChat/ChatContainer/PromptInput/SlashCommands/SlashPresets/index.jsx
index 715a149dbb6..1bec5230479 100644
--- a/frontend/src/components/WorkspaceChat/ChatContainer/PromptInput/SlashCommands/SlashPresets/index.jsx
+++ b/frontend/src/components/WorkspaceChat/ChatContainer/PromptInput/SlashCommands/SlashPresets/index.jsx
@@ -1,4 +1,4 @@
-import { useEffect, useState } from "react";
+import { useEffect, useState, useRef } from "react";
 import { useIsAgentSessionActive } from "@/utils/chat/agent";
 import AddPresetModal from "./AddPresetModal";
 import EditPresetModal from "./EditPresetModal";
@@ -8,6 +8,7 @@ import { DotsThree, Plus } from "@phosphor-icons/react";
 import showToast from "@/utils/toast";
 import { useSearchParams } from "react-router-dom";
 import { useTranslation } from "react-i18next";
+import PublishEntityModal from "@/components/CommunityHub/PublishEntityModal";
 
 export const CMD_REGEX = new RegExp(/[^a-zA-Z0-9_-]/g);
 export default function SlashPresets({ setShowing, sendCommand, promptRef }) {
@@ -23,8 +24,14 @@ export default function SlashPresets({ setShowing, sendCommand, promptRef }) {
     openModal: openEditModal,
     closeModal: closeEditModal,
   } = useModal();
+  const {
+    isOpen: isPublishModalOpen,
+    openModal: openPublishModal,
+    closeModal: closePublishModal,
+  } = useModal();
   const [presets, setPresets] = useState([]);
   const [selectedPreset, setSelectedPreset] = useState(null);
+  const [presetToPublish, setPresetToPublish] = useState(null);
   const [searchParams] = useSearchParams();
 
   useEffect(() => {
@@ -94,36 +101,30 @@ export default function SlashPresets({ setShowing, sendCommand, promptRef }) {
     setSelectedPreset(null);
   };
 
+  const handlePublishPreset = (preset) => {
+    setPresetToPublish({
+      name: preset.command.slice(1),
+      description: preset.description,
+      command: preset.command,
+      prompt: preset.prompt,
+    });
+    openPublishModal();
+  };
+
   return (
     <>
       {presets.map((preset) => (
-        <button
+        <PresetItem
           key={preset.id}
-          onClick={() => {
+          preset={preset}
+          onUse={() => {
             setShowing(false);
             sendCommand(`${preset.command} `, false);
             promptRef?.current?.focus();
           }}
-          className="border-none w-full hover:cursor-pointer hover:bg-theme-action-menu-item-hover px-2 py-2 rounded-xl flex flex-row justify-start"
-        >
-          <div className="w-full flex-col text-left flex pointer-events-none">
-            <div className="text-theme-text-primary text-sm font-bold">
-              {preset.command}
-            </div>
-            <div className="text-theme-text-secondary text-sm">
-              {preset.description}
-            </div>
-          </div>
-          <button
-            onClick={(e) => {
-              e.stopPropagation();
-              handleEditPreset(preset);
-            }}
-            className="border-none text-theme-text-primary text-sm p-1 hover:cursor-pointer hover:bg-theme-action-menu-item-hover rounded-full mt-1"
-          >
-            <DotsThree size={24} weight="bold" />
-          </button>
-        </button>
+          onEdit={handleEditPreset}
+          onPublish={handlePublishPreset}
+        />
       ))}
       <button
         onClick={openAddModal}
@@ -150,6 +151,94 @@ export default function SlashPresets({ setShowing, sendCommand, promptRef }) {
           preset={selectedPreset}
         />
       )}
+      <PublishEntityModal
+        show={isPublishModalOpen}
+        onClose={closePublishModal}
+        entityType="slash-command"
+        entity={presetToPublish}
+      />
     </>
   );
 }
+
+function PresetItem({ preset, onUse, onEdit, onPublish }) {
+  const [showMenu, setShowMenu] = useState(false);
+  const menuRef = useRef(null);
+  const menuButtonRef = useRef(null);
+
+  useEffect(() => {
+    const handleClickOutside = (event) => {
+      if (
+        showMenu &&
+        menuRef.current &&
+        !menuRef.current.contains(event.target) &&
+        menuButtonRef.current &&
+        !menuButtonRef.current.contains(event.target)
+      ) {
+        setShowMenu(false);
+      }
+    };
+    document.addEventListener("mousedown", handleClickOutside);
+    return () => {
+      document.removeEventListener("mousedown", handleClickOutside);
+    };
+  }, [showMenu]);
+
+  return (
+    <button
+      onClick={onUse}
+      className="border-none w-full hover:cursor-pointer hover:bg-theme-action-menu-item-hover px-2 py-2 rounded-xl flex flex-row justify-start items-center relative"
+    >
+      <div className="flex-col text-left flex pointer-events-none flex-1 min-w-0">
+        <div className="text-theme-text-primary text-sm font-bold truncate">
+          {preset.command}
+        </div>
+        <div className="text-theme-text-secondary text-sm truncate">
+          {preset.description}
+        </div>
+      </div>
+      <button
+        ref={menuButtonRef}
+        type="button"
+        tabIndex={-1}
+        onClick={(e) => {
+          e.stopPropagation();
+          setShowMenu(!showMenu);
+        }}
+        className="border-none text-theme-text-primary text-sm p-1 hover:cursor-pointer hover:bg-theme-action-menu-item-hover rounded-full ml-2 flex-shrink-0 z-20"
+        aria-label="More actions"
+      >
+        <DotsThree size={24} weight="bold" />
+      </button>
+      {showMenu && (
+        <div
+          ref={menuRef}
+          className="absolute right-0 top-10 bg-theme-bg-popup-menu rounded-lg z-50 min-w-[160px] shadow-lg border border-theme-modal-border flex flex-col"
+        >
+          <button
+            type="button"
+            className="px-[10px] py-[6px] text-sm text-white hover:bg-theme-sidebar-item-hover rounded-t-lg cursor-pointer border-none w-full text-left whitespace-nowrap"
+            onClick={(e) => {
+              e.stopPropagation();
+              setShowMenu(false);
+              onEdit(preset);
+            }}
+          >
+            Edit
+          </button>
+          <button
+            type="button"
+            className="px-[10px] py-[6px] text-sm text-white hover:bg-theme-sidebar-item-hover rounded-b-lg cursor-pointer border-none w-full text-left whitespace-nowrap"
+            onClick={(e) => {
+              e.stopPropagation();
+              setShowMenu(false);
+              onPublish(preset);
+            }}
+          >
+            Publish
+          </button>
+        </div>
+      )}
+    </button>
+  );
+}
diff --git a/frontend/src/locales/en/common.js b/frontend/src/locales/en/common.js
index 11375eb7d88..665a45a05d0 100644
--- a/frontend/src/locales/en/common.js
+++ b/frontend/src/locales/en/common.js
@@ -1084,6 +1084,37 @@ const TRANSLATIONS = {
         privacy_note:
           "Agent flows are always uploaded as private to protect any sensitive data. You can change the visibility in the Community Hub after publishing. Please verify your flow does not contain any sensitive or private information before publishing.",
       },
+      slash_command: {
+        success_title: "Success!",
+        success_description:
+          "Your Slash Command has been published to the Community Hub!",
+        success_thank_you: "Thank you for sharing to the Community!",
+        view_on_hub: "View on Community Hub",
+        modal_title: "Publish Slash Command",
+        name_label: "Name",
+        name_description: "This is the display name of your slash command.",
+        name_placeholder: "My Slash Command",
+        description_label: "Description",
+        description_description:
+          "This is the description of your slash command. Use this to describe the purpose of your slash command.",
+        command_label: "Command",
+        command_description:
+          "This is the slash command that users will type to trigger this preset.",
+        command_placeholder: "my-command",
+        tags_label: "Tags",
+        tags_description:
+          "Tags are used to label your slash command for easier searching. You can add multiple tags. Max 5 tags. Max 20 characters per tag.",
+        tags_placeholder: "Type and press Enter to add tags",
+        visibility_label: "Visibility",
+        public_description: "Public slash commands are visible to everyone.",
+        private_description: "Private slash commands are only visible to you.",
+        publish_button: "Publish to Community Hub",
+        submitting: "Publishing...",
+        prompt_label: "Prompt",
+        prompt_description:
+          "This is the prompt that will be used when the slash command is triggered.",
+        prompt_placeholder: "Enter your prompt here...",
+      },
       generic: {
         unauthenticated: {
           title: "Authentication Required",
diff --git a/frontend/src/models/communityHub.js b/frontend/src/models/communityHub.js
index 21612712578..6f27abf9c1c 100644
--- a/frontend/src/models/communityHub.js
+++ b/frontend/src/models/communityHub.js
@@ -187,7 +187,6 @@ const CommunityHub = {
    * @param {Object} data - The agent flow data
    * @returns {Promise<{success: boolean, error: string | null}>}
    */
-
   createAgentFlow: async (data) => {
     return await fetch(`${API_BASE}/community-hub/agent-flow/create`, {
       method: "POST",
@@ -200,6 +199,35 @@ const CommunityHub = {
       return { success: true, error: null, itemId: response.item?.id };
     });
   },
+
+  /**
+   * Create a new slash command in the community hub
+   * @param {Object} data - The slash command data
+   * @param {string} data.name - The name of the command
+   * @param {string} data.description - The description of the command
+   * @param {string} data.command - The actual command text
+   * @param {string} data.prompt - The prompt for the command
+   * @param {string[]} data.tags - Array of tags
+   * @param {string} data.visibility - Either 'public' or 'private'
+   * @returns {Promise<{success: boolean, error: string | null}>}
+   */
+  createSlashCommand: async (data) => {
+    return await fetch(`${API_BASE}/community-hub/slash-command/create`, {
+      method: "POST",
+      headers: baseHeaders(),
+      body: JSON.stringify(data),
+    })
+      .then(async (res) => {
+        const response = await res.json();
+        if (!res.ok)
+          throw new Error(response.error || "Failed to create slash command");
+        return { success: true, error: null, itemId: response.item?.id };
+      })
+      .catch((e) => ({
+        success: false,
+        error: e.message,
+      }));
+  },
 };
 
 export default CommunityHub;
diff --git a/server/models/communityHub.js b/server/models/communityHub.js
index d3b97d411a8..62b81b3d97e 100644
--- a/server/models/communityHub.js
+++ b/server/models/communityHub.js
@@ -9,7 +9,7 @@ const CommunityHub = {
     process.env.NODE_ENV === "development"
       ? "http://127.0.0.1:5001/anythingllm-hub/us-central1/external/v1"
       : "https://hub.external.anythingllm.com/v1",
-  supportedStaticItemTypes: ["system-prompt", "agent-flow"],
+  supportedStaticItemTypes: ["system-prompt", "agent-flow", "slash-command"],
 
   /**
    * Validate an import ID and return the entity type and ID.

From da53753a19c2840a9ee6939902b641d6d8e1c39b Mon Sep 17 00:00:00 2001
From: shatfield4 <seanhatfield5@gmail.com>
Date: Wed, 18 Jun 2025 14:30:29 -0700
Subject: [PATCH 19/20] normalize translations

---
 frontend/src/locales/ar/common.js    | 26 ++++++++++++++++++++++++++
 frontend/src/locales/da/common.js    | 26 ++++++++++++++++++++++++++
 frontend/src/locales/de/common.js    | 26 ++++++++++++++++++++++++++
 frontend/src/locales/es/common.js    | 26 ++++++++++++++++++++++++++
 frontend/src/locales/fa/common.js    | 26 ++++++++++++++++++++++++++
 frontend/src/locales/fr/common.js    | 26 ++++++++++++++++++++++++++
 frontend/src/locales/he/common.js    | 26 ++++++++++++++++++++++++++
 frontend/src/locales/it/common.js    | 26 ++++++++++++++++++++++++++
 frontend/src/locales/ja/common.js    | 26 ++++++++++++++++++++++++++
 frontend/src/locales/ko/common.js    | 26 ++++++++++++++++++++++++++
 frontend/src/locales/lv/common.js    | 26 ++++++++++++++++++++++++++
 frontend/src/locales/nl/common.js    | 26 ++++++++++++++++++++++++++
 frontend/src/locales/pt_BR/common.js | 26 ++++++++++++++++++++++++++
 frontend/src/locales/ru/common.js    | 26 ++++++++++++++++++++++++++
 frontend/src/locales/tr/common.js    | 26 ++++++++++++++++++++++++++
 frontend/src/locales/vn/common.js    | 26 ++++++++++++++++++++++++++
 frontend/src/locales/zh/common.js    | 26 ++++++++++++++++++++++++++
 frontend/src/locales/zh_TW/common.js | 26 ++++++++++++++++++++++++++
 18 files changed, 468 insertions(+)

diff --git a/frontend/src/locales/ar/common.js b/frontend/src/locales/ar/common.js
index f8d0ba3e173..5ccb766bfc8 100644
--- a/frontend/src/locales/ar/common.js
+++ b/frontend/src/locales/ar/common.js
@@ -982,6 +982,32 @@ const TRANSLATIONS = {
           button: null,
         },
       },
+      slash_command: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        command_label: null,
+        command_description: null,
+        command_placeholder: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
     },
   },
 };
diff --git a/frontend/src/locales/da/common.js b/frontend/src/locales/da/common.js
index 8d2bbb90811..9c33feb8f4d 100644
--- a/frontend/src/locales/da/common.js
+++ b/frontend/src/locales/da/common.js
@@ -1021,6 +1021,32 @@ const TRANSLATIONS = {
           button: null,
         },
       },
+      slash_command: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        command_label: null,
+        command_description: null,
+        command_placeholder: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
     },
   },
 };
diff --git a/frontend/src/locales/de/common.js b/frontend/src/locales/de/common.js
index 0c368b76377..93f638a0305 100644
--- a/frontend/src/locales/de/common.js
+++ b/frontend/src/locales/de/common.js
@@ -1026,6 +1026,32 @@ const TRANSLATIONS = {
           button: null,
         },
       },
+      slash_command: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        command_label: null,
+        command_description: null,
+        command_placeholder: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
     },
   },
 };
diff --git a/frontend/src/locales/es/common.js b/frontend/src/locales/es/common.js
index 3275fb6a040..7a4b690a168 100644
--- a/frontend/src/locales/es/common.js
+++ b/frontend/src/locales/es/common.js
@@ -986,6 +986,32 @@ const TRANSLATIONS = {
           button: null,
         },
       },
+      slash_command: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        command_label: null,
+        command_description: null,
+        command_placeholder: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
     },
   },
 };
diff --git a/frontend/src/locales/fa/common.js b/frontend/src/locales/fa/common.js
index d2c1e734794..83610af9ff4 100644
--- a/frontend/src/locales/fa/common.js
+++ b/frontend/src/locales/fa/common.js
@@ -974,6 +974,32 @@ const TRANSLATIONS = {
           button: null,
         },
       },
+      slash_command: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        command_label: null,
+        command_description: null,
+        command_placeholder: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
     },
   },
 };
diff --git a/frontend/src/locales/fr/common.js b/frontend/src/locales/fr/common.js
index ecf5a114994..f5202619917 100644
--- a/frontend/src/locales/fr/common.js
+++ b/frontend/src/locales/fr/common.js
@@ -982,6 +982,32 @@ const TRANSLATIONS = {
           button: null,
         },
       },
+      slash_command: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        command_label: null,
+        command_description: null,
+        command_placeholder: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
     },
   },
 };
diff --git a/frontend/src/locales/he/common.js b/frontend/src/locales/he/common.js
index 3bb1bd0f618..c680046fc45 100644
--- a/frontend/src/locales/he/common.js
+++ b/frontend/src/locales/he/common.js
@@ -967,6 +967,32 @@ const TRANSLATIONS = {
           button: null,
         },
       },
+      slash_command: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        command_label: null,
+        command_description: null,
+        command_placeholder: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
     },
   },
 };
diff --git a/frontend/src/locales/it/common.js b/frontend/src/locales/it/common.js
index d6c42ac2b49..f7a63d99736 100644
--- a/frontend/src/locales/it/common.js
+++ b/frontend/src/locales/it/common.js
@@ -980,6 +980,32 @@ const TRANSLATIONS = {
           button: null,
         },
       },
+      slash_command: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        command_label: null,
+        command_description: null,
+        command_placeholder: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
     },
   },
 };
diff --git a/frontend/src/locales/ja/common.js b/frontend/src/locales/ja/common.js
index 6d394ddaa2d..d7c1820c92b 100644
--- a/frontend/src/locales/ja/common.js
+++ b/frontend/src/locales/ja/common.js
@@ -1016,6 +1016,32 @@ const TRANSLATIONS = {
           button: null,
         },
       },
+      slash_command: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        command_label: null,
+        command_description: null,
+        command_placeholder: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
     },
   },
 };
diff --git a/frontend/src/locales/ko/common.js b/frontend/src/locales/ko/common.js
index cda39ef2f05..032c227bd0c 100644
--- a/frontend/src/locales/ko/common.js
+++ b/frontend/src/locales/ko/common.js
@@ -967,6 +967,32 @@ const TRANSLATIONS = {
           button: null,
         },
       },
+      slash_command: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        command_label: null,
+        command_description: null,
+        command_placeholder: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
     },
   },
 };
diff --git a/frontend/src/locales/lv/common.js b/frontend/src/locales/lv/common.js
index e1abcb707f3..863fa12eb21 100644
--- a/frontend/src/locales/lv/common.js
+++ b/frontend/src/locales/lv/common.js
@@ -1038,6 +1038,32 @@ const TRANSLATIONS = {
           button: null,
         },
       },
+      slash_command: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        command_label: null,
+        command_description: null,
+        command_placeholder: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
     },
   },
 };
diff --git a/frontend/src/locales/nl/common.js b/frontend/src/locales/nl/common.js
index 4427d091985..bd7626e7929 100644
--- a/frontend/src/locales/nl/common.js
+++ b/frontend/src/locales/nl/common.js
@@ -977,6 +977,32 @@ const TRANSLATIONS = {
           button: null,
         },
       },
+      slash_command: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        command_label: null,
+        command_description: null,
+        command_placeholder: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
     },
   },
 };
diff --git a/frontend/src/locales/pt_BR/common.js b/frontend/src/locales/pt_BR/common.js
index ef0f8c021a6..c65a70b0619 100644
--- a/frontend/src/locales/pt_BR/common.js
+++ b/frontend/src/locales/pt_BR/common.js
@@ -1019,6 +1019,32 @@ const TRANSLATIONS = {
           button: null,
         },
       },
+      slash_command: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        command_label: null,
+        command_description: null,
+        command_placeholder: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
     },
   },
 };
diff --git a/frontend/src/locales/ru/common.js b/frontend/src/locales/ru/common.js
index cf0ab8c1417..1a3f73a4376 100644
--- a/frontend/src/locales/ru/common.js
+++ b/frontend/src/locales/ru/common.js
@@ -1022,6 +1022,32 @@ const TRANSLATIONS = {
           button: null,
         },
       },
+      slash_command: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        command_label: null,
+        command_description: null,
+        command_placeholder: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
     },
   },
 };
diff --git a/frontend/src/locales/tr/common.js b/frontend/src/locales/tr/common.js
index 329b151ff03..22e5da9ae9c 100644
--- a/frontend/src/locales/tr/common.js
+++ b/frontend/src/locales/tr/common.js
@@ -977,6 +977,32 @@ const TRANSLATIONS = {
           button: null,
         },
       },
+      slash_command: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        command_label: null,
+        command_description: null,
+        command_placeholder: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
     },
   },
 };
diff --git a/frontend/src/locales/vn/common.js b/frontend/src/locales/vn/common.js
index 02d6848ddc4..06839550c30 100644
--- a/frontend/src/locales/vn/common.js
+++ b/frontend/src/locales/vn/common.js
@@ -976,6 +976,32 @@ const TRANSLATIONS = {
           button: null,
         },
       },
+      slash_command: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        command_label: null,
+        command_description: null,
+        command_placeholder: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
     },
   },
 };
diff --git a/frontend/src/locales/zh/common.js b/frontend/src/locales/zh/common.js
index 1847bc0adfa..acef3d9cb24 100644
--- a/frontend/src/locales/zh/common.js
+++ b/frontend/src/locales/zh/common.js
@@ -978,6 +978,32 @@ const TRANSLATIONS = {
           button: null,
         },
       },
+      slash_command: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        command_label: null,
+        command_description: null,
+        command_placeholder: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
     },
   },
 };
diff --git a/frontend/src/locales/zh_TW/common.js b/frontend/src/locales/zh_TW/common.js
index c853c3f8731..e5329d45fbb 100644
--- a/frontend/src/locales/zh_TW/common.js
+++ b/frontend/src/locales/zh_TW/common.js
@@ -979,6 +979,32 @@ const TRANSLATIONS = {
           button: null,
         },
       },
+      slash_command: {
+        success_title: null,
+        success_description: null,
+        success_thank_you: null,
+        view_on_hub: null,
+        modal_title: null,
+        name_label: null,
+        name_description: null,
+        name_placeholder: null,
+        description_label: null,
+        description_description: null,
+        command_label: null,
+        command_description: null,
+        command_placeholder: null,
+        tags_label: null,
+        tags_description: null,
+        tags_placeholder: null,
+        visibility_label: null,
+        public_description: null,
+        private_description: null,
+        publish_button: null,
+        submitting: null,
+        prompt_label: null,
+        prompt_description: null,
+        prompt_placeholder: null,
+      },
     },
   },
 };

From 5aaa26be458737fb82cf9b537ff6ccb497a9aada Mon Sep 17 00:00:00 2001
From: timothycarambat <rambat1010@gmail.com>
Date: Tue, 24 Jun 2025 16:15:35 -0700
Subject: [PATCH 20/20] show command, non editable

---
 .../SlashCommands/index.jsx                   | 29 ++++---------------
 1 file changed, 5 insertions(+), 24 deletions(-)

diff --git a/frontend/src/components/CommunityHub/PublishEntityModal/SlashCommands/index.jsx b/frontend/src/components/CommunityHub/PublishEntityModal/SlashCommands/index.jsx
index 72a444a200e..44111373f55 100644
--- a/frontend/src/components/CommunityHub/PublishEntityModal/SlashCommands/index.jsx
+++ b/frontend/src/components/CommunityHub/PublishEntityModal/SlashCommands/index.jsx
@@ -24,7 +24,7 @@ export default function SlashCommands({ entity }) {
       const data = {
         name: form.get("name"),
         description: form.get("description"),
-        command: form.get("command"),
+        command: entity.command,
         prompt: form.get("prompt"),
         tags: tags,
         visibility: visibility,
@@ -90,8 +90,11 @@ export default function SlashCommands({ entity }) {
   return (
     <>
       <div className="w-full flex gap-x-2 items-center mb-3 -mt-8">
-        <h3 className="text-xl font-semibold text-theme-text-primary px-6 py-3">
+        <h3 className="text-xl font-semibold text-theme-text-primary px-6 py-3 flex items-center gap-x-2">
           {t("community_hub.publish.slash_command.modal_title")}
+          <code className="bg-theme-bg-secondary rounded-lg px-1 text-theme-text-secondary text-lg font-mono">
+            {entity.command}
+          </code>
         </h3>
       </div>
       <form ref={formRef} className="flex" onSubmit={handleSubmit}>
@@ -136,28 +139,6 @@ export default function SlashCommands({ entity }) {
               className="w-full bg-theme-bg-secondary rounded-lg p-2 text-white text-sm focus:outline-primary-button active:outline-primary-button outline-none min-h-[80px] placeholder:text-theme-text-placeholder"
             />
           </div>
-
-          <div>
-            <label className="block text-sm font-semibold text-theme-text-primary mb-1">
-              {t("community_hub.publish.slash_command.command_label")}
-            </label>
-            <div className="text-xs text-white/60 mb-2">
-              {t("community_hub.publish.slash_command.command_description")}
-            </div>
-            <input
-              type="text"
-              name="command"
-              required
-              minLength={1}
-              maxLength={50}
-              defaultValue={entity.command}
-              placeholder={t(
-                "community_hub.publish.slash_command.command_placeholder"
-              )}
-              className="w-full bg-theme-bg-secondary rounded-lg p-2 text-theme-text-primary text-sm focus:outline-primary-button active:outline-primary-button outline-none placeholder:text-theme-text-placeholder"
-            />
-          </div>
-
           <div>
             <label className="block text-sm font-semibold text-white mb-1">
               {t("community_hub.publish.slash_command.tags_label")}