feat: add Comfy.Queue.ToggleOverlay command for job history panel

src/components/TopMenuSection.vue

@@ -92,7 +92,8 @@ import { useCurrentUser } from '@/composables/auth/useCurrentUser'
 import { useErrorHandling } from '@/composables/useErrorHandling'
 import { buildTooltipConfig } from '@/composables/useTooltipConfig'
 import { app } from '@/scripts/app'
-import { useQueueStore } from '@/stores/queueStore'
+import { useCommandStore } from '@/stores/commandStore'
+import { useQueueStore, useQueueUIStore } from '@/stores/queueStore'
 import { useRightSidePanelStore } from '@/stores/workspace/rightSidePanelStore'
 import { useWorkspaceStore } from '@/stores/workspaceStore'
 import { isElectron } from '@/utils/envUtil'
@@ -106,8 +107,10 @@ const { isLoggedIn } = useCurrentUser()
 const isDesktop = isElectron()
 const { t } = useI18n()
 const { toastErrorHandler } = useErrorHandling()
-const isQueueOverlayExpanded = ref(false)
+const commandStore = useCommandStore()
 const queueStore = useQueueStore()
+const queueUIStore = useQueueUIStore()
+const { isOverlayExpanded: isQueueOverlayExpanded } = storeToRefs(queueUIStore)
 const isTopMenuHovered = ref(false)
 const queuedCount = computed(() => queueStore.pendingTasks.length)
 const queueHistoryTooltipConfig = computed(() =>
@@ -133,7 +136,7 @@ onMounted(() => {
 })
 
 const toggleQueueOverlay = () => {
-  isQueueOverlayExpanded.value = !isQueueOverlayExpanded.value
+  commandStore.execute('Comfy.Queue.ToggleOverlay')
 }
 
 const openCustomNodeManager = async () => {

src/composables/useCoreCommands.ts

@@ -39,7 +39,11 @@ import { useLitegraphService } from '@/services/litegraphService'
 import type { ComfyCommand } from '@/stores/commandStore'
 import { useExecutionStore } from '@/stores/executionStore'
 import { useHelpCenterStore } from '@/stores/helpCenterStore'
-import { useQueueSettingsStore, useQueueStore } from '@/stores/queueStore'
+import {
+  useQueueSettingsStore,
+  useQueueStore,
+  useQueueUIStore
+} from '@/stores/queueStore'
 import { useSubgraphNavigationStore } from '@/stores/subgraphNavigationStore'
 import { useSubgraphStore } from '@/stores/subgraphStore'
 import { useBottomPanelStore } from '@/stores/workspace/bottomPanelStore'
@@ -423,6 +427,18 @@ export function useCoreCommands(): ComfyCommand[] {
       },
       active: () => useSettingStore().get('Comfy.Minimap.Visible')
     },
+    {
+      id: 'Comfy.Queue.ToggleOverlay',
+      icon: 'pi pi-history',
+      label: () => t('queue.toggleJobHistory'),
+      menubarLabel: () => t('queue.jobHistory'),
+      versionAdded: '1.37.0',
+      category: 'view-controls' as const,
+      function: () => {
+        useQueueUIStore().toggleOverlay()
+      },
+      active: () => useQueueUIStore().isOverlayExpanded
+    },
     {
       id: 'Comfy.QueuePrompt',
       icon: 'pi pi-play',

src/locales/en/main.json

@@ -1037,6 +1037,8 @@
       "copyErrorMessage": "Copy error message",
       "reportError": "Report error"
     },
+    "toggleJobHistory": "Toggle Job History",
+    "jobHistory": "Job History",
     "jobList": {
       "undated": "Undated",
       "sortMostRecent": "Most recent",

src/stores/queueStore.ts

@@ -618,3 +618,13 @@ export const useQueueSettingsStore = defineStore('queueSettingsStore', {
     batchCount: 1
   })
 })
+
+export const useQueueUIStore = defineStore('queueUIStore', () => {
+  const isOverlayExpanded = ref(false)
+
+  function toggleOverlay() {
+    isOverlayExpanded.value = !isOverlayExpanded.value
+  }
+
+  return { isOverlayExpanded, toggleOverlay }
+})