Rework command menu extension API (#1144)

* Rework command menu API

* Update test

* Update README

* Prevent register other extension's command

src/stores/extensionStore.ts

@@ -5,6 +5,7 @@ import { useKeybindingStore } from './keybindingStore'
 import { useCommandStore } from './commandStore'
 import { useSettingStore } from './settingStore'
 import { app } from '@/scripts/app'
+import { useMenuItemStore } from './menuItemStore'
 
 export const useExtensionStore = defineStore('extension', () => {
   // For legacy reasons, the name uniquely identifies an extension
@@ -45,6 +46,7 @@ export const useExtensionStore = defineStore('extension', () => {
     extensionByName.value[extension.name] = markRaw(extension)
     useKeybindingStore().loadExtensionKeybindings(extension)
     useCommandStore().loadExtensionCommands(extension)
+    useMenuItemStore().loadExtensionMenuCommands(extension)
 
     /*
      * Extensions are currently stored in both extensionStore and app.extensions.

src/stores/menuItemStore.ts

@@ -1,7 +1,8 @@
 import { defineStore } from 'pinia'
 import type { MenuItem } from 'primevue/menuitem'
 import { ref } from 'vue'
-import { type ComfyCommand, useCommandStore } from './commandStore'
+import { useCommandStore } from './commandStore'
+import { ComfyExtension } from '@/types/comfy'
 
 export const useMenuItemStore = defineStore('menuItem', () => {
   const commandStore = useCommandStore()
@@ -42,18 +43,9 @@ export const useMenuItemStore = defineStore('menuItem', () => {
     currentLevel.push(...items)
   }
 
-  const registerCommands = (path: string[], commands: ComfyCommand[]) => {
-    // Register commands that are not already registered
-    for (const command of commands) {
-      if (commandStore.isRegistered(command.id)) {
-        continue
-      }
-      commandStore.registerCommand(command)
-    }
-
-    const items = commands
-      // Convert command to commandImpl
-      .map((command) => commandStore.getCommand(command.id))
+  const registerCommands = (path: string[], commandIds: string[]) => {
+    const items = commandIds
+      .map((commandId) => commandStore.getCommand(commandId))
       .map(
         (command) =>
           ({
@@ -67,41 +59,49 @@ export const useMenuItemStore = defineStore('menuItem', () => {
     registerMenuGroup(path, items)
   }
 
-  registerCommands(
-    ['Workflow'],
-    [commandStore.getCommand('Comfy.NewBlankWorkflow')]
-  )
+  const loadExtensionMenuCommands = (extension: ComfyExtension) => {
+    if (!extension.menuCommands) {
+      return
+    }
+
+    const extensionCommandIds = new Set(
+      extension.commands?.map((command) => command.id) ?? []
+    )
+    extension.menuCommands.forEach((menuCommand) => {
+      const commands = menuCommand.commands.filter((command) =>
+        extensionCommandIds.has(command)
+      )
+      if (commands.length) {
+        registerCommands(menuCommand.path, commands)
+      }
+    })
+  }
+
+  // Core menu commands
+  registerCommands(['Workflow'], ['Comfy.NewBlankWorkflow'])
 
   registerCommands(
     ['Workflow'],
-    [
-      commandStore.getCommand('Comfy.OpenWorkflow'),
-      commandStore.getCommand('Comfy.BrowseTemplates')
-    ]
+    ['Comfy.OpenWorkflow', 'Comfy.BrowseTemplates']
   )
   registerCommands(
     ['Workflow'],
     [
-      commandStore.getCommand('Comfy.SaveWorkflow'),
-      commandStore.getCommand('Comfy.SaveWorkflowAs'),
-      commandStore.getCommand('Comfy.ExportWorkflow'),
-      commandStore.getCommand('Comfy.ExportWorkflowAPI')
+      'Comfy.SaveWorkflow',
+      'Comfy.SaveWorkflowAs',
+      'Comfy.ExportWorkflow',
+      'Comfy.ExportWorkflowAPI'
     ]
   )
 
-  registerCommands(
-    ['Edit'],
-    [
-      commandStore.getCommand('Comfy.Undo'),
-      commandStore.getCommand('Comfy.Redo')
-    ]
-  )
-  registerCommands(['Edit'], [commandStore.getCommand('Comfy.ClearWorkflow')])
-  registerCommands(['Edit'], [commandStore.getCommand('Comfy.OpenClipspace')])
+  registerCommands(['Edit'], ['Comfy.Undo', 'Comfy.Redo'])
+  registerCommands(['Edit'], ['Comfy.ClearWorkflow'])
+  registerCommands(['Edit'], ['Comfy.OpenClipspace'])
 
   return {
     menuItems,
     registerMenuGroup,
-    registerCommands
+    registerCommands,
+    loadExtensionMenuCommands
   }
 })

src/stores/workspaceStateStore.ts

@@ -2,7 +2,6 @@ import type { SidebarTabExtension, ToastManager } from '@/types/extensionTypes'
 import { defineStore } from 'pinia'
 import { useToastStore } from './toastStore'
 import { useQueueSettingsStore } from './queueStore'
-import { useMenuItemStore } from './menuItemStore'
 import { useCommandStore } from './commandStore'
 import { useSidebarTabStore } from './workspace/sidebarTabStore'
 
@@ -21,11 +20,6 @@ export const useWorkspaceStore = defineStore('workspace', {
     queueSettings() {
       return useQueueSettingsStore()
     },
-    menu() {
-      return {
-        registerTopbarCommands: useMenuItemStore().registerCommands
-      }
-    },
     command() {
       return {
         execute: useCommandStore().execute