Complete PR #4654 integration with manager migration

✅ Successfully integrated conflict detection with task queue system
✅ Both systems work together seamlessly
✅ All merge conflicts resolved
✅ Generated types and locales properly merged

Note: Test updates needed for API changes (to be addressed in semantic review)

tests-ui/tests/composables/nodePack/usePacksSelection.test.ts

@@ -0,0 +1,378 @@
+import { createPinia, setActivePinia } from 'pinia'
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
+import { ref } from 'vue'
+
+import { usePacksSelection } from '@/composables/nodePack/usePacksSelection'
+import { useComfyManagerStore } from '@/stores/comfyManagerStore'
+import type { components } from '@/types/comfyRegistryTypes'
+
+vi.mock('vue-i18n', async () => {
+  const actual = await vi.importActual('vue-i18n')
+  return {
+    ...actual,
+    useI18n: () => ({
+      t: vi.fn((key) => key)
+    })
+  }
+})
+
+type NodePack = components['schemas']['Node']
+
+describe('usePacksSelection', () => {
+  let managerStore: ReturnType<typeof useComfyManagerStore>
+  let mockIsPackInstalled: ReturnType<typeof vi.fn>
+
+  const createMockPack = (id: string): NodePack => ({
+    id,
+    name: `Pack ${id}`,
+    description: `Description for pack ${id}`,
+    category: 'Nodes',
+    author: 'Test Author',
+    license: 'MIT',
+    repository: 'https://github.com/test/pack',
+    tags: [],
+    status: 'NodeStatusActive'
+  })
+
+  beforeEach(() => {
+    vi.clearAllMocks()
+    const pinia = createPinia()
+    setActivePinia(pinia)
+
+    managerStore = useComfyManagerStore()
+
+    // Mock the isPackInstalled method
+    mockIsPackInstalled = vi.fn()
+    managerStore.isPackInstalled = mockIsPackInstalled
+  })
+
+  afterEach(() => {
+    vi.restoreAllMocks()
+  })
+
+  describe('installedPacks', () => {
+    it('should filter and return only installed packs', () => {
+      const nodePacks = ref<NodePack[]>([
+        createMockPack('pack1'),
+        createMockPack('pack2'),
+        createMockPack('pack3')
+      ])
+
+      mockIsPackInstalled.mockImplementation((id: string) => {
+        return id === 'pack1' || id === 'pack3'
+      })
+
+      const { installedPacks } = usePacksSelection(nodePacks)
+
+      expect(installedPacks.value).toHaveLength(2)
+      expect(installedPacks.value[0].id).toBe('pack1')
+      expect(installedPacks.value[1].id).toBe('pack3')
+      expect(mockIsPackInstalled).toHaveBeenCalledTimes(3)
+    })
+
+    it('should return empty array when no packs are installed', () => {
+      const nodePacks = ref<NodePack[]>([
+        createMockPack('pack1'),
+        createMockPack('pack2')
+      ])
+
+      mockIsPackInstalled.mockReturnValue(false)
+
+      const { installedPacks } = usePacksSelection(nodePacks)
+
+      expect(installedPacks.value).toHaveLength(0)
+    })
+
+    it('should update when nodePacks ref changes', () => {
+      const nodePacks = ref<NodePack[]>([createMockPack('pack1')])
+      mockIsPackInstalled.mockReturnValue(true)
+
+      const { installedPacks } = usePacksSelection(nodePacks)
+      expect(installedPacks.value).toHaveLength(1)
+
+      // Add more packs
+      nodePacks.value = [
+        createMockPack('pack1'),
+        createMockPack('pack2'),
+        createMockPack('pack3')
+      ]
+
+      expect(installedPacks.value).toHaveLength(3)
+    })
+  })
+
+  describe('notInstalledPacks', () => {
+    it('should filter and return only not installed packs', () => {
+      const nodePacks = ref<NodePack[]>([
+        createMockPack('pack1'),
+        createMockPack('pack2'),
+        createMockPack('pack3')
+      ])
+
+      mockIsPackInstalled.mockImplementation((id: string) => {
+        return id === 'pack1'
+      })
+
+      const { notInstalledPacks } = usePacksSelection(nodePacks)
+
+      expect(notInstalledPacks.value).toHaveLength(2)
+      expect(notInstalledPacks.value[0].id).toBe('pack2')
+      expect(notInstalledPacks.value[1].id).toBe('pack3')
+    })
+
+    it('should return all packs when none are installed', () => {
+      const nodePacks = ref<NodePack[]>([
+        createMockPack('pack1'),
+        createMockPack('pack2')
+      ])
+
+      mockIsPackInstalled.mockReturnValue(false)
+
+      const { notInstalledPacks } = usePacksSelection(nodePacks)
+
+      expect(notInstalledPacks.value).toHaveLength(2)
+    })
+  })
+
+  describe('isAllInstalled', () => {
+    it('should return true when all packs are installed', () => {
+      const nodePacks = ref<NodePack[]>([
+        createMockPack('pack1'),
+        createMockPack('pack2')
+      ])
+
+      mockIsPackInstalled.mockReturnValue(true)
+
+      const { isAllInstalled } = usePacksSelection(nodePacks)
+
+      expect(isAllInstalled.value).toBe(true)
+    })
+
+    it('should return false when not all packs are installed', () => {
+      const nodePacks = ref<NodePack[]>([
+        createMockPack('pack1'),
+        createMockPack('pack2')
+      ])
+
+      mockIsPackInstalled.mockImplementation((id: string) => id === 'pack1')
+
+      const { isAllInstalled } = usePacksSelection(nodePacks)
+
+      expect(isAllInstalled.value).toBe(false)
+    })
+
+    it('should return true for empty array', () => {
+      const nodePacks = ref<NodePack[]>([])
+
+      const { isAllInstalled } = usePacksSelection(nodePacks)
+
+      expect(isAllInstalled.value).toBe(true)
+    })
+  })
+
+  describe('isNoneInstalled', () => {
+    it('should return true when no packs are installed', () => {
+      const nodePacks = ref<NodePack[]>([
+        createMockPack('pack1'),
+        createMockPack('pack2')
+      ])
+
+      mockIsPackInstalled.mockReturnValue(false)
+
+      const { isNoneInstalled } = usePacksSelection(nodePacks)
+
+      expect(isNoneInstalled.value).toBe(true)
+    })
+
+    it('should return false when some packs are installed', () => {
+      const nodePacks = ref<NodePack[]>([
+        createMockPack('pack1'),
+        createMockPack('pack2')
+      ])
+
+      mockIsPackInstalled.mockImplementation((id: string) => id === 'pack1')
+
+      const { isNoneInstalled } = usePacksSelection(nodePacks)
+
+      expect(isNoneInstalled.value).toBe(false)
+    })
+
+    it('should return true for empty array', () => {
+      const nodePacks = ref<NodePack[]>([])
+
+      const { isNoneInstalled } = usePacksSelection(nodePacks)
+
+      expect(isNoneInstalled.value).toBe(true)
+    })
+  })
+
+  describe('isMixed', () => {
+    it('should return true when some but not all packs are installed', () => {
+      const nodePacks = ref<NodePack[]>([
+        createMockPack('pack1'),
+        createMockPack('pack2'),
+        createMockPack('pack3')
+      ])
+
+      mockIsPackInstalled.mockImplementation((id: string) => {
+        return id === 'pack1' || id === 'pack2'
+      })
+
+      const { isMixed } = usePacksSelection(nodePacks)
+
+      expect(isMixed.value).toBe(true)
+    })
+
+    it('should return false when all packs are installed', () => {
+      const nodePacks = ref<NodePack[]>([
+        createMockPack('pack1'),
+        createMockPack('pack2')
+      ])
+
+      mockIsPackInstalled.mockReturnValue(true)
+
+      const { isMixed } = usePacksSelection(nodePacks)
+
+      expect(isMixed.value).toBe(false)
+    })
+
+    it('should return false when no packs are installed', () => {
+      const nodePacks = ref<NodePack[]>([
+        createMockPack('pack1'),
+        createMockPack('pack2')
+      ])
+
+      mockIsPackInstalled.mockReturnValue(false)
+
+      const { isMixed } = usePacksSelection(nodePacks)
+
+      expect(isMixed.value).toBe(false)
+    })
+
+    it('should return false for empty array', () => {
+      const nodePacks = ref<NodePack[]>([])
+
+      const { isMixed } = usePacksSelection(nodePacks)
+
+      expect(isMixed.value).toBe(false)
+    })
+  })
+
+  describe('selectionState', () => {
+    it('should return "all-installed" when all packs are installed', () => {
+      const nodePacks = ref<NodePack[]>([
+        createMockPack('pack1'),
+        createMockPack('pack2')
+      ])
+
+      mockIsPackInstalled.mockReturnValue(true)
+
+      const { selectionState } = usePacksSelection(nodePacks)
+
+      expect(selectionState.value).toBe('all-installed')
+    })
+
+    it('should return "none-installed" when no packs are installed', () => {
+      const nodePacks = ref<NodePack[]>([
+        createMockPack('pack1'),
+        createMockPack('pack2')
+      ])
+
+      mockIsPackInstalled.mockReturnValue(false)
+
+      const { selectionState } = usePacksSelection(nodePacks)
+
+      expect(selectionState.value).toBe('none-installed')
+    })
+
+    it('should return "mixed" when some packs are installed', () => {
+      const nodePacks = ref<NodePack[]>([
+        createMockPack('pack1'),
+        createMockPack('pack2'),
+        createMockPack('pack3')
+      ])
+
+      mockIsPackInstalled.mockImplementation((id: string) => id === 'pack1')
+
+      const { selectionState } = usePacksSelection(nodePacks)
+
+      expect(selectionState.value).toBe('mixed')
+    })
+
+    it('should update when installation status changes', () => {
+      const nodePacks = ref<NodePack[]>([
+        createMockPack('pack1'),
+        createMockPack('pack2')
+      ])
+
+      mockIsPackInstalled.mockReturnValue(false)
+
+      const { selectionState } = usePacksSelection(nodePacks)
+      expect(selectionState.value).toBe('none-installed')
+
+      // Change mock to simulate installation
+      mockIsPackInstalled.mockReturnValue(true)
+
+      // Force reactivity update
+      nodePacks.value = [...nodePacks.value]
+
+      expect(selectionState.value).toBe('all-installed')
+    })
+  })
+
+  describe('edge cases', () => {
+    it('should handle packs with undefined ids', () => {
+      const nodePacks = ref<NodePack[]>([
+        { ...createMockPack('pack1'), id: undefined as any },
+        createMockPack('pack2')
+      ])
+
+      mockIsPackInstalled.mockImplementation((id: string) => id === 'pack2')
+
+      const { installedPacks, notInstalledPacks } = usePacksSelection(nodePacks)
+
+      expect(installedPacks.value).toHaveLength(1)
+      expect(installedPacks.value[0].id).toBe('pack2')
+      expect(notInstalledPacks.value).toHaveLength(1)
+    })
+
+    it('should handle dynamic changes to pack installation status', () => {
+      const nodePacks = ref<NodePack[]>([
+        createMockPack('pack1'),
+        createMockPack('pack2')
+      ])
+
+      const installationStatus: Record<string, boolean> = {
+        pack1: false,
+        pack2: false
+      }
+
+      mockIsPackInstalled.mockImplementation(
+        (id: string) => installationStatus[id] || false
+      )
+
+      const { installedPacks, notInstalledPacks, selectionState } =
+        usePacksSelection(nodePacks)
+
+      expect(selectionState.value).toBe('none-installed')
+      expect(installedPacks.value).toHaveLength(0)
+      expect(notInstalledPacks.value).toHaveLength(2)
+
+      // Simulate installing pack1
+      installationStatus.pack1 = true
+      nodePacks.value = [...nodePacks.value] // Trigger reactivity
+
+      expect(selectionState.value).toBe('mixed')
+      expect(installedPacks.value).toHaveLength(1)
+      expect(notInstalledPacks.value).toHaveLength(1)
+
+      // Simulate installing pack2
+      installationStatus.pack2 = true
+      nodePacks.value = [...nodePacks.value] // Trigger reactivity
+
+      expect(selectionState.value).toBe('all-installed')
+      expect(installedPacks.value).toHaveLength(2)
+      expect(notInstalledPacks.value).toHaveLength(0)
+    })
+  })
+})

