mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-02-09 01:20:09 +00:00
fix: hide assets sidebar badge when legacy queue is enabled (#8708)
### Motivation - The Assets sidebar shows a notification-style badge immediately when a job is queued using the legacy queue, which is misleading because that badge is intended for the newer Queue Panel V2 experience. ### Description - Gate the Assets sidebar `iconBadge` on the `Comfy.Queue.QPOV2` setting by importing `useSettingStore` and returning `null` when QPO V2 is disabled; otherwise show `pendingTasks.length` as before (`src/composables/sidebarTabs/useAssetsSidebarTab.ts`). - Add a focused unit test that mocks the settings and queue store to verify the badge is hidden when QPO V2 is disabled and shows the pending count when enabled (`src/composables/sidebarTabs/useAssetsSidebarTab.test.ts`). - Keep the Assets component import mocked in the test to avoid bootstrapping the full UI during unit runs. ### Testing - Ran the new unit test with `pnpm vitest src/composables/sidebarTabs/useAssetsSidebarTab.test.ts` and it passed (2 tests). - Ran type checking with `pnpm typecheck` and it completed successfully. - Ran linting with `pnpm lint` and no errors were reported. ------ [Codex Task](https://chatgpt.com/codex/tasks/task_e_69867f4ceaac8330b9806d5b51006a6a) ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-8708-fix-hide-assets-sidebar-badge-when-legacy-queue-is-enabled-3006d73d3650818eb809de399583088e) by [Unito](https://www.unito.io)
This commit is contained in:
46
src/composables/sidebarTabs/useAssetsSidebarTab.test.ts
Normal file
46
src/composables/sidebarTabs/useAssetsSidebarTab.test.ts
Normal file
@@ -0,0 +1,46 @@
|
||||
import { describe, expect, it, vi } from 'vitest'
|
||||
|
||||
import { useAssetsSidebarTab } from '@/composables/sidebarTabs/useAssetsSidebarTab'
|
||||
|
||||
const { mockGetSetting, mockPendingTasks } = vi.hoisted(() => ({
|
||||
mockGetSetting: vi.fn(),
|
||||
mockPendingTasks: [] as unknown[]
|
||||
}))
|
||||
|
||||
vi.mock('@/platform/settings/settingStore', () => ({
|
||||
useSettingStore: () => ({
|
||||
get: mockGetSetting
|
||||
})
|
||||
}))
|
||||
|
||||
vi.mock('@/components/sidebar/tabs/AssetsSidebarTab.vue', () => ({
|
||||
default: {}
|
||||
}))
|
||||
|
||||
vi.mock('@/stores/queueStore', () => ({
|
||||
useQueueStore: () => ({
|
||||
pendingTasks: mockPendingTasks
|
||||
})
|
||||
}))
|
||||
|
||||
describe('useAssetsSidebarTab', () => {
|
||||
it('hides icon badge when QPO V2 is disabled', () => {
|
||||
mockGetSetting.mockReturnValue(false)
|
||||
mockPendingTasks.splice(0, mockPendingTasks.length, {}, {})
|
||||
|
||||
const sidebarTab = useAssetsSidebarTab()
|
||||
|
||||
expect(typeof sidebarTab.iconBadge).toBe('function')
|
||||
expect((sidebarTab.iconBadge as () => string | null)()).toBeNull()
|
||||
})
|
||||
|
||||
it('shows pending task count when QPO V2 is enabled', () => {
|
||||
mockGetSetting.mockReturnValue(true)
|
||||
mockPendingTasks.splice(0, mockPendingTasks.length, {}, {}, {})
|
||||
|
||||
const sidebarTab = useAssetsSidebarTab()
|
||||
|
||||
expect(typeof sidebarTab.iconBadge).toBe('function')
|
||||
expect((sidebarTab.iconBadge as () => string | null)()).toBe('3')
|
||||
})
|
||||
})
|
||||
@@ -1,6 +1,7 @@
|
||||
import { markRaw } from 'vue'
|
||||
|
||||
import AssetsSidebarTab from '@/components/sidebar/tabs/AssetsSidebarTab.vue'
|
||||
import { useSettingStore } from '@/platform/settings/settingStore'
|
||||
import { useQueueStore } from '@/stores/queueStore'
|
||||
import type { SidebarTabExtension } from '@/types/extensionTypes'
|
||||
|
||||
@@ -14,6 +15,12 @@ export const useAssetsSidebarTab = (): SidebarTabExtension => {
|
||||
component: markRaw(AssetsSidebarTab),
|
||||
type: 'vue',
|
||||
iconBadge: () => {
|
||||
const settingStore = useSettingStore()
|
||||
|
||||
if (!settingStore.get('Comfy.Queue.QPOV2')) {
|
||||
return null
|
||||
}
|
||||
|
||||
const queueStore = useQueueStore()
|
||||
return queueStore.pendingTasks.length > 0
|
||||
? queueStore.pendingTasks.length.toString()
|
||||
|
||||
Reference in New Issue
Block a user