feat: toolbox

dist/copilot_web/App-C63BiJGs.js

@@ -1,7 +1,7 @@
 function getImportPath(filename) {
             return `./${filename}`;
         }
-            const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["copilot_web/workflowChat-jf_INBjK.js","copilot_web/vendor-markdown-CBmlBP6m.js","copilot_web/vendor-react-Dixhfmvb.js","copilot_web/message-components-C71cmLNF.js","copilot_web/input.js","copilot_web/assets/input-Hq2IJQBE.css","copilot_web/fonts.css"].map(path => {
+            const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["copilot_web/workflowChat-CgY47VFE.js","copilot_web/vendor-markdown-CBmlBP6m.js","copilot_web/vendor-react-Dixhfmvb.js","copilot_web/message-components-C71cmLNF.js","copilot_web/input.js","copilot_web/assets/input-Hq2IJQBE.css","copilot_web/fonts.css"].map(path => {
                         const apiBase = window.comfyAPI?.api?.api?.api_base;
                         if (apiBase) {
                             // 有 API base 时，使用完整路径
@@ -11,4 +11,4 @@ function getImportPath(filename) {
                             return `./${path}`;
                         }
                     }))))=>i.map(i=>d[i]);
-import{_ as a}from"./input.js";import{j as e}from"./vendor-markdown-CBmlBP6m.js";import{r as t,R as i}from"./vendor-react-Dixhfmvb.js";import{C as n}from"./message-components-C71cmLNF.js";/* empty css     */const o={EXPLAIN_NODE:"copilot:explain-node"},d=i.lazy(()=>a(()=>import(getImportPath("workflowChat-jf_INBjK.js")),__vite__mapDeps([0,1,2,3,4,5,6])).then(r=>({default:r.default})));function p(){const[r,s]=t.useState(!1);return t.useEffect(()=>{const l=()=>{s(!0)};return window.addEventListener(o.EXPLAIN_NODE,l),()=>window.removeEventListener(o.EXPLAIN_NODE,l)},[]),e.jsx(n,{children:e.jsx("div",{className:"h-full w-full flex flex-col",children:e.jsx(t.Suspense,{fallback:e.jsx("div",{className:"h-full w-full flex items-center justify-center",children:"Loading..."}),children:e.jsx(d,{visible:!0,triggerUsage:r,onUsageTriggered:()=>s(!1)})})})})}export{p as default};
+import{_ as a}from"./input.js";import{j as e}from"./vendor-markdown-CBmlBP6m.js";import{r as t,R as i}from"./vendor-react-Dixhfmvb.js";import{C as n}from"./message-components-C71cmLNF.js";/* empty css     */const o={EXPLAIN_NODE:"copilot:explain-node"},d=i.lazy(()=>a(()=>import(getImportPath("workflowChat-CgY47VFE.js")),__vite__mapDeps([0,1,2,3,4,5,6])).then(r=>({default:r.default})));function p(){const[r,s]=t.useState(!1);return t.useEffect(()=>{const l=()=>{s(!0)};return window.addEventListener(o.EXPLAIN_NODE,l),()=>window.removeEventListener(o.EXPLAIN_NODE,l)},[]),e.jsx(n,{children:e.jsx("div",{className:"h-full w-full flex flex-col",children:e.jsx(t.Suspense,{fallback:e.jsx("div",{className:"h-full w-full flex items-center justify-center",children:"Loading..."}),children:e.jsx(d,{visible:!0,triggerUsage:r,onUsageTriggered:()=>s(!1)})})})})}export{p as default};

ui/src/constants/enums.ts

@@ -0,0 +1,11 @@
+export const enum TOOLBOX_IDS { 
+  USAGE = 'CopilotToolboxUsage',
+  PARAMETERS = 'CopilotToolboxParameters',
+  DOWNSTREAMNODES = 'CopilotToolboxDownstreamNodes'
+}
+
+export const enum TOOLBOX_LABELS {
+  USAGE = 'Usage',
+  PARAMETERS = 'Parameters',
+  DOWNSTREAMNODES = 'Downstream Nodes'
+}

ui/src/main.tsx

@@ -8,6 +8,7 @@ import { waitForApp } from "./utils/comfyapp.ts";
 import "./scoped-tailwind.css";
 import { app } from "./utils/comfyapp";
 import "./fonts.css";
+import { TOOLBOX_IDS, TOOLBOX_LABELS } from './constants/enums.ts';
 
 const App = React.lazy(() =>
   import("./App.tsx").then(({ default: App }) => ({
@@ -51,6 +52,44 @@ waitForDocumentBody()
         );
       },
     });
+  }).then(() => {
+    app.registerExtension({
+      name: 'Copilot_Toolbox',
+      commands: [
+        {
+          id: TOOLBOX_IDS.USAGE,
+          label: TOOLBOX_LABELS.USAGE,
+          icon: 'pi pi-server',
+          function: () => {
+            // Command logic here
+            console.log('-call-->')
+          }
+        },
+        {
+          id: TOOLBOX_IDS.PARAMETERS,
+          label: TOOLBOX_LABELS.PARAMETERS,
+          icon: 'pi pi-book',
+          function: () => {
+            // Command logic here
+            console.log('-call-->')
+          }
+        },
+        {
+          id: 'Downstream_Nodes',
+          label: 'Downstream Nodes',
+          icon: 'pi pi-arrow-circle-right',
+          tooltip: '111',
+          function: () => {
+            // Command logic here
+            console.log('-call-->')
+          }
+        }
+      ],
+      // Return an array of command IDs to show in the selection toolbox
+      // when an item is selected
+      getSelectionToolboxCommands: (selectedItem: any) => [TOOLBOX_IDS.USAGE, TOOLBOX_IDS.PARAMETERS, 'Downstream_Nodes']
+    })
+    console.log('111-->', app.extensionManager.getSidebarTabs());
   })
   // .then(() => {
   //   app.extensionManager.setting.set('Comfy.Sidebar.Location', 'left');

ui/src/workflowChat/workflowChat.tsx

@@ -177,11 +177,11 @@ export default function WorkflowChat({ onClose, visible = true, triggerUsage = f
 
     // 使用自定义 hooks
 
-    useEffect(() => {
-        if (messageDivRef.current) {
-            messageDivRef.current.scrollTop = messageDivRef.current.scrollHeight
-        }
-    }, [messages])
+    // useEffect(() => {
+    //     if (messageDivRef.current) {
+    //         messageDivRef.current.scrollTop = messageDivRef.current.scrollHeight
+    //     }
+    // }, [messages])
 
     useEffect(() => {
         if (activeTab !== 'chat') return;