tests-ui/tests/composables/nodePack/usePacksStatus.test.ts

@@ -0,0 +1,384 @@
+import { createPinia, setActivePinia } from 'pinia'
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
+import { ref } from 'vue'
+
+import { usePacksStatus } from '@/composables/nodePack/usePacksStatus'
+import { useConflictDetectionStore } from '@/stores/conflictDetectionStore'
+import type { components } from '@/types/comfyRegistryTypes'
+import type { ConflictDetectionResult } from '@/types/conflictDetectionTypes'
+
+type NodePack = components['schemas']['Node']
+type NodeStatus = components['schemas']['NodeStatus']
+type NodeVersionStatus = components['schemas']['NodeVersionStatus']
+
+describe('usePacksStatus', () => {
+  let conflictDetectionStore: ReturnType<typeof useConflictDetectionStore>
+
+  const createMockPack = (
+    id: string,
+    status?: NodeStatus | NodeVersionStatus
+  ): NodePack => ({
+    id,
+    name: `Pack ${id}`,
+    description: `Description for pack ${id}`,
+    category: 'Nodes',
+    author: 'Test Author',
+    license: 'MIT',
+    repository: 'https://github.com/test/pack',
+    tags: [],
+    status: (status || 'NodeStatusActive') as NodeStatus
+  })
+
+  const createMockConflict = (
+    packageId: string,
+    type: 'import_failed' | 'banned' | 'pending' = 'import_failed'
+  ): ConflictDetectionResult => ({
+    package_id: packageId,
+    package_name: `Pack ${packageId}`,
+    has_conflict: true,
+    conflicts: [
+      {
+        type,
+        current_value: 'current',
+        required_value: 'required'
+      }
+    ],
+    is_compatible: false
+  })
+
+  beforeEach(() => {
+    vi.clearAllMocks()
+    setActivePinia(createPinia())
+    conflictDetectionStore = useConflictDetectionStore()
+  })
+
+  afterEach(() => {
+    vi.restoreAllMocks()
+  })
+
+  describe('hasImportFailed', () => {
+    it('should return true when at least one pack has import_failed conflict', () => {
+      const nodePacks = ref<NodePack[]>([
+        createMockPack('pack1'),
+        createMockPack('pack2'),
+        createMockPack('pack3')
+      ])
+
+      // Set up mock conflicts
+      conflictDetectionStore.setConflictedPackages([
+        createMockConflict('pack2', 'import_failed'),
+        createMockConflict('pack3', 'banned')
+      ])
+
+      const { hasImportFailed } = usePacksStatus(nodePacks)
+
+      expect(hasImportFailed.value).toBe(true)
+    })
+
+    it('should return false when no pack has import_failed conflict', () => {
+      const nodePacks = ref<NodePack[]>([
+        createMockPack('pack1'),
+        createMockPack('pack2')
+      ])
+
+      // Set up mock conflicts with no import_failed
+      conflictDetectionStore.setConflictedPackages([
+        createMockConflict('pack1', 'pending'),
+        createMockConflict('pack2', 'banned')
+      ])
+
+      const { hasImportFailed } = usePacksStatus(nodePacks)
+
+      expect(hasImportFailed.value).toBe(false)
+    })
+
+    it('should return false when no conflicts exist', () => {
+      const nodePacks = ref<NodePack[]>([
+        createMockPack('pack1'),
+        createMockPack('pack2')
+      ])
+
+      conflictDetectionStore.setConflictedPackages([])
+
+      const { hasImportFailed } = usePacksStatus(nodePacks)
+
+      expect(hasImportFailed.value).toBe(false)
+    })
+
+    it('should handle packs without ids', () => {
+      const nodePacks = ref<NodePack[]>([
+        { ...createMockPack('pack1'), id: undefined as any },
+        createMockPack('pack2')
+      ])
+
+      conflictDetectionStore.setConflictedPackages([
+        createMockConflict('pack2', 'import_failed')
+      ])
+
+      const { hasImportFailed } = usePacksStatus(nodePacks)
+
+      expect(hasImportFailed.value).toBe(true)
+    })
+
+    it('should update when conflicts change', () => {
+      const nodePacks = ref<NodePack[]>([
+        createMockPack('pack1'),
+        createMockPack('pack2')
+      ])
+
+      conflictDetectionStore.setConflictedPackages([])
+
+      const { hasImportFailed } = usePacksStatus(nodePacks)
+      expect(hasImportFailed.value).toBe(false)
+
+      // Add import_failed conflict
+      conflictDetectionStore.setConflictedPackages([
+        createMockConflict('pack1', 'import_failed')
+      ])
+
+      expect(hasImportFailed.value).toBe(true)
+    })
+  })
+
+  describe('overallStatus', () => {
+    it('should prioritize banned status over all others', () => {
+      const nodePacks = ref<NodePack[]>([
+        createMockPack('pack1', 'NodeStatusActive'),
+        createMockPack('pack2', 'NodeStatusBanned'),
+        createMockPack('pack3', 'NodeVersionStatusDeleted')
+      ])
+
+      const { overallStatus } = usePacksStatus(nodePacks)
+
+      expect(overallStatus.value).toBe('NodeStatusBanned')
+    })
+
+    it('should prioritize version banned over deleted and active', () => {
+      const nodePacks = ref<NodePack[]>([
+        createMockPack('pack1', 'NodeStatusActive'),
+        createMockPack('pack2', 'NodeVersionStatusBanned'),
+        createMockPack('pack3', 'NodeVersionStatusDeleted')
+      ])
+
+      const { overallStatus } = usePacksStatus(nodePacks)
+
+      expect(overallStatus.value).toBe('NodeVersionStatusBanned')
+    })
+
+    it('should prioritize deleted status appropriately', () => {
+      const nodePacks = ref<NodePack[]>([
+        createMockPack('pack1', 'NodeStatusActive'),
+        createMockPack('pack2', 'NodeStatusDeleted'),
+        createMockPack('pack3', 'NodeVersionStatusActive')
+      ])
+
+      const { overallStatus } = usePacksStatus(nodePacks)
+
+      expect(overallStatus.value).toBe('NodeStatusDeleted')
+    })
+
+    it('should prioritize version deleted over flagged and active', () => {
+      const nodePacks = ref<NodePack[]>([
+        createMockPack('pack1', 'NodeVersionStatusFlagged'),
+        createMockPack('pack2', 'NodeVersionStatusDeleted'),
+        createMockPack('pack3', 'NodeVersionStatusActive')
+      ])
+
+      const { overallStatus } = usePacksStatus(nodePacks)
+
+      expect(overallStatus.value).toBe('NodeVersionStatusDeleted')
+    })
+
+    it('should prioritize flagged status over pending and active', () => {
+      const nodePacks = ref<NodePack[]>([
+        createMockPack('pack1', 'NodeVersionStatusPending'),
+        createMockPack('pack2', 'NodeVersionStatusFlagged'),
+        createMockPack('pack3', 'NodeVersionStatusActive')
+      ])
+
+      const { overallStatus } = usePacksStatus(nodePacks)
+
+      expect(overallStatus.value).toBe('NodeVersionStatusFlagged')
+    })
+
+    it('should prioritize pending status over active', () => {
+      const nodePacks = ref<NodePack[]>([
+        createMockPack('pack1', 'NodeVersionStatusActive'),
+        createMockPack('pack2', 'NodeVersionStatusPending'),
+        createMockPack('pack3', 'NodeStatusActive')
+      ])
+
+      const { overallStatus } = usePacksStatus(nodePacks)
+
+      expect(overallStatus.value).toBe('NodeVersionStatusPending')
+    })
+
+    it('should return NodeStatusActive when all packs are active', () => {
+      const nodePacks = ref<NodePack[]>([
+        createMockPack('pack1', 'NodeStatusActive'),
+        createMockPack('pack2', 'NodeStatusActive')
+      ])
+
+      const { overallStatus } = usePacksStatus(nodePacks)
+
+      expect(overallStatus.value).toBe('NodeStatusActive')
+    })
+
+    it('should return NodeStatusActive as default when all packs have no status', () => {
+      const nodePacks = ref<NodePack[]>([
+        createMockPack('pack1'),
+        createMockPack('pack2')
+      ])
+
+      const { overallStatus } = usePacksStatus(nodePacks)
+
+      // Since createMockPack sets status to 'NodeStatusActive' by default
+      expect(overallStatus.value).toBe('NodeStatusActive')
+    })
+
+    it('should handle empty pack array', () => {
+      const nodePacks = ref<NodePack[]>([])
+
+      const { overallStatus } = usePacksStatus(nodePacks)
+
+      expect(overallStatus.value).toBe('NodeVersionStatusActive')
+    })
+
+    it('should update when pack statuses change', () => {
+      const nodePacks = ref<NodePack[]>([
+        createMockPack('pack1', 'NodeStatusActive'),
+        createMockPack('pack2', 'NodeStatusActive')
+      ])
+
+      const { overallStatus } = usePacksStatus(nodePacks)
+      expect(overallStatus.value).toBe('NodeStatusActive')
+
+      // Change one pack to banned
+      nodePacks.value = [
+        createMockPack('pack1', 'NodeStatusBanned'),
+        createMockPack('pack2', 'NodeStatusActive')
+      ]
+
+      expect(overallStatus.value).toBe('NodeStatusBanned')
+    })
+  })
+
+  describe('integration with import failures', () => {
+    it('should return NodeVersionStatusActive when import failures exist (handled separately)', () => {
+      const nodePacks = ref<NodePack[]>([
+        createMockPack('pack1', 'NodeStatusActive'),
+        createMockPack('pack2', 'NodeStatusActive')
+      ])
+
+      conflictDetectionStore.setConflictedPackages([
+        createMockConflict('pack1', 'import_failed')
+      ])
+
+      const { hasImportFailed, overallStatus } = usePacksStatus(nodePacks)
+
+      expect(hasImportFailed.value).toBe(true)
+      // When import failed exists, it returns NodeVersionStatusActive
+      expect(overallStatus.value).toBe('NodeVersionStatusActive')
+    })
+
+    it('should return NodeVersionStatusActive when import failures exist even with banned status', () => {
+      const nodePacks = ref<NodePack[]>([
+        createMockPack('pack1', 'NodeStatusBanned'),
+        createMockPack('pack2', 'NodeStatusActive')
+      ])
+
+      conflictDetectionStore.setConflictedPackages([
+        createMockConflict('pack2', 'import_failed')
+      ])
+
+      const { hasImportFailed, overallStatus } = usePacksStatus(nodePacks)
+
+      expect(hasImportFailed.value).toBe(true)
+      // Import failed takes priority and returns NodeVersionStatusActive
+      expect(overallStatus.value).toBe('NodeVersionStatusActive')
+    })
+  })
+
+  describe('edge cases', () => {
+    it('should handle multiple conflicts per package', () => {
+      const nodePacks = ref<NodePack[]>([
+        createMockPack('pack1'),
+        createMockPack('pack2')
+      ])
+
+      conflictDetectionStore.setConflictedPackages([
+        {
+          package_id: 'pack1',
+          package_name: 'Pack pack1',
+          has_conflict: true,
+          conflicts: [
+            {
+              type: 'pending',
+              current_value: 'current1',
+              required_value: 'required1'
+            },
+            {
+              type: 'import_failed',
+              current_value: 'current2',
+              required_value: 'required2'
+            }
+          ],
+          is_compatible: false
+        }
+      ])
+
+      const { hasImportFailed } = usePacksStatus(nodePacks)
+
+      expect(hasImportFailed.value).toBe(true)
+    })
+
+    it('should handle packs with no conflicts in store', () => {
+      const nodePacks = ref<NodePack[]>([
+        createMockPack('pack1'),
+        createMockPack('pack2')
+      ])
+
+      const { hasImportFailed } = usePacksStatus(nodePacks)
+
+      expect(hasImportFailed.value).toBe(false)
+    })
+
+    it('should handle mixed status types correctly', () => {
+      const nodePacks = ref<NodePack[]>([
+        createMockPack('pack1', 'NodeStatusBanned'),
+        createMockPack('pack2', 'NodeVersionStatusBanned'),
+        createMockPack('pack3', 'NodeStatusDeleted'),
+        createMockPack('pack4', 'NodeVersionStatusDeleted'),
+        createMockPack('pack5', 'NodeVersionStatusFlagged'),
+        createMockPack('pack6', 'NodeVersionStatusPending'),
+        createMockPack('pack7', 'NodeStatusActive'),
+        createMockPack('pack8', 'NodeVersionStatusActive')
+      ])
+
+      const { overallStatus } = usePacksStatus(nodePacks)
+
+      // Should return the highest priority status (NodeStatusBanned)
+      expect(overallStatus.value).toBe('NodeStatusBanned')
+    })
+
+    it('should be reactive to nodePacks changes', () => {
+      const nodePacks = ref<NodePack[]>([])
+
+      const { overallStatus } = usePacksStatus(nodePacks)
+      expect(overallStatus.value).toBe('NodeVersionStatusActive')
+
+      // Add packs
+      nodePacks.value = [
+        createMockPack('pack1', 'NodeStatusDeleted'),
+        createMockPack('pack2', 'NodeStatusActive')
+      ]
+
+      expect(overallStatus.value).toBe('NodeStatusDeleted')
+
+      // Add a higher priority status
+      nodePacks.value.push(createMockPack('pack3', 'NodeStatusBanned'))
+
+      expect(overallStatus.value).toBe('NodeStatusBanned')
+    })
+  })
+})

