mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-04-27 09:45:13 +00:00
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:
@@ -92,7 +92,8 @@ import { useCurrentUser } from '@/composables/auth/useCurrentUser'
|
|||||||
import { useErrorHandling } from '@/composables/useErrorHandling'
|
import { useErrorHandling } from '@/composables/useErrorHandling'
|
||||||
import { buildTooltipConfig } from '@/composables/useTooltipConfig'
|
import { buildTooltipConfig } from '@/composables/useTooltipConfig'
|
||||||
import { app } from '@/scripts/app'
|
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 { useRightSidePanelStore } from '@/stores/workspace/rightSidePanelStore'
|
||||||
import { useWorkspaceStore } from '@/stores/workspaceStore'
|
import { useWorkspaceStore } from '@/stores/workspaceStore'
|
||||||
import { isElectron } from '@/utils/envUtil'
|
import { isElectron } from '@/utils/envUtil'
|
||||||
@@ -106,8 +107,10 @@ const { isLoggedIn } = useCurrentUser()
|
|||||||
const isDesktop = isElectron()
|
const isDesktop = isElectron()
|
||||||
const { t } = useI18n()
|
const { t } = useI18n()
|
||||||
const { toastErrorHandler } = useErrorHandling()
|
const { toastErrorHandler } = useErrorHandling()
|
||||||
const isQueueOverlayExpanded = ref(false)
|
const commandStore = useCommandStore()
|
||||||
const queueStore = useQueueStore()
|
const queueStore = useQueueStore()
|
||||||
|
const queueUIStore = useQueueUIStore()
|
||||||
|
const { isOverlayExpanded: isQueueOverlayExpanded } = storeToRefs(queueUIStore)
|
||||||
const isTopMenuHovered = ref(false)
|
const isTopMenuHovered = ref(false)
|
||||||
const queuedCount = computed(() => queueStore.pendingTasks.length)
|
const queuedCount = computed(() => queueStore.pendingTasks.length)
|
||||||
const queueHistoryTooltipConfig = computed(() =>
|
const queueHistoryTooltipConfig = computed(() =>
|
||||||
@@ -133,7 +136,7 @@ onMounted(() => {
|
|||||||
})
|
})
|
||||||
|
|
||||||
const toggleQueueOverlay = () => {
|
const toggleQueueOverlay = () => {
|
||||||
isQueueOverlayExpanded.value = !isQueueOverlayExpanded.value
|
commandStore.execute('Comfy.Queue.ToggleOverlay')
|
||||||
}
|
}
|
||||||
|
|
||||||
const openCustomNodeManager = async () => {
|
const openCustomNodeManager = async () => {
|
||||||
|
|||||||
@@ -39,7 +39,11 @@ import { useLitegraphService } from '@/services/litegraphService'
|
|||||||
import type { ComfyCommand } from '@/stores/commandStore'
|
import type { ComfyCommand } from '@/stores/commandStore'
|
||||||
import { useExecutionStore } from '@/stores/executionStore'
|
import { useExecutionStore } from '@/stores/executionStore'
|
||||||
import { useHelpCenterStore } from '@/stores/helpCenterStore'
|
import { useHelpCenterStore } from '@/stores/helpCenterStore'
|
||||||
import { useQueueSettingsStore, useQueueStore } from '@/stores/queueStore'
|
import {
|
||||||
|
useQueueSettingsStore,
|
||||||
|
useQueueStore,
|
||||||
|
useQueueUIStore
|
||||||
|
} from '@/stores/queueStore'
|
||||||
import { useSubgraphNavigationStore } from '@/stores/subgraphNavigationStore'
|
import { useSubgraphNavigationStore } from '@/stores/subgraphNavigationStore'
|
||||||
import { useSubgraphStore } from '@/stores/subgraphStore'
|
import { useSubgraphStore } from '@/stores/subgraphStore'
|
||||||
import { useBottomPanelStore } from '@/stores/workspace/bottomPanelStore'
|
import { useBottomPanelStore } from '@/stores/workspace/bottomPanelStore'
|
||||||
@@ -423,6 +427,18 @@ export function useCoreCommands(): ComfyCommand[] {
|
|||||||
},
|
},
|
||||||
active: () => useSettingStore().get('Comfy.Minimap.Visible')
|
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',
|
id: 'Comfy.QueuePrompt',
|
||||||
icon: 'pi pi-play',
|
icon: 'pi pi-play',
|
||||||
|
|||||||
@@ -1037,6 +1037,8 @@
|
|||||||
"copyErrorMessage": "Copy error message",
|
"copyErrorMessage": "Copy error message",
|
||||||
"reportError": "Report error"
|
"reportError": "Report error"
|
||||||
},
|
},
|
||||||
|
"toggleJobHistory": "Toggle Job History",
|
||||||
|
"jobHistory": "Job History",
|
||||||
"jobList": {
|
"jobList": {
|
||||||
"undated": "Undated",
|
"undated": "Undated",
|
||||||
"sortMostRecent": "Most recent",
|
"sortMostRecent": "Most recent",
|
||||||
|
|||||||
@@ -618,3 +618,13 @@ export const useQueueSettingsStore = defineStore('queueSettingsStore', {
|
|||||||
batchCount: 1
|
batchCount: 1
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
|
||||||
|
export const useQueueUIStore = defineStore('queueUIStore', () => {
|
||||||
|
const isOverlayExpanded = ref(false)
|
||||||
|
|
||||||
|
function toggleOverlay() {
|
||||||
|
isOverlayExpanded.value = !isOverlayExpanded.value
|
||||||
|
}
|
||||||
|
|
||||||
|
return { isOverlayExpanded, toggleOverlay }
|
||||||
|
})
|
||||||
|
|||||||
Reference in New Issue
Block a user