fix: open assets tab when QPO V2 enabled

This commit is contained in:
Benjamin Lu
2026-01-22 19:00:55 -08:00
parent 219d86db2c
commit 8c74a03471
2 changed files with 57 additions and 4 deletions

View File

@@ -11,7 +11,9 @@ import type {
JobListItem, JobListItem,
JobStatus JobStatus
} from '@/platform/remote/comfyui/jobs/jobTypes' } from '@/platform/remote/comfyui/jobs/jobTypes'
import { useSettingStore } from '@/platform/settings/settingStore'
import { TaskItemImpl, useQueueStore } from '@/stores/queueStore' import { TaskItemImpl, useQueueStore } from '@/stores/queueStore'
import { useSidebarTabStore } from '@/stores/workspace/sidebarTabStore'
import { isElectron } from '@/utils/envUtil' import { isElectron } from '@/utils/envUtil'
const mockData = vi.hoisted(() => ({ isLoggedIn: false })) const mockData = vi.hoisted(() => ({ isLoggedIn: false }))
@@ -32,7 +34,7 @@ vi.mock('@/stores/firebaseAuthStore', () => ({
})) }))
})) }))
function createWrapper() { function createWrapper(pinia = createTestingPinia({ createSpy: vi.fn })) {
const i18n = createI18n({ const i18n = createI18n({
legacy: false, legacy: false,
locale: 'en', locale: 'en',
@@ -51,7 +53,7 @@ function createWrapper() {
return mount(TopMenuSection, { return mount(TopMenuSection, {
global: { global: {
plugins: [createTestingPinia({ createSpy: vi.fn }), i18n], plugins: [pinia, i18n],
stubs: { stubs: {
SubgraphBreadcrumb: true, SubgraphBreadcrumb: true,
QueueProgressOverlay: true, QueueProgressOverlay: true,
@@ -134,4 +136,36 @@ describe('TopMenuSection', () => {
const queueButton = wrapper.find('[data-testid="queue-overlay-toggle"]') const queueButton = wrapper.find('[data-testid="queue-overlay-toggle"]')
expect(queueButton.text()).toContain('3 active') expect(queueButton.text()).toContain('3 active')
}) })
it('hides queue progress overlay when QPO V2 is enabled', async () => {
const pinia = createTestingPinia({ createSpy: vi.fn })
const settingStore = useSettingStore(pinia)
vi.mocked(settingStore.get).mockImplementation((key) =>
key === 'Comfy.Queue.QPOV2' ? true : undefined
)
const wrapper = createWrapper(pinia)
await nextTick()
expect(wrapper.find('[data-testid="queue-overlay-toggle"]').exists()).toBe(
true
)
expect(
wrapper.findComponent({ name: 'QueueProgressOverlay' }).exists()
).toBe(false)
})
it('opens the assets sidebar tab when QPO V2 is enabled', async () => {
const pinia = createTestingPinia({ createSpy: vi.fn })
const settingStore = useSettingStore(pinia)
vi.mocked(settingStore.get).mockImplementation((key) =>
key === 'Comfy.Queue.QPOV2' ? true : undefined
)
const wrapper = createWrapper(pinia)
const sidebarTabStore = useSidebarTabStore(pinia)
await wrapper.find('[data-testid="queue-overlay-toggle"]').trigger('click')
expect(sidebarTabStore.activeSidebarTabId).toBe('assets')
})
}) })

View File

@@ -45,7 +45,9 @@
v-tooltip.bottom="queueHistoryTooltipConfig" v-tooltip.bottom="queueHistoryTooltipConfig"
type="destructive" type="destructive"
size="md" size="md"
:aria-pressed="isQueueOverlayExpanded" :aria-pressed="
isQueueProgressOverlayVisible ? isQueueOverlayExpanded : undefined
"
class="px-3" class="px-3"
data-testid="queue-overlay-toggle" data-testid="queue-overlay-toggle"
@click="toggleQueueOverlay" @click="toggleQueueOverlay"
@@ -54,7 +56,11 @@
{{ activeJobsLabel }} {{ activeJobsLabel }}
</span> </span>
<span class="sr-only"> <span class="sr-only">
{{ t('sideToolbar.queueProgressOverlay.expandCollapsedQueue') }} {{
isQueuePanelV2Enabled
? t('sideToolbar.queueProgressOverlay.viewJobHistory')
: t('sideToolbar.queueProgressOverlay.expandCollapsedQueue')
}}
</span> </span>
</Button> </Button>
<CurrentUserButton <CurrentUserButton
@@ -75,6 +81,7 @@
</div> </div>
</div> </div>
<QueueProgressOverlay <QueueProgressOverlay
v-if="isQueueProgressOverlayVisible"
v-model:expanded="isQueueOverlayExpanded" v-model:expanded="isQueueOverlayExpanded"
:menu-hovered="isTopMenuHovered" :menu-hovered="isTopMenuHovered"
/> />
@@ -103,6 +110,7 @@ import { app } from '@/scripts/app'
import { useCommandStore } from '@/stores/commandStore' import { useCommandStore } from '@/stores/commandStore'
import { useQueueStore, useQueueUIStore } from '@/stores/queueStore' import { useQueueStore, useQueueUIStore } from '@/stores/queueStore'
import { useRightSidePanelStore } from '@/stores/workspace/rightSidePanelStore' import { useRightSidePanelStore } from '@/stores/workspace/rightSidePanelStore'
import { useSidebarTabStore } from '@/stores/workspace/sidebarTabStore'
import { useWorkspaceStore } from '@/stores/workspaceStore' import { useWorkspaceStore } from '@/stores/workspaceStore'
import { isElectron } from '@/utils/envUtil' import { isElectron } from '@/utils/envUtil'
import { useConflictAcknowledgment } from '@/workbench/extensions/manager/composables/useConflictAcknowledgment' import { useConflictAcknowledgment } from '@/workbench/extensions/manager/composables/useConflictAcknowledgment'
@@ -120,6 +128,7 @@ const { toastErrorHandler } = useErrorHandling()
const commandStore = useCommandStore() const commandStore = useCommandStore()
const queueStore = useQueueStore() const queueStore = useQueueStore()
const queueUIStore = useQueueUIStore() const queueUIStore = useQueueUIStore()
const sidebarTabStore = useSidebarTabStore()
const { activeJobsCount } = storeToRefs(queueStore) const { activeJobsCount } = storeToRefs(queueStore)
const { isOverlayExpanded: isQueueOverlayExpanded } = storeToRefs(queueUIStore) const { isOverlayExpanded: isQueueOverlayExpanded } = storeToRefs(queueUIStore)
const releaseStore = useReleaseStore() const releaseStore = useReleaseStore()
@@ -138,6 +147,12 @@ const activeJobsLabel = computed(() => {
const isIntegratedTabBar = computed( const isIntegratedTabBar = computed(
() => settingStore.get('Comfy.UI.TabBarLayout') === 'Integrated' () => settingStore.get('Comfy.UI.TabBarLayout') === 'Integrated'
) )
const isQueuePanelV2Enabled = computed(() =>
settingStore.get('Comfy.Queue.QPOV2')
)
const isQueueProgressOverlayVisible = computed(
() => !isQueuePanelV2Enabled.value
)
const queueHistoryTooltipConfig = computed(() => const queueHistoryTooltipConfig = computed(() =>
buildTooltipConfig(t('sideToolbar.queueProgressOverlay.viewJobHistory')) buildTooltipConfig(t('sideToolbar.queueProgressOverlay.viewJobHistory'))
) )
@@ -167,6 +182,10 @@ onMounted(() => {
}) })
const toggleQueueOverlay = () => { const toggleQueueOverlay = () => {
if (isQueuePanelV2Enabled.value) {
sidebarTabStore.activeSidebarTabId = 'assets'
return
}
commandStore.execute('Comfy.Queue.ToggleOverlay') commandStore.execute('Comfy.Queue.ToggleOverlay')
} }