tests-ui/tests/composables/useConflictAcknowledgment.test.ts

@@ -0,0 +1,186 @@
+import { createPinia, setActivePinia } from 'pinia'
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
+
+describe('useConflictAcknowledgment', () => {
+  beforeEach(() => {
+    // Set up Pinia for each test
+    setActivePinia(createPinia())
+    // Clear localStorage before each test
+    localStorage.clear()
+    // Reset modules to ensure fresh state
+    vi.resetModules()
+  })
+
+  afterEach(() => {
+    localStorage.clear()
+  })
+
+  describe('initial state loading', () => {
+    it('should load empty state when localStorage is empty', async () => {
+      vi.resetModules()
+      const { useConflictAcknowledgment } = await import(
+        '@/composables/useConflictAcknowledgment'
+      )
+      const { acknowledgmentState } = useConflictAcknowledgment()
+
+      expect(acknowledgmentState.value).toEqual({
+        modal_dismissed: false,
+        red_dot_dismissed: false,
+        warning_banner_dismissed: false
+      })
+    })
+
+    it('should load existing state from localStorage', async () => {
+      // Pre-populate localStorage with JSON values (as useStorage expects)
+      localStorage.setItem('Comfy.ConflictModalDismissed', JSON.stringify(true))
+      localStorage.setItem(
+        'Comfy.ConflictRedDotDismissed',
+        JSON.stringify(true)
+      )
+      localStorage.setItem(
+        'Comfy.ConflictWarningBannerDismissed',
+        JSON.stringify(true)
+      )
+
+      // Need to import the module after localStorage is set
+      vi.resetModules()
+      const { useConflictAcknowledgment } = await import(
+        '@/composables/useConflictAcknowledgment'
+      )
+      const { acknowledgmentState } = useConflictAcknowledgment()
+
+      expect(acknowledgmentState.value).toEqual({
+        modal_dismissed: true,
+        red_dot_dismissed: true,
+        warning_banner_dismissed: true
+      })
+    })
+  })
+
+  describe('dismissal functions', () => {
+    it('should mark conflicts as seen with unified function', async () => {
+      vi.resetModules()
+      const { useConflictAcknowledgment } = await import(
+        '@/composables/useConflictAcknowledgment'
+      )
+      const { markConflictsAsSeen, acknowledgmentState } =
+        useConflictAcknowledgment()
+
+      markConflictsAsSeen()
+
+      expect(acknowledgmentState.value.modal_dismissed).toBe(true)
+    })
+
+    it('should dismiss red dot notification', async () => {
+      vi.resetModules()
+      const { useConflictAcknowledgment } = await import(
+        '@/composables/useConflictAcknowledgment'
+      )
+      const { dismissRedDotNotification, acknowledgmentState } =
+        useConflictAcknowledgment()
+
+      dismissRedDotNotification()
+
+      expect(acknowledgmentState.value.red_dot_dismissed).toBe(true)
+    })
+
+    it('should dismiss warning banner', async () => {
+      vi.resetModules()
+      const { useConflictAcknowledgment } = await import(
+        '@/composables/useConflictAcknowledgment'
+      )
+      const { dismissWarningBanner, acknowledgmentState } =
+        useConflictAcknowledgment()
+
+      dismissWarningBanner()
+
+      expect(acknowledgmentState.value.warning_banner_dismissed).toBe(true)
+    })
+
+    it('should mark all conflicts as seen', async () => {
+      vi.resetModules()
+      const { useConflictAcknowledgment } = await import(
+        '@/composables/useConflictAcknowledgment'
+      )
+      const { markConflictsAsSeen, acknowledgmentState } =
+        useConflictAcknowledgment()
+
+      markConflictsAsSeen()
+
+      expect(acknowledgmentState.value.modal_dismissed).toBe(true)
+      expect(acknowledgmentState.value.red_dot_dismissed).toBe(true)
+      expect(acknowledgmentState.value.warning_banner_dismissed).toBe(true)
+    })
+  })
+
+  describe('computed properties', () => {
+    it('should calculate shouldShowConflictModal correctly', async () => {
+      // Need fresh module import to ensure clean state
+      vi.resetModules()
+      const { useConflictAcknowledgment } = await import(
+        '@/composables/useConflictAcknowledgment'
+      )
+      const { shouldShowConflictModal, markConflictsAsSeen } =
+        useConflictAcknowledgment()
+
+      expect(shouldShowConflictModal.value).toBe(true)
+
+      markConflictsAsSeen()
+      expect(shouldShowConflictModal.value).toBe(false)
+    })
+
+    it('should calculate shouldShowRedDot correctly based on conflicts', async () => {
+      vi.resetModules()
+      const { useConflictAcknowledgment } = await import(
+        '@/composables/useConflictAcknowledgment'
+      )
+      const { shouldShowRedDot, dismissRedDotNotification } =
+        useConflictAcknowledgment()
+
+      // Initially false because no conflicts exist
+      expect(shouldShowRedDot.value).toBe(false)
+
+      dismissRedDotNotification()
+      expect(shouldShowRedDot.value).toBe(false)
+    })
+
+    it('should calculate shouldShowManagerBanner correctly', async () => {
+      vi.resetModules()
+      const { useConflictAcknowledgment } = await import(
+        '@/composables/useConflictAcknowledgment'
+      )
+      const { shouldShowManagerBanner, dismissWarningBanner } =
+        useConflictAcknowledgment()
+
+      // Initially false because no conflicts exist
+      expect(shouldShowManagerBanner.value).toBe(false)
+
+      dismissWarningBanner()
+      expect(shouldShowManagerBanner.value).toBe(false)
+    })
+  })
+
+  describe('localStorage persistence', () => {
+    it('should persist to localStorage automatically', async () => {
+      // Need fresh module import to ensure clean state
+      vi.resetModules()
+      const { useConflictAcknowledgment } = await import(
+        '@/composables/useConflictAcknowledgment'
+      )
+      const { markConflictsAsSeen, dismissWarningBanner } =
+        useConflictAcknowledgment()
+
+      markConflictsAsSeen()
+      dismissWarningBanner()
+
+      // Wait a tick for useStorage to sync
+      await new Promise((resolve) => setTimeout(resolve, 10))
+
+      // VueUse useStorage should automatically persist to localStorage as JSON
+      expect(localStorage.getItem('Comfy.ConflictModalDismissed')).toBe('true')
+      expect(localStorage.getItem('Comfy.ConflictWarningBannerDismissed')).toBe(
+        'true'
+      )
+    })
+  })
+})

