feat: add Comfy.Queue.ToggleOverlay command for job history panel (#7805)

## Summary

Move queue overlay expanded state from local ref to useQueueUIStore,
enabling command-based control similar to minimap toggle. fix #7803 

## Screenshots


https://github.com/user-attachments/assets/d79927ea-0b7e-44c5-bfaf-2f50dcc012ab

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7805-feat-add-Comfy-Queue-ToggleOverlay-command-for-job-history-panel-2d96d73d365081018916ef490d57ce92)
by [Unito](https://www.unito.io)

---------

Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
This commit is contained in:
Kelly Yang
2026-01-05 10:25:53 -08:00
committed by GitHub
parent 87f560c713
commit 05028894e5
4 changed files with 35 additions and 4 deletions

View File

@@ -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 () => {

View File

@@ -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',

View File

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

View File

@@ -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 }
})