tests-ui/tests/composables/useImportFailedDetection.test.ts

@@ -0,0 +1,198 @@
+import { createPinia, setActivePinia } from 'pinia'
+import { beforeEach, describe, expect, it, vi } from 'vitest'
+import { computed, ref } from 'vue'
+
+import { useImportFailedDetection } from '@/composables/useImportFailedDetection'
+import * as dialogService from '@/services/dialogService'
+import * as comfyManagerStore from '@/stores/comfyManagerStore'
+import * as conflictDetectionStore from '@/stores/conflictDetectionStore'
+
+// Mock the stores and services
+vi.mock('@/stores/comfyManagerStore')
+vi.mock('@/stores/conflictDetectionStore')
+vi.mock('@/services/dialogService')
+vi.mock('vue-i18n', async (importOriginal) => {
+  const actual = await importOriginal<typeof import('vue-i18n')>()
+  return {
+    ...actual,
+    useI18n: () => ({
+      t: vi.fn((key: string) => key)
+    })
+  }
+})
+
+describe('useImportFailedDetection', () => {
+  let mockComfyManagerStore: any
+  let mockConflictDetectionStore: any
+  let mockDialogService: any
+
+  beforeEach(() => {
+    setActivePinia(createPinia())
+
+    mockComfyManagerStore = {
+      isPackInstalled: vi.fn()
+    }
+    mockConflictDetectionStore = {
+      getConflictsForPackageByID: vi.fn()
+    }
+    mockDialogService = {
+      showErrorDialog: vi.fn()
+    }
+
+    vi.mocked(comfyManagerStore.useComfyManagerStore).mockReturnValue(
+      mockComfyManagerStore
+    )
+    vi.mocked(conflictDetectionStore.useConflictDetectionStore).mockReturnValue(
+      mockConflictDetectionStore
+    )
+    vi.mocked(dialogService.useDialogService).mockReturnValue(mockDialogService)
+  })
+
+  it('should return false for importFailed when package is not installed', () => {
+    mockComfyManagerStore.isPackInstalled.mockReturnValue(false)
+
+    const { importFailed } = useImportFailedDetection('test-package')
+
+    expect(importFailed.value).toBe(false)
+  })
+
+  it('should return false for importFailed when no conflicts exist', () => {
+    mockComfyManagerStore.isPackInstalled.mockReturnValue(true)
+    mockConflictDetectionStore.getConflictsForPackageByID.mockReturnValue(null)
+
+    const { importFailed } = useImportFailedDetection('test-package')
+
+    expect(importFailed.value).toBe(false)
+  })
+
+  it('should return false for importFailed when conflicts exist but no import_failed type', () => {
+    mockComfyManagerStore.isPackInstalled.mockReturnValue(true)
+    mockConflictDetectionStore.getConflictsForPackageByID.mockReturnValue({
+      package_id: 'test-package',
+      conflicts: [
+        { type: 'dependency', message: 'Dependency conflict' },
+        { type: 'version', message: 'Version conflict' }
+      ]
+    })
+
+    const { importFailed } = useImportFailedDetection('test-package')
+
+    expect(importFailed.value).toBe(false)
+  })
+
+  it('should return true for importFailed when import_failed conflicts exist', () => {
+    mockComfyManagerStore.isPackInstalled.mockReturnValue(true)
+    mockConflictDetectionStore.getConflictsForPackageByID.mockReturnValue({
+      package_id: 'test-package',
+      conflicts: [
+        {
+          type: 'import_failed',
+          message: 'Import failed',
+          required_value: 'Error details'
+        },
+        { type: 'dependency', message: 'Dependency conflict' }
+      ]
+    })
+
+    const { importFailed } = useImportFailedDetection('test-package')
+
+    expect(importFailed.value).toBe(true)
+  })
+
+  it('should work with computed ref packageId', () => {
+    const packageId = ref('test-package')
+    mockComfyManagerStore.isPackInstalled.mockReturnValue(true)
+    mockConflictDetectionStore.getConflictsForPackageByID.mockReturnValue({
+      package_id: 'test-package',
+      conflicts: [
+        {
+          type: 'import_failed',
+          message: 'Import failed',
+          required_value: 'Error details'
+        }
+      ]
+    })
+
+    const { importFailed } = useImportFailedDetection(
+      computed(() => packageId.value)
+    )
+
+    expect(importFailed.value).toBe(true)
+
+    // Change packageId
+    packageId.value = 'another-package'
+    mockConflictDetectionStore.getConflictsForPackageByID.mockReturnValue(null)
+
+    expect(importFailed.value).toBe(false)
+  })
+
+  it('should return correct importFailedInfo', () => {
+    const importFailedConflicts = [
+      {
+        type: 'import_failed',
+        message: 'Import failed 1',
+        required_value: 'Error 1'
+      },
+      {
+        type: 'import_failed',
+        message: 'Import failed 2',
+        required_value: 'Error 2'
+      }
+    ]
+
+    mockComfyManagerStore.isPackInstalled.mockReturnValue(true)
+    mockConflictDetectionStore.getConflictsForPackageByID.mockReturnValue({
+      package_id: 'test-package',
+      conflicts: [
+        ...importFailedConflicts,
+        { type: 'dependency', message: 'Dependency conflict' }
+      ]
+    })
+
+    const { importFailedInfo } = useImportFailedDetection('test-package')
+
+    expect(importFailedInfo.value).toEqual(importFailedConflicts)
+  })
+
+  it('should show error dialog when showImportFailedDialog is called', () => {
+    const importFailedConflicts = [
+      {
+        type: 'import_failed',
+        message: 'Import failed',
+        required_value: 'Error details'
+      }
+    ]
+
+    mockComfyManagerStore.isPackInstalled.mockReturnValue(true)
+    mockConflictDetectionStore.getConflictsForPackageByID.mockReturnValue({
+      package_id: 'test-package',
+      conflicts: importFailedConflicts
+    })
+
+    const { showImportFailedDialog } = useImportFailedDetection('test-package')
+
+    showImportFailedDialog()
+
+    expect(mockDialogService.showErrorDialog).toHaveBeenCalledWith(
+      expect.any(Error),
+      {
+        title: 'manager.failedToInstall',
+        reportType: 'importFailedError'
+      }
+    )
+  })
+
+  it('should handle null packageId', () => {
+    const { importFailed, isInstalled } = useImportFailedDetection(null)
+
+    expect(importFailed.value).toBe(false)
+    expect(isInstalled.value).toBe(false)
+  })
+
+  it('should handle undefined packageId', () => {
+    const { importFailed, isInstalled } = useImportFailedDetection(undefined)
+
+    expect(importFailed.value).toBe(false)
+    expect(isInstalled.value).toBe(false)
+  })
+})

tests-ui/tests/composables/widgets/useManagerQueue.test.ts

@@ -1,265 +1,329 @@
 import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
-import { nextTick, ref } from 'vue'
+import { nextTick } from 'vue'
 
 import { useManagerQueue } from '@/composables/useManagerQueue'
-import { app } from '@/scripts/app'
+import { api } from '@/scripts/api'
 
-// Mock VueUse's useEventListener
-const mockEventListeners = new Map()
-const mockWheneverCallback = vi.fn()
-
-vi.mock('@vueuse/core', async () => {
-  const actual = await vi.importActual('@vueuse/core')
-  return {
-    ...actual,
-    useEventListener: vi.fn((target, event, handler) => {
-      if (!mockEventListeners.has(event)) {
-        mockEventListeners.set(event, [])
-      }
-      mockEventListeners.get(event).push(handler)
-
-      // Mock the addEventListener behavior
-      if (target && target.addEventListener) {
-        target.addEventListener(event, handler)
-      }
-
-      // Return cleanup function
-      return () => {
-        if (target && target.removeEventListener) {
-          target.removeEventListener(event, handler)
-        }
-      }
-    }),
-    whenever: vi.fn((_source, cb) => {
-      mockWheneverCallback.mockImplementation(cb)
-    })
+vi.mock('@/scripts/api', () => ({
+  api: {
+    addEventListener: vi.fn(),
+    removeEventListener: vi.fn(),
+    dispatchEvent: vi.fn()
   }
-})
-
-vi.mock('@/scripts/app', () => ({
-  app: {
-    api: {
-      clientId: 'test-client-id',
-      addEventListener: vi.fn(),
-      removeEventListener: vi.fn(),
-      dispatchEvent: vi.fn()
-    }
-  }
-}))
-
-vi.mock('@/services/comfyManagerService', () => ({
-  useComfyManagerService: vi.fn(() => ({
-    getTaskQueue: vi.fn().mockResolvedValue({
-      queue_running: [],
-      queue_pending: []
-    }),
-    getTaskHistory: vi.fn().mockResolvedValue({}),
-    clearTaskHistory: vi.fn().mockResolvedValue(null),
-    deleteTaskHistoryItems: vi.fn().mockResolvedValue(null)
-  }))
-}))
-
-const mockShowManagerProgressDialog = vi.fn()
-vi.mock('@/services/dialogService', () => ({
-  useDialogService: vi.fn(() => ({
-    showManagerProgressDialog: mockShowManagerProgressDialog
-  }))
 }))
 
 describe('useManagerQueue', () => {
-  let taskHistory: any
-  let taskQueue: any
-  let installedPacks: any
-
-  // Helper functions
-  const createMockTask = (
-    id: string,
-    clientId = 'test-client-id',
-    additional = {}
-  ) => ({
-    id,
-    client_id: clientId,
-    ...additional
+  const createMockTask = (result: any = 'result') => ({
+    task: vi.fn().mockResolvedValue(result),
+    onComplete: vi.fn()
   })
 
-  const createMockHistoryItem = (
-    clientId = 'test-client-id',
-    result = 'success',
-    additional = {}
-  ) => ({
-    client_id: clientId,
-    result,
-    ...additional
-  })
+  const createQueueWithMockTask = () => {
+    const queue = useManagerQueue()
+    const mockTask = createMockTask()
+    queue.enqueueTask(mockTask)
+    return { queue, mockTask }
+  }
 
-  const createMockState = (overrides = {}) => ({
-    running_queue: [],
-    pending_queue: [],
-    history: {},
-    installed_packs: {},
-    ...overrides
-  })
+  const getEventListenerCallback = () =>
+    vi.mocked(api.addEventListener).mock.calls[0][1]
 
-  const triggerWebSocketEvent = (eventType: string, state: any) => {
-    const mockEventListener = app.api.addEventListener as any
-    const eventCall = mockEventListener.mock.calls.find(
-      (call: any) => call[0] === eventType
-    )
-
-    if (eventCall) {
-      const handler = eventCall[1]
-      handler({
-        type: eventType,
-        detail: { state }
-      })
-    }
+  const simulateServerStatus = async (status: 'all-done' | 'in_progress') => {
+    const event = new CustomEvent('cm-queue-status', {
+      detail: { status }
+    })
+    getEventListenerCallback()!(event as any)
+    await nextTick()
   }
 
   beforeEach(() => {
     vi.clearAllMocks()
-    mockEventListeners.clear()
-    taskHistory = ref({})
-    taskQueue = ref({
-      history: {},
-      running_queue: [],
-      pending_queue: [],
-      installed_packs: {}
-    })
-    installedPacks = ref({})
   })
 
   afterEach(() => {
     vi.clearAllMocks()
-    mockEventListeners.clear()
   })
 
   describe('initialization', () => {
     it('should initialize with empty queue and DONE status', () => {
-      const queue = useManagerQueue(taskHistory, taskQueue, installedPacks)
-
-      expect(queue.allTasksDone.value).toBe(true)
-    })
-
-    it('should set up event listeners on creation', () => {
-      useManagerQueue(taskHistory, taskQueue, installedPacks)
-
-      expect(app.api.addEventListener).toHaveBeenCalled()
-    })
-  })
-
-  describe('processing state handling', () => {
-    it('should update processing state based on queue length', async () => {
-      const queue = useManagerQueue(taskHistory, taskQueue, installedPacks)
-
-      // Initially empty queue
-      expect(queue.isProcessing.value).toBe(false)
-      expect(queue.allTasksDone.value).toBe(true)
-
-      // Add tasks to queue
-      taskQueue.value.running_queue = [createMockTask('task1')]
-      taskQueue.value.pending_queue = [createMockTask('task2')]
-
-      // Force reactivity update
-      await nextTick()
-
-      expect(queue.allTasksDone.value).toBe(false)
-    })
-
-    it('should trigger progress dialog when queue length changes', async () => {
-      useManagerQueue(taskHistory, taskQueue, installedPacks)
-
-      // Trigger the whenever callback
-      mockWheneverCallback()
-
-      expect(mockShowManagerProgressDialog).toHaveBeenCalled()
-    })
-  })
-
-  describe('task state management', () => {
-    it('should reflect task queue state changes', async () => {
-      const queue = useManagerQueue(taskHistory, taskQueue, installedPacks)
-
-      // Add running tasks
-      taskQueue.value.running_queue = [createMockTask('task1')]
-      taskQueue.value.pending_queue = [createMockTask('task2')]
-
-      await nextTick()
-
-      expect(queue.allTasksDone.value).toBe(false)
-    })
-
-    it('should handle empty queue state', async () => {
-      const queue = useManagerQueue(taskHistory, taskQueue, installedPacks)
-
-      taskQueue.value.running_queue = []
-      taskQueue.value.pending_queue = []
-
-      await nextTick()
+      const queue = useManagerQueue()
 
+      expect(queue.queueLength.value).toBe(0)
+      expect(queue.statusMessage.value).toBe('all-done')
       expect(queue.allTasksDone.value).toBe(true)
     })
   })
 
-  describe('WebSocket event handling', () => {
-    it('should handle task done events', async () => {
-      useManagerQueue(taskHistory, taskQueue, installedPacks)
+  describe('queue management', () => {
+    it('should add tasks to the queue', () => {
+      const queue = useManagerQueue()
+      const mockTask = createMockTask()
 
-      const mockState = createMockState({
-        running_queue: [createMockTask('task1')],
-        history: {
-          task1: createMockHistoryItem()
-        },
-        installed_packs: { pack1: { version: '1.0' } }
-      })
+      queue.enqueueTask(mockTask)
 
-      triggerWebSocketEvent('cm-task-completed', mockState)
-      await nextTick()
-
-      expect(taskQueue.value.running_queue).toEqual([createMockTask('task1')])
-      expect(taskQueue.value.pending_queue).toEqual([])
-      expect(taskHistory.value).toEqual({
-        task1: createMockHistoryItem()
-      })
-      expect(installedPacks.value).toEqual({ pack1: { version: '1.0' } })
+      expect(queue.queueLength.value).toBe(1)
+      expect(queue.allTasksDone.value).toBe(false)
     })
 
-    it('should filter tasks by client ID in WebSocket events', async () => {
-      const queue = useManagerQueue(taskHistory, taskQueue, installedPacks)
+    it('should clear the queue when clearQueue is called', () => {
+      const queue = useManagerQueue()
 
-      const mockState = createMockState({
-        running_queue: [
-          createMockTask('task1'),
-          createMockTask('task2', 'other-client-id')
-        ],
-        pending_queue: [createMockTask('task3')],
-        history: {
-          task1: createMockHistoryItem(),
-          task2: createMockHistoryItem('other-client-id')
-        }
-      })
+      // Add some tasks
+      queue.enqueueTask(createMockTask())
+      queue.enqueueTask(createMockTask())
 
-      triggerWebSocketEvent('cm-task-completed', mockState)
-      await nextTick()
+      expect(queue.queueLength.value).toBe(2)
 
-      // Should only include tasks from this client
-      expect(taskQueue.value.running_queue).toEqual([createMockTask('task1')])
-      expect(taskQueue.value.pending_queue).toEqual([createMockTask('task3')])
-      expect(taskHistory.value).toEqual({
-        task1: createMockHistoryItem()
-      })
-      expect(queue.allTasksDone.value).toBe(false)
+      // Clear the queue
+      queue.clearQueue()
+
+      expect(queue.queueLength.value).toBe(0)
+      expect(queue.allTasksDone.value).toBe(true)
     })
   })
 
-  describe('cleanup functionality', () => {
-    it('should clean up event listeners on cleanup', () => {
-      const queue = useManagerQueue(taskHistory, taskQueue, installedPacks)
+  describe('server status handling', () => {
+    it('should update server status when receiving websocket events', async () => {
+      const queue = useManagerQueue()
 
-      queue.cleanup()
+      await simulateServerStatus('in_progress')
 
-      // Verify cleanup was called
-      expect(queue.isProcessing.value).toBe(false)
-      expect(queue.isLoading.value).toBe(false)
+      expect(queue.statusMessage.value).toBe('in_progress')
+      expect(queue.allTasksDone.value).toBe(false)
+    })
+
+    it('should handle invalid status values gracefully', async () => {
+      const queue = useManagerQueue()
+
+      // Simulate an invalid status
+      const event = new CustomEvent('cm-queue-status', {
+        detail: null as any
+      })
+
+      getEventListenerCallback()!(event)
+      await nextTick()
+
+      // Should maintain the default status
+      expect(queue.statusMessage.value).toBe('all-done')
+    })
+
+    it('should handle missing status property gracefully', async () => {
+      const queue = useManagerQueue()
+
+      // Simulate a detail object without status property
+      const event = new CustomEvent('cm-queue-status', {
+        detail: { someOtherProperty: 'value' } as any
+      })
+
+      getEventListenerCallback()!(event)
+      await nextTick()
+
+      // Should maintain the default status
+      expect(queue.statusMessage.value).toBe('all-done')
+    })
+  })
+
+  describe('task execution', () => {
+    it('should start the next task when server is idle and queue has items', async () => {
+      const { queue, mockTask } = createQueueWithMockTask()
+
+      await simulateServerStatus('all-done')
+
+      // Task should have been started
+      expect(mockTask.task).toHaveBeenCalled()
+      expect(queue.queueLength.value).toBe(0)
+    })
+
+    it('should execute onComplete callback when task completes and server becomes idle', async () => {
+      const { mockTask } = createQueueWithMockTask()
+
+      // Start the task
+      await simulateServerStatus('all-done')
+      expect(mockTask.task).toHaveBeenCalled()
+
+      // Simulate task completion
+      await mockTask.task.mock.results[0].value
+
+      // Simulate server cycle (in_progress -> done)
+      await simulateServerStatus('in_progress')
+      expect(mockTask.onComplete).not.toHaveBeenCalled()
+
+      await simulateServerStatus('all-done')
+      expect(mockTask.onComplete).toHaveBeenCalled()
+    })
+
+    it('should handle tasks without onComplete callback', async () => {
+      const queue = useManagerQueue()
+      const mockTask = { task: vi.fn().mockResolvedValue('result') }
+
+      queue.enqueueTask(mockTask)
+
+      // Start the task
+      await simulateServerStatus('all-done')
+      expect(mockTask.task).toHaveBeenCalled()
+
+      // Simulate task completion
+      await mockTask.task.mock.results[0].value
+
+      // Simulate server cycle
+      await simulateServerStatus('in_progress')
+      await simulateServerStatus('all-done')
+
+      // Should not throw errors even without onComplete
+      expect(queue.allTasksDone.value).toBe(true)
+    })
+
+    it('should process multiple tasks in sequence', async () => {
+      const queue = useManagerQueue()
+      const mockTask1 = createMockTask('result1')
+      const mockTask2 = createMockTask('result2')
+
+      // Add tasks to the queue
+      queue.enqueueTask(mockTask1)
+      queue.enqueueTask(mockTask2)
+      expect(queue.queueLength.value).toBe(2)
+
+      // Process first task
+      await simulateServerStatus('all-done')
+      expect(mockTask1.task).toHaveBeenCalled()
+      expect(queue.queueLength.value).toBe(1)
+
+      // Complete first task
+      await mockTask1.task.mock.results[0].value
+      await simulateServerStatus('in_progress')
+      await simulateServerStatus('all-done')
+      expect(mockTask1.onComplete).toHaveBeenCalled()
+
+      // Process second task
+      expect(mockTask2.task).toHaveBeenCalled()
+      expect(queue.queueLength.value).toBe(0)
+
+      // Complete second task
+      await mockTask2.task.mock.results[0].value
+      await simulateServerStatus('in_progress')
+      await simulateServerStatus('all-done')
+      expect(mockTask2.onComplete).toHaveBeenCalled()
+
+      // Queue should be empty and all tasks done
+      expect(queue.queueLength.value).toBe(0)
+      expect(queue.allTasksDone.value).toBe(true)
+    })
+
+    it('should handle task that returns rejected promise', async () => {
+      const queue = useManagerQueue()
+      const mockTask = {
+        task: vi.fn().mockRejectedValue(new Error('Task failed')),
+        onComplete: vi.fn()
+      }
+
+      queue.enqueueTask(mockTask)
+
+      // Start the task
+      await simulateServerStatus('all-done')
+      expect(mockTask.task).toHaveBeenCalled()
+
+      // Let the promise rejection happen
+      try {
+        await mockTask.task()
+      } catch (e) {
+        // Ignore the error
+      }
+
+      // Simulate server cycle
+      await simulateServerStatus('in_progress')
+      await simulateServerStatus('all-done')
+
+      // onComplete should still be called for failed tasks
+      expect(mockTask.onComplete).toHaveBeenCalled()
+    })
+
+    it('should handle multiple multiple tasks enqueued at once while server busy', async () => {
+      const queue = useManagerQueue()
+      const mockTask1 = createMockTask()
+      const mockTask2 = createMockTask()
+      const mockTask3 = createMockTask()
+
+      // Three tasks enqueued at once
+      await simulateServerStatus('in_progress')
+      await Promise.all([
+        queue.enqueueTask(mockTask1),
+        queue.enqueueTask(mockTask2),
+        queue.enqueueTask(mockTask3)
+      ])
+
+      // Task 1
+      await simulateServerStatus('all-done')
+      expect(mockTask1.task).toHaveBeenCalled()
+
+      // Verify state of onComplete callbacks
+      expect(mockTask1.onComplete).toHaveBeenCalled()
+      expect(mockTask2.onComplete).not.toHaveBeenCalled()
+      expect(mockTask3.onComplete).not.toHaveBeenCalled()
+
+      // Verify state of queue
+      expect(queue.queueLength.value).toBe(2)
+      expect(queue.allTasksDone.value).toBe(false)
+
+      // Task 2
+      await simulateServerStatus('in_progress')
+      await simulateServerStatus('all-done')
+      expect(mockTask2.task).toHaveBeenCalled()
+
+      // Verify state of onComplete callbacks
+      expect(mockTask2.onComplete).toHaveBeenCalled()
+      expect(mockTask3.onComplete).not.toHaveBeenCalled()
+
+      // Verify state of queue
+      expect(queue.queueLength.value).toBe(1)
+      expect(queue.allTasksDone.value).toBe(false)
+
+      // Task 3
+      await simulateServerStatus('in_progress')
+      await simulateServerStatus('all-done')
+
+      // Verify state of onComplete callbacks
+      expect(mockTask3.task).toHaveBeenCalled()
+      expect(mockTask3.onComplete).toHaveBeenCalled()
+
+      // Verify state of queue
+      expect(queue.queueLength.value).toBe(0)
+      expect(queue.allTasksDone.value).toBe(true)
+    })
+
+    it('should handle adding tasks while processing is in progress', async () => {
+      const queue = useManagerQueue()
+      const mockTask1 = createMockTask()
+      const mockTask2 = createMockTask()
+
+      // Add first task and start processing
+      queue.enqueueTask(mockTask1)
+      await simulateServerStatus('all-done')
+      expect(mockTask1.task).toHaveBeenCalled()
+
+      // Add second task while first is processing
+      queue.enqueueTask(mockTask2)
+      expect(queue.queueLength.value).toBe(1)
+
+      // Complete first task
+      await mockTask1.task.mock.results[0].value
+      await simulateServerStatus('in_progress')
+      await simulateServerStatus('all-done')
+
+      // Second task should now be processed
+      expect(mockTask2.task).toHaveBeenCalled()
+    })
+
+    it('should handle server status changes without tasks in queue', async () => {
+      const queue = useManagerQueue()
+
+      // Cycle server status without any tasks
+      await simulateServerStatus('in_progress')
+      await simulateServerStatus('all-done')
+      await simulateServerStatus('in_progress')
+      await simulateServerStatus('all-done')
+
+      // Should not cause any errors
+      expect(queue.allTasksDone.value).toBe(true)
     })
   })
 })