refactor: rename firebaseAuthStore to authStore with shared test fixtures (#10483)

## Summary

Rename `useFirebaseAuthStore` → `useAuthStore` and
`FirebaseAuthStoreError` → `AuthStoreError`. Introduce shared mock
factory (`authStoreMock.ts`) to replace 16 independent bespoke mocks.

## Changes

- **What**: Mechanical rename of store, composable, class, and store ID
(`firebaseAuth` → `auth`). Created
`src/stores/__tests__/authStoreMock.ts` — a shared mock factory with
reactive controls, used by all consuming test files. Migrated all 16
test files from ad-hoc mocks to the shared factory.
- **Files**: 62 files changed (rename propagation + new test infra)

## Review Focus

- Mock factory API design in `authStoreMock.ts` — covers all store
properties with reactive `controls` for per-test customization
- Self-test in `authStoreMock.test.ts` validates computed reactivity

Fixes #8219

## Stack

This is PR 1/5 in a stacked refactoring series:
1. **→ This PR**: Rename + shared test fixtures
2. #10484: Extract auth-routing from workspaceApi
3. #10485: Auth token priority tests
4. #10486: Decompose MembersPanelContent
5. #10487: Consolidate SubscriptionTier type

---------

Co-authored-by: Alexander Brown <drjkl@comfy.org>

browser_tests/tests/sidebar/jobHistory.spec.ts

@@ -1,127 +0,0 @@
-import { expect } from '@playwright/test'
-import type { Locator } from '@playwright/test'
-
-import type { RawJobListItem } from '../../../src/platform/remote/comfyui/jobs/jobTypes'
-import { comfyPageFixture as test } from '../../fixtures/ComfyPage'
-
-const VIRTUALIZED_ROW_LIMIT = 48
-const HEADER_ROW_HEIGHT = 20
-const JOB_ROW_HEIGHT = 48
-const GROUP_ROW_GAP = 16
-const GROUP_JOB_COUNTS = [6, 58]
-const GROUP_BASE_TIMES = [
-  Date.parse('2026-03-26T20:00:00-07:00'),
-  Date.parse('2026-03-25T20:00:00-07:00')
-]
-const GROUP_BOUNDARY_JOB_ID = `job-${GROUP_JOB_COUNTS[0] - 1}`
-const LAST_JOB_ID = `job-${GROUP_JOB_COUNTS[0] + GROUP_JOB_COUNTS[1] - 1}`
-
-function buildCompletedJobs(): RawJobListItem[] {
-  return GROUP_BASE_TIMES.flatMap((baseTime, groupIndex) =>
-    Array.from({ length: GROUP_JOB_COUNTS[groupIndex] }, (_, jobIndex) => {
-      const endTime = baseTime - jobIndex * 5 * 60_000
-      const id =
-        GROUP_JOB_COUNTS.slice(0, groupIndex).reduce(
-          (total, count) => total + count,
-          0
-        ) + jobIndex
-
-      return {
-        id: `job-${id}`,
-        status: 'completed',
-        create_time: endTime,
-        execution_start_time: endTime - 10_000,
-        execution_end_time: endTime,
-        workflow_id: 'workflow-1'
-      }
-    })
-  )
-}
-
-async function getRowMetrics(jobHistoryList: Locator, boundaryJobId: string) {
-  return await jobHistoryList.evaluate((element, jobId) => {
-    const wrapper = element.firstElementChild
-    const firstHeader = wrapper?.firstElementChild
-    const firstJob = element.querySelector('[data-job-id="job-0"]')
-    const boundaryJob = element.querySelector(`[data-job-id="${jobId}"]`)
-
-    if (
-      !(wrapper instanceof HTMLElement) ||
-      !(firstHeader instanceof HTMLElement) ||
-      !(firstJob instanceof HTMLElement) ||
-      !(boundaryJob instanceof HTMLElement) ||
-      !(firstJob.parentElement instanceof HTMLElement) ||
-      !(boundaryJob.parentElement instanceof HTMLElement)
-    ) {
-      throw new Error('Expected virtualized job rows to be present')
-    }
-
-    return {
-      firstHeaderHeight: firstHeader.getBoundingClientRect().height,
-      firstHeaderScrollHeight: firstHeader.scrollHeight,
-      firstJobContentHeight: firstJob.getBoundingClientRect().height,
-      firstJobRowHeight: firstJob.parentElement.getBoundingClientRect().height,
-      boundaryJobContentHeight: boundaryJob.getBoundingClientRect().height,
-      boundaryJobRowHeight:
-        boundaryJob.parentElement.getBoundingClientRect().height
-    }
-  }, boundaryJobId)
-}
-
-test.describe('Job history sidebar', () => {
-  test.beforeEach(async ({ comfyPage }) => {
-    await comfyPage.assets.mockOutputHistory(buildCompletedJobs())
-    await comfyPage.setup()
-    await comfyPage.settings.setSetting('Comfy.Queue.QPOV2', true)
-    await comfyPage.nextFrame()
-  })
-
-  test.afterEach(async ({ comfyPage }) => {
-    await comfyPage.assets.clearMocks()
-  })
-
-  test('virtualizes large job history lists', async ({ comfyPage }) => {
-    const jobHistoryButton = comfyPage.page.locator('.job-history-tab-button')
-    const jobHistoryList = comfyPage.page.getByTestId('job-assets-list')
-    const jobRows = comfyPage.page.locator(
-      '.sidebar-content-container [data-job-id]'
-    )
-    const jobRow = (jobId: string) =>
-      comfyPage.page.locator(
-        `.sidebar-content-container [data-job-id="${jobId}"]`
-      )
-
-    await jobHistoryButton.click()
-    await jobHistoryList.waitFor({ state: 'visible' })
-
-    await expect(jobRow('job-0')).toBeVisible()
-    await expect(jobRow(LAST_JOB_ID)).toHaveCount(0)
-
-    const initialRenderedRows = await jobRows.count()
-    expect(initialRenderedRows).toBeLessThan(VIRTUALIZED_ROW_LIMIT)
-
-    const rowMetrics = await getRowMetrics(
-      jobHistoryList,
-      GROUP_BOUNDARY_JOB_ID
-    )
-    expect(rowMetrics.firstHeaderHeight).toBe(HEADER_ROW_HEIGHT)
-    expect(rowMetrics.firstHeaderScrollHeight).toBeLessThanOrEqual(
-      HEADER_ROW_HEIGHT
-    )
-    expect(rowMetrics.firstJobContentHeight).toBe(JOB_ROW_HEIGHT)
-    expect(rowMetrics.firstJobRowHeight).toBe(JOB_ROW_HEIGHT)
-    expect(rowMetrics.boundaryJobContentHeight).toBe(JOB_ROW_HEIGHT)
-    expect(rowMetrics.boundaryJobRowHeight).toBe(JOB_ROW_HEIGHT + GROUP_ROW_GAP)
-
-    await jobHistoryList.evaluate((element) => {
-      element.scrollTop = element.scrollHeight
-    })
-    await comfyPage.nextFrame()
-
-    await expect(jobRow(LAST_JOB_ID)).toBeVisible()
-    await expect(jobRow('job-0')).toHaveCount(0)
-
-    const renderedRowsAfterScroll = await jobRows.count()
-    expect(renderedRowsAfterScroll).toBeLessThan(VIRTUALIZED_ROW_LIMIT)
-  })
-})

packages/design-system/src/css/style.css

@@ -25,6 +25,9 @@
 @theme {
   --shadow-interface: var(--interface-panel-box-shadow);
 
+  --text-2xs: 0.625rem;
+  --text-2xs--line-height: calc(1 / 0.625);
+
   --text-xxs: 0.625rem;
   --text-xxs--line-height: calc(1 / 0.625);
 

src/App.vue

@@ -7,17 +7,15 @@
 <script setup lang="ts">
 import { captureException } from '@sentry/vue'
 import BlockUI from 'primevue/blockui'
-import { computed, onMounted, onUnmounted, watch } from 'vue'
+import { computed, onMounted, watch } from 'vue'
 
 import GlobalDialog from '@/components/dialog/GlobalDialog.vue'
 import config from '@/config'
 import { isDesktop } from '@/platform/distribution/types'
-import { useSettingStore } from '@/platform/settings/settingStore'
 import { app } from '@/scripts/app'
 import { useWorkspaceStore } from '@/stores/workspaceStore'
 import { electronAPI } from '@/utils/envUtil'
 import { parsePreloadError } from '@/utils/preloadErrorUtil'
-import { useDialogService } from '@/services/dialogService'
 import { useConflictDetection } from '@/workbench/extensions/manager/composables/useConflictDetection'
 
 const workspaceStore = useWorkspaceStore()
@@ -129,26 +127,5 @@ onMounted(() => {
   // Initialize conflict detection in background
   // This runs async and doesn't block UI setup
   void conflictDetection.initializeConflictDetection()
-
-  // Show cloud notification for macOS desktop users (one-time)
-  if (isDesktop && electronAPI()?.getPlatform() === 'darwin') {
-    const settingStore = useSettingStore()
-    if (!settingStore.get('Comfy.Desktop.CloudNotificationShown')) {
-      const dialogService = useDialogService()
-      cloudNotificationTimer = setTimeout(async () => {
-        try {
-          await dialogService.showCloudNotification()
-        } catch (e) {
-          console.warn('[CloudNotification] Failed to show', e)
-        }
-        await settingStore.set('Comfy.Desktop.CloudNotificationShown', true)
-      }, 2000)
-    }
-  }
-})
-
-let cloudNotificationTimer: ReturnType<typeof setTimeout> | undefined
-onUnmounted(() => {
-  if (cloudNotificationTimer) clearTimeout(cloudNotificationTimer)
 })
 </script>

src/components/TopMenuSection.test.ts

@@ -71,8 +71,8 @@ vi.mock('@/workbench/extensions/manager/composables/useManagerState', () => ({
   })
 }))
 
-vi.mock('@/stores/firebaseAuthStore', () => ({
-  useFirebaseAuthStore: vi.fn(() => ({
+vi.mock('@/stores/authStore', () => ({
+  useAuthStore: vi.fn(() => ({
     currentUser: null,
     loading: false
   }))

src/components/breadcrumb/SubgraphBreadcrumbItem.vue

@@ -21,7 +21,7 @@
     />
     <span class="p-breadcrumb-item-label px-2">{{ item.label }}</span>
     <Tag v-if="item.isBlueprint" value="Blueprint" severity="primary" />
-    <i v-if="isActive" class="pi pi-angle-down text-[10px]"></i>
+    <i v-if="isActive" class="pi pi-angle-down text-2xs"></i>
   </div>
   <Menu
     v-if="isActive || isRoot"

src/components/common/UserCredit.test.ts

@@ -32,8 +32,8 @@ const mockBalance = vi.hoisted(() => ({
 
 const mockIsFetchingBalance = vi.hoisted(() => ({ value: false }))
 
-vi.mock('@/stores/firebaseAuthStore', () => ({
-  useFirebaseAuthStore: vi.fn(() => ({
+vi.mock('@/stores/authStore', () => ({
+  useAuthStore: vi.fn(() => ({
     balance: mockBalance.value,
     isFetchingBalance: mockIsFetchingBalance.value
   }))

src/components/common/UserCredit.vue

@@ -30,14 +30,14 @@ import { computed } from 'vue'
 import { useI18n } from 'vue-i18n'
 
 import { formatCreditsFromCents } from '@/base/credits/comfyCredits'
-import { useFirebaseAuthStore } from '@/stores/firebaseAuthStore'
+import { useAuthStore } from '@/stores/authStore'
 
 const { textClass, showCreditsOnly } = defineProps<{
   textClass?: string
   showCreditsOnly?: boolean
 }>()
 
-const authStore = useFirebaseAuthStore()
+const authStore = useAuthStore()
 const balanceLoading = computed(() => authStore.isFetchingBalance)
 const { t, locale } = useI18n()
 

src/components/dialog/content/SignInContent.vue

@@ -147,7 +147,7 @@ import { computed, onMounted, onUnmounted, ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 
 import Button from '@/components/ui/button/Button.vue'
-import { useFirebaseAuthActions } from '@/composables/auth/useFirebaseAuthActions'
+import { useAuthActions } from '@/composables/auth/useAuthActions'
 import { getComfyPlatformBaseUrl } from '@/config/comfyApi'
 import {
   configValueOrDefault,
@@ -167,7 +167,7 @@ const { onSuccess } = defineProps<{
 }>()
 
 const { t } = useI18n()
-const authActions = useFirebaseAuthActions()
+const authActions = useAuthActions()
 const isSecureContext = window.isSecureContext
 const isSignIn = ref(true)
 const showApiKeyForm = ref(false)

src/components/dialog/content/TopUpCreditsDialogContentLegacy.vue

@@ -156,7 +156,7 @@ import { useI18n } from 'vue-i18n'
 import { creditsToUsd, usdToCredits } from '@/base/credits/comfyCredits'
 import Button from '@/components/ui/button/Button.vue'
 import FormattedNumberStepper from '@/components/ui/stepper/FormattedNumberStepper.vue'
-import { useFirebaseAuthActions } from '@/composables/auth/useFirebaseAuthActions'
+import { useAuthActions } from '@/composables/auth/useAuthActions'
 import { useExternalLink } from '@/composables/useExternalLink'
 import { useFeatureFlags } from '@/composables/useFeatureFlags'
 import { useSubscription } from '@/platform/cloud/subscription/composables/useSubscription'
@@ -171,7 +171,7 @@ const { isInsufficientCredits = false } = defineProps<{
 }>()
 
 const { t } = useI18n()
-const authActions = useFirebaseAuthActions()
+const authActions = useAuthActions()
 const dialogStore = useDialogStore()
 const settingsDialog = useSettingsDialog()
 const telemetry = useTelemetry()

src/components/dialog/content/UpdatePasswordContent.vue

@@ -21,10 +21,10 @@ import { ref } from 'vue'
 
 import PasswordFields from '@/components/dialog/content/signin/PasswordFields.vue'
 import Button from '@/components/ui/button/Button.vue'
-import { useFirebaseAuthActions } from '@/composables/auth/useFirebaseAuthActions'
+import { useAuthActions } from '@/composables/auth/useAuthActions'
 import { updatePasswordSchema } from '@/schemas/signInSchema'
 
-const authActions = useFirebaseAuthActions()
+const authActions = useAuthActions()
 const loading = ref(false)
 
 const { onSuccess } = defineProps<{

src/components/dialog/content/setting/LegacyCreditsPanel.vue

@@ -116,12 +116,12 @@ import UserCredit from '@/components/common/UserCredit.vue'
 import UsageLogsTable from '@/components/dialog/content/setting/UsageLogsTable.vue'
 import Button from '@/components/ui/button/Button.vue'
 import { useBillingContext } from '@/composables/billing/useBillingContext'
-import { useFirebaseAuthActions } from '@/composables/auth/useFirebaseAuthActions'
+import { useAuthActions } from '@/composables/auth/useAuthActions'
 import { useExternalLink } from '@/composables/useExternalLink'
 import { useTelemetry } from '@/platform/telemetry'
 import { useDialogService } from '@/services/dialogService'
 import { useCommandStore } from '@/stores/commandStore'
-import { useFirebaseAuthStore } from '@/stores/firebaseAuthStore'
+import { useAuthStore } from '@/stores/authStore'
 import { formatMetronomeCurrency } from '@/utils/formatUtil'
 
 interface CreditHistoryItemData {
@@ -133,8 +133,8 @@ interface CreditHistoryItemData {
 
 const { buildDocsUrl, docsPaths } = useExternalLink()
 const dialogService = useDialogService()
-const authStore = useFirebaseAuthStore()
-const authActions = useFirebaseAuthActions()
+const authStore = useAuthStore()
+const authActions = useAuthActions()
 const commandStore = useCommandStore()
 const telemetry = useTelemetry()
 const { isActiveSubscription } = useBillingContext()

src/components/dialog/content/signin/ApiKeyForm.test.ts

@@ -18,8 +18,8 @@ import ApiKeyForm from './ApiKeyForm.vue'
 const mockStoreApiKey = vi.fn()
 const mockLoading = vi.fn(() => false)
 
-vi.mock('@/stores/firebaseAuthStore', () => ({
-  useFirebaseAuthStore: vi.fn(() => ({
+vi.mock('@/stores/authStore', () => ({
+  useAuthStore: vi.fn(() => ({
     loading: mockLoading()
   }))
 }))

src/components/dialog/content/signin/ApiKeyForm.vue

@@ -100,9 +100,9 @@ import {
 } from '@/platform/remoteConfig/remoteConfig'
 import { apiKeySchema } from '@/schemas/signInSchema'
 import { useApiKeyAuthStore } from '@/stores/apiKeyAuthStore'
-import { useFirebaseAuthStore } from '@/stores/firebaseAuthStore'
+import { useAuthStore } from '@/stores/authStore'
 
-const authStore = useFirebaseAuthStore()
+const authStore = useAuthStore()
 const apiKeyStore = useApiKeyAuthStore()
 const loading = computed(() => authStore.loading)
 const comfyPlatformBaseUrl = computed(() =>

src/components/dialog/content/signin/SignInForm.test.ts

@@ -35,15 +35,15 @@ vi.mock('firebase/auth', () => ({
 
 // Mock the auth composables and stores
 const mockSendPasswordReset = vi.fn()
-vi.mock('@/composables/auth/useFirebaseAuthActions', () => ({
-  useFirebaseAuthActions: vi.fn(() => ({
+vi.mock('@/composables/auth/useAuthActions', () => ({
+  useAuthActions: vi.fn(() => ({
     sendPasswordReset: mockSendPasswordReset
   }))
 }))
 
 let mockLoading = false
-vi.mock('@/stores/firebaseAuthStore', () => ({
-  useFirebaseAuthStore: vi.fn(() => ({
+vi.mock('@/stores/authStore', () => ({
+  useAuthStore: vi.fn(() => ({
     get loading() {
       return mockLoading
     }

src/components/dialog/content/signin/SignInForm.vue

@@ -88,14 +88,14 @@ import { computed } from 'vue'
 import { useI18n } from 'vue-i18n'
 
 import Button from '@/components/ui/button/Button.vue'
-import { useFirebaseAuthActions } from '@/composables/auth/useFirebaseAuthActions'
+import { useAuthActions } from '@/composables/auth/useAuthActions'
 import { signInSchema } from '@/schemas/signInSchema'
 import type { SignInData } from '@/schemas/signInSchema'
-import { useFirebaseAuthStore } from '@/stores/firebaseAuthStore'
+import { useAuthStore } from '@/stores/authStore'
 import { cn } from '@/utils/tailwindUtil'
 
-const authStore = useFirebaseAuthStore()
-const firebaseAuthActions = useFirebaseAuthActions()
+const authStore = useAuthStore()
+const authActions = useAuthActions()
 const loading = computed(() => authStore.loading)
 const toast = useToast()
 
@@ -127,6 +127,6 @@ const handleForgotPassword = async (
     document.getElementById(emailInputId)?.focus?.()
     return
   }
-  await firebaseAuthActions.sendPasswordReset(email)
+  await authActions.sendPasswordReset(email)
 }
 </script>

src/components/dialog/content/signin/SignUpForm.vue

@@ -54,12 +54,12 @@ import { useI18n } from 'vue-i18n'
 import Button from '@/components/ui/button/Button.vue'
 import { signUpSchema } from '@/schemas/signInSchema'
 import type { SignUpData } from '@/schemas/signInSchema'
-import { useFirebaseAuthStore } from '@/stores/firebaseAuthStore'
+import { useAuthStore } from '@/stores/authStore'
 
 import PasswordFields from './PasswordFields.vue'
 
 const { t } = useI18n()
-const authStore = useFirebaseAuthStore()
+const authStore = useAuthStore()
 const loading = computed(() => authStore.loading)
 
 const emit = defineEmits<{

src/components/node/NodePreviewCard.vue

@@ -32,7 +32,7 @@
       <!-- Description -->
       <p
         v-if="nodeDef.description"
-        class="m-0 text-[11px] leading-normal font-normal text-muted-foreground"
+        class="m-0 text-2xs/normal font-normal text-muted-foreground"
       >
         {{ nodeDef.description }}
       </p>

src/components/queue/QueueOverlayExpanded.vue

@@ -20,7 +20,7 @@
       @update:selected-sort-mode="$emit('update:selectedSortMode', $event)"
     />
 
-    <div class="min-h-0 flex-1">
+    <div class="min-h-0 flex-1 overflow-y-auto">
       <JobAssetsList
         :displayed-job-groups="displayedJobGroups"
         @cancel-item="onCancelItemEvent"

src/components/queue/job/JobAssetsList.test.ts

@@ -8,30 +8,6 @@ import { ResultItemImpl, TaskItemImpl } from '@/stores/queueStore'
 
 import JobAssetsList from './JobAssetsList.vue'
 
-vi.mock('@vueuse/core', async () => {
-  const actual = await vi.importActual<Record<string, unknown>>('@vueuse/core')
-  const vue = await import('vue')
-
-  return {
-    ...actual,
-    useVirtualList: (rows: unknown) => ({
-      list: vue.computed(() =>
-        vue.unref(rows as readonly unknown[]).map((data: unknown, index) => ({
-          data,
-          index
-        }))
-      ),
-      scrollTo: vi.fn(),
-      containerProps: {
-        ref: vue.ref(null),
-        onScroll: vi.fn(),
-        style: {}
-      },
-      wrapperProps: vue.computed(() => ({ style: {} }))
-    })
-  }
-})
-
 const JobDetailsPopoverStub = defineComponent({
   name: 'JobDetailsPopover',
   props: {
@@ -146,63 +122,6 @@ afterEach(() => {
 })
 
 describe('JobAssetsList', () => {
-  it('renders grouped headers alongside job rows', () => {
-    const wrapper = mount(JobAssetsList, {
-      props: {
-        displayedJobGroups: [
-          {
-            key: 'today',
-            label: 'Today',
-            items: [buildJob({ id: 'job-1' })]
-          },
-          {
-            key: 'yesterday',
-            label: 'Yesterday',
-            items: [buildJob({ id: 'job-2', title: 'Job 2' })]
-          }
-        ]
-      },
-      global: {
-        stubs: {
-          teleport: true,
-          JobDetailsPopover: JobDetailsPopoverStub
-        }
-      }
-    })
-
-    expect(wrapper.text()).toContain('Today')
-    expect(wrapper.text()).toContain('Yesterday')
-    expect(wrapper.find('[data-job-id="job-1"]').exists()).toBe(true)
-    expect(wrapper.find('[data-job-id="job-2"]').exists()).toBe(true)
-  })
-
-  it('forwards parent attrs to the scroll container', () => {
-    const wrapper = mount(JobAssetsList, {
-      attrs: {
-        class: 'min-h-0 flex-1'
-      },
-      props: {
-        displayedJobGroups: [
-          {
-            key: 'today',
-            label: 'Today',
-            items: [buildJob({ id: 'job-1' })]
-          }
-        ]
-      },
-      global: {
-        stubs: {
-          teleport: true,
-          JobDetailsPopover: JobDetailsPopoverStub
-        }
-      }
-    })
-
-    expect(wrapper.get('[data-testid="job-assets-list"]').classes()).toEqual(
-      expect.arrayContaining(['min-h-0', 'flex-1', 'h-full', 'overflow-y-auto'])
-    )
-  })
-
   it('emits viewItem on preview-click for completed jobs with preview', async () => {
     const job = buildJob()
     const wrapper = mountJobAssetsList([job])

src/components/queue/job/JobAssetsList.vue

@@ -1,93 +1,79 @@
 <template>
-  <div
-    v-bind="$attrs"
-    :ref="containerProps.ref"
-    :style="containerProps.style"
-    data-testid="job-assets-list"
-    class="h-full overflow-y-auto"
-    @scroll="onListScroll"
-  >
-    <div :style="virtualWrapperStyle">
-      <template v-for="{ data: row } in virtualRows" :key="row.key">
-        <div
-          v-if="row.type === 'header'"
-          class="box-border px-3 pb-2 text-xs leading-none text-text-secondary"
-          :style="{ height: `${row.height}px` }"
+  <div class="flex flex-col gap-4 px-3 pb-4">
+    <div
+      v-for="group in displayedJobGroups"
+      :key="group.key"
+      class="flex flex-col gap-2"
+    >
+      <div class="text-xs leading-none text-text-secondary">
+        {{ group.label }}
+      </div>
+      <div
+        v-for="job in group.items"
+        :key="job.id"
+        :data-job-id="job.id"
+        @mouseenter="onJobEnter(job, $event)"
+        @mouseleave="onJobLeave(job.id)"
+      >
+        <AssetsListItem
+          :class="
+            cn(
+              'w-full shrink-0 cursor-default text-text-primary transition-colors hover:bg-secondary-background-hover',
+              job.state === 'running' && 'bg-secondary-background'
+            )
+          "
+          :preview-url="getJobPreviewUrl(job)"
+          :is-video-preview="isVideoPreviewJob(job)"
+          :preview-alt="job.title"
+          :icon-name="job.iconName ?? iconForJobState(job.state)"
+          :icon-class="getJobIconClass(job)"
+          :primary-text="job.title"
+          :secondary-text="job.meta"
+          :progress-total-percent="job.progressTotalPercent"
+          :progress-current-percent="job.progressCurrentPercent"
+          @contextmenu.prevent.stop="$emit('menu', job, $event)"
+          @dblclick.stop="emitViewItem(job)"
+          @preview-click="emitViewItem(job)"
+          @click.stop
         >
-          {{ row.label }}
-        </div>
-        <div
-          v-else-if="row.type === 'job'"
-          class="box-border px-3"
-          :style="{ height: `${row.height}px` }"
-        >
-          <div
-            :data-job-id="row.job.id"
-            class="h-12"
-            @mouseenter="onJobEnter(row.job, $event)"
-            @mouseleave="onJobLeave(row.job.id)"
-          >
-            <AssetsListItem
-              :class="
-                cn(
-                  'size-full shrink-0 cursor-default text-text-primary transition-colors hover:bg-secondary-background-hover',
-                  row.job.state === 'running' && 'bg-secondary-background'
-                )
-              "
-              :preview-url="getJobPreviewUrl(row.job)"
-              :is-video-preview="isVideoPreviewJob(row.job)"
-              :preview-alt="row.job.title"
-              :icon-name="row.job.iconName ?? iconForJobState(row.job.state)"
-              :icon-class="getJobIconClass(row.job)"
-              :primary-text="row.job.title"
-              :secondary-text="row.job.meta"
-              :progress-total-percent="row.job.progressTotalPercent"
-              :progress-current-percent="row.job.progressCurrentPercent"
-              @contextmenu.prevent.stop="$emit('menu', row.job, $event)"
-              @dblclick.stop="emitViewItem(row.job)"
-              @preview-click="emitViewItem(row.job)"
-              @click.stop
+          <template v-if="hoveredJobId === job.id" #actions>
+            <Button
+              v-if="isCancelable(job)"
+              variant="destructive"
+              size="icon"
+              :aria-label="t('g.cancel')"
+              @click.stop="emitCancelItem(job)"
             >
-              <template v-if="hoveredJobId === row.job.id" #actions>
-                <Button
-                  v-if="isCancelable(row.job)"
-                  variant="destructive"
-                  size="icon"
-                  :aria-label="t('g.cancel')"
-                  @click.stop="emitCancelItem(row.job)"
-                >
-                  <i class="icon-[lucide--x] size-4" />
-                </Button>
-                <Button
-                  v-else-if="isFailedDeletable(row.job)"
-                  variant="destructive"
-                  size="icon"
-                  :aria-label="t('g.delete')"
-                  @click.stop="emitDeleteItem(row.job)"
-                >
-                  <i class="icon-[lucide--trash-2] size-4" />
-                </Button>
-                <Button
-                  v-else-if="row.job.state === 'completed'"
-                  variant="textonly"
-                  size="sm"
-                  @click.stop="emitCompletedViewItem(row.job)"
-                >
-                  {{ t('menuLabels.View') }}
-                </Button>
-                <Button
-                  variant="secondary"
-                  size="icon"
-                  :aria-label="t('g.more')"
-                  @click.stop="$emit('menu', row.job, $event)"
-                >
-                  <i class="icon-[lucide--ellipsis] size-4" />
-                </Button>
-              </template>
-            </AssetsListItem>
-          </div>
-        </div>
-      </template>
+              <i class="icon-[lucide--x] size-4" />
+            </Button>
+            <Button
+              v-else-if="isFailedDeletable(job)"
+              variant="destructive"
+              size="icon"
+              :aria-label="t('g.delete')"
+              @click.stop="emitDeleteItem(job)"
+            >
+              <i class="icon-[lucide--trash-2] size-4" />
+            </Button>
+            <Button
+              v-else-if="job.state === 'completed'"
+              variant="textonly"
+              size="sm"
+              @click.stop="emitCompletedViewItem(job)"
+            >
+              {{ t('menuLabels.View') }}
+            </Button>
+            <Button
+              variant="secondary"
+              size="icon"
+              :aria-label="t('g.more')"
+              @click.stop="$emit('menu', job, $event)"
+            >
+              <i class="icon-[lucide--ellipsis] size-4" />
+            </Button>
+          </template>
+        </AssetsListItem>
+      </div>
     </div>
   </div>
 
@@ -111,9 +97,8 @@
 </template>
 
 <script setup lang="ts">
-import { useVirtualList } from '@vueuse/core'
 import { useI18n } from 'vue-i18n'
-import { computed, nextTick, ref } from 'vue'
+import { nextTick, ref } from 'vue'
 
 import JobDetailsPopover from '@/components/queue/job/JobDetailsPopover.vue'
 import { getHoverPopoverPosition } from '@/components/queue/job/getHoverPopoverPosition'
@@ -125,16 +110,6 @@ import { cn } from '@/utils/tailwindUtil'
 import { iconForJobState } from '@/utils/queueDisplay'
 import { isActiveJobState } from '@/utils/queueUtil'
 
-import {
-  buildVirtualJobRows,
-  JOB_ROW_HEIGHT,
-  VIRTUAL_JOB_LIST_BOTTOM_PADDING
-} from './buildVirtualJobRows'
-
-defineOptions({
-  inheritAttrs: false
-})
-
 const { displayedJobGroups } = defineProps<{ displayedJobGroups: JobGroup[] }>()
 
 const emit = defineEmits<{
@@ -148,23 +123,6 @@ const { t } = useI18n()
 const hoveredJobId = ref<string | null>(null)
 const activeRowElement = ref<HTMLElement | null>(null)
 const popoverPosition = ref<{ top: number; left: number } | null>(null)
-const flatRows = computed(() => buildVirtualJobRows(displayedJobGroups))
-const {
-  list: virtualRows,
-  containerProps,
-  wrapperProps
-} = useVirtualList(flatRows, {
-  itemHeight: (index) => flatRows.value[index]?.height ?? JOB_ROW_HEIGHT,
-  overscan: 12
-})
-const virtualWrapperStyle = computed(() => ({
-  ...wrapperProps.value.style,
-  width: '100%',
-  paddingBottom:
-    flatRows.value.length > 0
-      ? `${VIRTUAL_JOB_LIST_BOTTOM_PADDING}px`
-      : undefined
-}))
 const {
   activeDetails,
   clearHoverTimers,
@@ -177,12 +135,6 @@ const {
   onReset: clearPopoverAnchor
 })
 
-function onListScroll() {
-  containerProps.onScroll()
-  hoveredJobId.value = null
-  resetActiveDetails()
-}
-
 function clearPopoverAnchor() {
   activeRowElement.value = null
   popoverPosition.value = null

src/components/queue/job/buildVirtualJobRows.test.ts

@@ -1,89 +0,0 @@
-import { describe, expect, it } from 'vitest'
-
-import type { JobGroup, JobListItem } from '@/composables/queue/useJobList'
-
-import { buildVirtualJobRows } from './buildVirtualJobRows'
-
-function buildJob(id: string): JobListItem {
-  return {
-    id,
-    title: `Job ${id}`,
-    meta: 'meta',
-    state: 'completed'
-  }
-}
-
-describe('buildVirtualJobRows', () => {
-  it('flattens grouped jobs into headers and rows in display order', () => {
-    const displayedJobGroups: JobGroup[] = [
-      {
-        key: 'today',
-        label: 'Today',
-        items: [buildJob('job-1'), buildJob('job-2')]
-      },
-      {
-        key: 'yesterday',
-        label: 'Yesterday',
-        items: [buildJob('job-3')]
-      }
-    ]
-
-    expect(buildVirtualJobRows(displayedJobGroups)).toEqual([
-      {
-        key: 'header-today',
-        type: 'header',
-        label: 'Today',
-        height: 20
-      },
-      {
-        key: 'job-job-1',
-        type: 'job',
-        job: displayedJobGroups[0].items[0],
-        height: 48
-      },
-      {
-        key: 'job-job-2',
-        type: 'job',
-        job: displayedJobGroups[0].items[1],
-        height: 64
-      },
-      {
-        key: 'header-yesterday',
-        type: 'header',
-        label: 'Yesterday',
-        height: 20
-      },
-      {
-        key: 'job-job-3',
-        type: 'job',
-        job: displayedJobGroups[1].items[0],
-        height: 48
-      }
-    ])
-  })
-
-  it('keeps the last group rows at the base job height', () => {
-    const displayedJobGroups: JobGroup[] = [
-      {
-        key: 'today',
-        label: 'Today',
-        items: [buildJob('job-1')]
-      }
-    ]
-
-    expect(buildVirtualJobRows(displayedJobGroups)).toEqual([
-      {
-        key: 'header-today',
-        type: 'header',
-        label: 'Today',
-        height: 20
-      },
-      {
-        key: 'job-job-1',
-        type: 'job',
-        job: displayedJobGroups[0].items[0],
-        height: 48
-      }
-    ])
-  })
-})

src/components/queue/job/buildVirtualJobRows.ts

@@ -1,52 +0,0 @@
-import type { JobGroup, JobListItem } from '@/composables/queue/useJobList'
-
-const HEADER_ROW_HEIGHT = 20
-const GROUP_ROW_GAP = 16
-export const JOB_ROW_HEIGHT = 48
-export const VIRTUAL_JOB_LIST_BOTTOM_PADDING = 16
-
-export type VirtualJobRow =
-  | {
-      key: string
-      type: 'header'
-      label: string
-      height: number
-    }
-  | {
-      key: string
-      type: 'job'
-      job: JobListItem
-      height: number
-    }
-
-export function buildVirtualJobRows(
-  displayedJobGroups: JobGroup[]
-): VirtualJobRow[] {
-  const rows: VirtualJobRow[] = []
-  const lastGroupIndex = displayedJobGroups.length - 1
-
-  displayedJobGroups.forEach((group, groupIndex) => {
-    rows.push({
-      key: `header-${group.key}`,
-      type: 'header',
-      label: group.label,
-      height: HEADER_ROW_HEIGHT
-    })
-
-    group.items.forEach((job, jobIndex) => {
-      const isLastJobInGroup = jobIndex === group.items.length - 1
-      const isLastGroup = groupIndex === lastGroupIndex
-
-      rows.push({
-        key: `job-${job.id}`,
-        type: 'job',
-        job,
-        height:
-          JOB_ROW_HEIGHT +
-          (isLastJobInGroup && !isLastGroup ? GROUP_ROW_GAP : 0)
-      })
-    })
-  })
-
-  return rows
-}

src/components/searchbox/v2/NodeSearchListItem.vue

@@ -20,7 +20,7 @@
       </div>
       <div
         v-if="showDescription"
-        class="flex items-center gap-1 text-[11px] text-muted-foreground"
+        class="flex items-center gap-1 text-2xs text-muted-foreground"
       >
         <span
           v-if="

src/components/sidebar/SidebarIcon.vue

@@ -31,7 +31,7 @@
             v-if="shouldShowBadge"
             :class="
               cn(
-                'sidebar-icon-badge absolute min-w-[16px] rounded-full bg-primary-background py-0.25 text-[10px] leading-[14px] font-medium text-base-foreground',
+                'sidebar-icon-badge absolute min-w-[16px] rounded-full bg-primary-background py-0.25 text-2xs leading-[14px] font-medium text-base-foreground',
                 badgeClass || '-top-1 -right-1'
               )
             "
@@ -42,7 +42,7 @@
       </slot>
       <span
         v-if="label && !isSmall"
-        class="side-bar-button-label text-center text-[10px]"
+        class="side-bar-button-label text-center text-2xs"
         >{{ st(label, label) }}</span
       >
     </div>

src/components/sidebar/tabs/JobHistorySidebarTab.test.ts

@@ -5,30 +5,6 @@ import { defineComponent, nextTick } from 'vue'
 
 import JobHistorySidebarTab from './JobHistorySidebarTab.vue'
 
-vi.mock('@vueuse/core', async () => {
-  const actual = await vi.importActual<Record<string, unknown>>('@vueuse/core')
-  const vue = await import('vue')
-
-  return {
-    ...actual,
-    useVirtualList: (rows: unknown) => ({
-      list: vue.computed(() =>
-        vue.unref(rows as readonly unknown[]).map((data: unknown, index) => ({
-          data,
-          index
-        }))
-      ),
-      scrollTo: vi.fn(),
-      containerProps: {
-        ref: vue.ref(null),
-        onScroll: vi.fn(),
-        style: {}
-      },
-      wrapperProps: vue.computed(() => ({ style: {} }))
-    })
-  }
-})
-
 const JobDetailsPopoverStub = defineComponent({
   name: 'JobDetailsPopover',
   props: {

src/components/sidebar/tabs/JobHistorySidebarTab.vue

@@ -46,25 +46,22 @@
       </div>
     </template>
     <template #body>
-      <div class="flex h-full min-h-0 flex-col">
-        <JobAssetsList
-          class="min-h-0 flex-1"
-          :displayed-job-groups="displayedJobGroups"
-          @cancel-item="onCancelItem"
-          @delete-item="onDeleteItem"
-          @view-item="onViewItem"
-          @menu="onMenuItem"
-        />
-        <JobContextMenu
-          ref="jobContextMenuRef"
-          :entries="jobMenuEntries"
-          @action="onJobMenuAction"
-        />
-        <MediaLightbox
-          v-model:active-index="galleryActiveIndex"
-          :all-gallery-items="galleryItems"
-        />
-      </div>
+      <JobAssetsList
+        :displayed-job-groups="displayedJobGroups"
+        @cancel-item="onCancelItem"
+        @delete-item="onDeleteItem"
+        @view-item="onViewItem"
+        @menu="onMenuItem"
+      />
+      <JobContextMenu
+        ref="jobContextMenuRef"
+        :entries="jobMenuEntries"
+        @action="onJobMenuAction"
+      />
+      <MediaLightbox
+        v-model:active-index="galleryActiveIndex"
+        :all-gallery-items="galleryItems"
+      />
     </template>
   </SidebarTabTemplate>
 </template>

src/components/sidebar/tabs/modelLibrary/ModelPreview.vue

@@ -85,7 +85,7 @@ const modelDef = props.modelDef
   display: inline-block;
   text-align: center;
   margin: 5px;
-  font-size: 10px;
+  font-size: var(--text-2xs);
 }
 .model_preview_prefix {
   font-weight: 700;

src/components/topbar/CurrentUserPopoverLegacy.test.ts

@@ -61,10 +61,10 @@ vi.mock('@/composables/auth/useCurrentUser', () => ({
   }))
 }))
 
-// Mock the useFirebaseAuthActions composable
+// Mock the useAuthActions composable
 const mockLogout = vi.fn()
-vi.mock('@/composables/auth/useFirebaseAuthActions', () => ({
-  useFirebaseAuthActions: vi.fn(() => ({
+vi.mock('@/composables/auth/useAuthActions', () => ({
+  useAuthActions: vi.fn(() => ({
     fetchBalance: vi.fn().mockResolvedValue(undefined),
     logout: mockLogout
   }))
@@ -77,7 +77,7 @@ vi.mock('@/services/dialogService', () => ({
   }))
 }))
 
-// Mock the firebaseAuthStore with hoisted state for per-test manipulation
+// Mock the authStore with hoisted state for per-test manipulation
 const mockAuthStoreState = vi.hoisted(() => ({
   balance: {
     amount_micros: 100_000,
@@ -91,8 +91,8 @@ const mockAuthStoreState = vi.hoisted(() => ({
   isFetchingBalance: false
 }))
 
-vi.mock('@/stores/firebaseAuthStore', () => ({
-  useFirebaseAuthStore: vi.fn(() => ({
+vi.mock('@/stores/authStore', () => ({
+  useAuthStore: vi.fn(() => ({
     getAuthHeader: vi
       .fn()
       .mockResolvedValue({ Authorization: 'Bearer mock-token' }),

src/components/topbar/CurrentUserPopoverLegacy.vue

@@ -159,7 +159,7 @@ import { formatCreditsFromCents } from '@/base/credits/comfyCredits'
 import UserAvatar from '@/components/common/UserAvatar.vue'
 import Button from '@/components/ui/button/Button.vue'
 import { useCurrentUser } from '@/composables/auth/useCurrentUser'
-import { useFirebaseAuthActions } from '@/composables/auth/useFirebaseAuthActions'
+import { useAuthActions } from '@/composables/auth/useAuthActions'
 import { useExternalLink } from '@/composables/useExternalLink'
 import SubscribeButton from '@/platform/cloud/subscription/components/SubscribeButton.vue'
 import { useSubscription } from '@/platform/cloud/subscription/composables/useSubscription'
@@ -168,7 +168,7 @@ import { isCloud } from '@/platform/distribution/types'
 import { useTelemetry } from '@/platform/telemetry'
 import { useSettingsDialog } from '@/platform/settings/composables/useSettingsDialog'
 import { useDialogService } from '@/services/dialogService'
-import { useFirebaseAuthStore } from '@/stores/firebaseAuthStore'
+import { useAuthStore } from '@/stores/authStore'
 
 const emit = defineEmits<{
   close: []
@@ -178,8 +178,8 @@ const { buildDocsUrl, docsPaths } = useExternalLink()
 
 const { userDisplayName, userEmail, userPhotoUrl, handleSignOut } =
   useCurrentUser()
-const authActions = useFirebaseAuthActions()
-const authStore = useFirebaseAuthStore()
+const authActions = useAuthActions()
+const authStore = useAuthStore()
 const settingsDialog = useSettingsDialog()
 const dialogService = useDialogService()
 const {

src/composables/auth/useAuthActions.ts

@@ -11,8 +11,8 @@ import { useTelemetry } from '@/platform/telemetry'
 import { useToastStore } from '@/platform/updates/common/toastStore'
 import { useWorkflowStore } from '@/platform/workflow/management/stores/workflowStore'
 import { useDialogService } from '@/services/dialogService'
-import { useFirebaseAuthStore } from '@/stores/firebaseAuthStore'
-import type { BillingPortalTargetTier } from '@/stores/firebaseAuthStore'
+import { useAuthStore } from '@/stores/authStore'
+import type { BillingPortalTargetTier } from '@/stores/authStore'
 import { usdToMicros } from '@/utils/formatUtil'
 
 /**
@@ -20,8 +20,8 @@ import { usdToMicros } from '@/utils/formatUtil'
  * All actions are wrapped with error handling.
  * @returns {Object} - Object containing all Firebase Auth actions
  */
-export const useFirebaseAuthActions = () => {
-  const authStore = useFirebaseAuthStore()
+export const useAuthActions = () => {
+  const authStore = useAuthStore()
   const toastStore = useToastStore()
   const { wrapWithErrorHandlingAsync, toastErrorHandler } = useErrorHandling()
 

src/composables/auth/useCurrentUser.ts

@@ -3,11 +3,11 @@ import { computed, watch } from 'vue'
 
 import { useApiKeyAuthStore } from '@/stores/apiKeyAuthStore'
 import { useCommandStore } from '@/stores/commandStore'
-import { useFirebaseAuthStore } from '@/stores/firebaseAuthStore'
+import { useAuthStore } from '@/stores/authStore'
 import type { AuthUserInfo } from '@/types/authTypes'
 
 export const useCurrentUser = () => {
-  const authStore = useFirebaseAuthStore()
+  const authStore = useAuthStore()
   const commandStore = useCommandStore()
   const apiKeyStore = useApiKeyAuthStore()
 

src/composables/billing/useBillingContext.test.ts

@@ -70,8 +70,8 @@ vi.mock(
   })
 )
 
-vi.mock('@/stores/firebaseAuthStore', () => ({
-  useFirebaseAuthStore: () => ({
+vi.mock('@/stores/authStore', () => ({
+  useAuthStore: () => ({
     balance: { amount_micros: 5000000 },
     fetchBalance: vi.fn().mockResolvedValue({ amount_micros: 5000000 })
   })

src/composables/billing/useLegacyBilling.ts

@@ -5,7 +5,7 @@ import type {
   PreviewSubscribeResponse,
   SubscribeResponse
 } from '@/platform/workspace/api/workspaceApi'
-import { useFirebaseAuthStore } from '@/stores/firebaseAuthStore'
+import { useAuthStore } from '@/stores/authStore'
 
 import type {
   BalanceInfo,
@@ -33,7 +33,7 @@ export function useLegacyBilling(): BillingState & BillingActions {
     showSubscriptionDialog: legacyShowSubscriptionDialog
   } = useSubscription()
 
-  const firebaseAuthStore = useFirebaseAuthStore()
+  const authStore = useAuthStore()
 
   const isInitialized = ref(false)
   const isLoading = ref(false)
@@ -55,12 +55,12 @@ export function useLegacyBilling(): BillingState & BillingActions {
       renewalDate: formattedRenewalDate.value || null,
       endDate: formattedEndDate.value || null,
       isCancelled: isCancelled.value,
-      hasFunds: (firebaseAuthStore.balance?.amount_micros ?? 0) > 0
+      hasFunds: (authStore.balance?.amount_micros ?? 0) > 0
     }
   })
 
   const balance = computed<BalanceInfo | null>(() => {
-    const legacyBalance = firebaseAuthStore.balance
+    const legacyBalance = authStore.balance
     if (!legacyBalance) return null
 
     return {
@@ -118,7 +118,7 @@ export function useLegacyBilling(): BillingState & BillingActions {
     isLoading.value = true
     error.value = null
     try {
-      await firebaseAuthStore.fetchBalance()
+      await authStore.fetchBalance()
     } catch (err) {
       error.value =
         err instanceof Error ? err.message : 'Failed to fetch balance'

src/composables/useCoreCommands.test.ts

@@ -56,8 +56,8 @@ vi.mock('@/scripts/api', () => ({
 
 vi.mock('@/platform/settings/settingStore')
 
-vi.mock('@/stores/firebaseAuthStore', () => ({
-  useFirebaseAuthStore: vi.fn(() => ({}))
+vi.mock('@/stores/authStore', () => ({
+  useAuthStore: vi.fn(() => ({}))
 }))
 
 vi.mock('@/composables/auth/useFirebaseAuth', () => ({
@@ -123,8 +123,8 @@ vi.mock('@/stores/workspace/colorPaletteStore', () => ({
   useColorPaletteStore: vi.fn(() => ({}))
 }))
 
-vi.mock('@/composables/auth/useFirebaseAuthActions', () => ({
-  useFirebaseAuthActions: vi.fn(() => ({}))
+vi.mock('@/composables/auth/useAuthActions', () => ({
+  useAuthActions: vi.fn(() => ({}))
 }))
 
 vi.mock('@/platform/cloud/subscription/composables/useSubscription', () => ({

src/composables/useCoreCommands.ts

@@ -1,5 +1,5 @@
 import { useCurrentUser } from '@/composables/auth/useCurrentUser'
-import { useFirebaseAuthActions } from '@/composables/auth/useFirebaseAuthActions'
+import { useAuthActions } from '@/composables/auth/useAuthActions'
 import { useSelectedLiteGraphItems } from '@/composables/canvas/useSelectedLiteGraphItems'
 import { useSubgraphOperations } from '@/composables/graph/useSubgraphOperations'
 import { useExternalLink } from '@/composables/useExternalLink'
@@ -78,7 +78,7 @@ export function useCoreCommands(): ComfyCommand[] {
   const settingsDialog = useSettingsDialog()
   const dialogService = useDialogService()
   const colorPaletteStore = useColorPaletteStore()
-  const firebaseAuthActions = useFirebaseAuthActions()
+  const authActions = useAuthActions()
   const toastStore = useToastStore()
   const canvasStore = useCanvasStore()
   const executionStore = useExecutionStore()
@@ -996,7 +996,7 @@ export function useCoreCommands(): ComfyCommand[] {
       label: 'Sign Out',
       versionAdded: '1.18.1',
       function: async () => {
-        await firebaseAuthActions.logout()
+        await authActions.logout()
       }
     },
     {

src/main.ts

@@ -67,7 +67,14 @@ Sentry.init({
   replaysOnErrorSampleRate: 0,
   // Only set these for non-cloud builds
   ...(isCloud
-    ? {}
+    ? {
+        integrations: [
+          // Disable event target wrapping to reduce overhead on high-frequency
+          // DOM events (pointermove, mousemove, wheel). Sentry still captures
+          // errors via window.onerror and unhandledrejection.
+          Sentry.browserApiErrorsIntegration({ eventTarget: false })
+        ]
+      }
     : {
         integrations: [],
         autoSessionTracking: false,

src/platform/assets/components/MediaAssetCard.vue

@@ -141,6 +141,7 @@ import { computed, defineAsyncComponent, provide, ref, toRef } from 'vue'
 import IconGroup from '@/components/button/IconGroup.vue'
 import LoadingOverlay from '@/components/common/LoadingOverlay.vue'
 import Button from '@/components/ui/button/Button.vue'
+import { isCloud } from '@/platform/distribution/types'
 import { useAssetsStore } from '@/stores/assetsStore'
 import {
   formatDuration,
@@ -279,7 +280,8 @@ const formattedDuration = computed(() => {
 // Get metadata info based on file kind
 const metaInfo = computed(() => {
   if (!asset) return ''
-  if (fileKind.value === 'image' && imageDimensions.value) {
+  // TODO(assets): Re-enable once /assets API returns original image dimensions in metadata (#10590)
+  if (fileKind.value === 'image' && imageDimensions.value && !isCloud) {
     return `${imageDimensions.value.width}x${imageDimensions.value.height}`
   }
   if (asset.size && ['video', 'audio', '3D'].includes(fileKind.value)) {

src/platform/auth/session/useSessionCookie.ts

@@ -1,7 +1,7 @@
 import { useFeatureFlags } from '@/composables/useFeatureFlags'
 import { isCloud } from '@/platform/distribution/types'
 import { api } from '@/scripts/api'
-import { useFirebaseAuthStore } from '@/stores/firebaseAuthStore'
+import { useAuthStore } from '@/stores/authStore'
 
 /**
  * Session cookie management for cloud authentication.
@@ -21,7 +21,7 @@ export const useSessionCookie = () => {
 
     const { flags } = useFeatureFlags()
     try {
-      const authStore = useFirebaseAuthStore()
+      const authStore = useAuthStore()
 
       let authHeader: Record<string, string>
 

src/platform/cloud/notification/components/DesktopCloudNotificationController.test.ts

@@ -0,0 +1,135 @@
+import { flushPromises, mount } from '@vue/test-utils'
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
+import { nextTick } from 'vue'
+
+import DesktopCloudNotificationController from './DesktopCloudNotificationController.vue'
+
+const settingState = {
+  shown: false
+}
+
+const settingStore = {
+  load: vi.fn<() => Promise<void>>(),
+  get: vi.fn((key: string) =>
+    key === 'Comfy.Desktop.CloudNotificationShown'
+      ? settingState.shown
+      : undefined
+  ),
+  set: vi.fn(async (_key: string, value: boolean) => {
+    settingState.shown = value
+  })
+}
+
+const dialogService = {
+  showCloudNotification: vi.fn<() => Promise<void>>()
+}
+
+const electron = {
+  getPlatform: vi.fn(() => 'darwin')
+}
+
+vi.mock('@/platform/distribution/types', () => ({
+  isDesktop: true
+}))
+
+vi.mock('@/platform/settings/settingStore', () => ({
+  useSettingStore: () => settingStore
+}))
+
+vi.mock('@/services/dialogService', () => ({
+  useDialogService: () => dialogService
+}))
+
+vi.mock('@/utils/envUtil', () => ({
+  electronAPI: () => electron
+}))
+
+function createDeferred() {
+  let resolve!: () => void
+  const promise = new Promise<void>((res) => {
+    resolve = res
+  })
+
+  return { promise, resolve }
+}
+
+describe('DesktopCloudNotificationController', () => {
+  beforeEach(() => {
+    vi.useFakeTimers()
+    vi.clearAllMocks()
+
+    settingState.shown = false
+    electron.getPlatform.mockReturnValue('darwin')
+    settingStore.load.mockResolvedValue(undefined)
+    settingStore.set.mockImplementation(
+      async (_key: string, value: boolean) => {
+        settingState.shown = value
+      }
+    )
+    dialogService.showCloudNotification.mockResolvedValue(undefined)
+  })
+
+  afterEach(() => {
+    vi.useRealTimers()
+  })
+
+  it('waits for settings to load before deciding whether to show the notification', async () => {
+    const loadSettings = createDeferred()
+    settingStore.load.mockImplementation(() => loadSettings.promise)
+
+    const wrapper = mount(DesktopCloudNotificationController)
+    await nextTick()
+
+    settingState.shown = true
+    loadSettings.resolve()
+
+    await flushPromises()
+    await vi.advanceTimersByTimeAsync(2000)
+
+    expect(dialogService.showCloudNotification).not.toHaveBeenCalled()
+
+    wrapper.unmount()
+  })
+
+  it('does not schedule or show the notification after unmounting before settings load resolves', async () => {
+    const loadSettings = createDeferred()
+    settingStore.load.mockImplementation(() => loadSettings.promise)
+
+    const wrapper = mount(DesktopCloudNotificationController)
+    await nextTick()
+
+    wrapper.unmount()
+    loadSettings.resolve()
+
+    await flushPromises()
+    await vi.advanceTimersByTimeAsync(2000)
+
+    expect(settingStore.set).not.toHaveBeenCalled()
+    expect(dialogService.showCloudNotification).not.toHaveBeenCalled()
+  })
+
+  it('marks the notification as shown before awaiting dialog close', async () => {
+    const dialogOpen = createDeferred()
+    dialogService.showCloudNotification.mockImplementation(
+      () => dialogOpen.promise
+    )
+
+    const wrapper = mount(DesktopCloudNotificationController)
+
+    await flushPromises()
+    await vi.advanceTimersByTimeAsync(2000)
+
+    expect(settingStore.set).toHaveBeenCalledWith(
+      'Comfy.Desktop.CloudNotificationShown',
+      true
+    )
+    expect(settingStore.set.mock.invocationCallOrder[0]).toBeLessThan(
+      dialogService.showCloudNotification.mock.invocationCallOrder[0]
+    )
+
+    dialogOpen.resolve()
+    await flushPromises()
+
+    wrapper.unmount()
+  })
+})

src/platform/cloud/notification/components/DesktopCloudNotificationController.vue

@@ -0,0 +1,57 @@
+<script setup lang="ts">
+import { onMounted, onUnmounted } from 'vue'
+
+import { isDesktop } from '@/platform/distribution/types'
+import { useSettingStore } from '@/platform/settings/settingStore'
+import { useDialogService } from '@/services/dialogService'
+import { electronAPI } from '@/utils/envUtil'
+
+const settingStore = useSettingStore()
+const dialogService = useDialogService()
+
+let isDisposed = false
+let cloudNotificationTimer: ReturnType<typeof setTimeout> | undefined
+
+async function scheduleCloudNotification() {
+  if (!isDesktop || electronAPI()?.getPlatform() !== 'darwin') return
+
+  try {
+    await settingStore.load()
+  } catch (error) {
+    console.warn('[CloudNotification] Failed to load settings', error)
+    return
+  }
+
+  if (isDisposed) return
+  if (settingStore.get('Comfy.Desktop.CloudNotificationShown')) return
+
+  cloudNotificationTimer = setTimeout(async () => {
+    if (isDisposed) return
+
+    try {
+      await settingStore.set('Comfy.Desktop.CloudNotificationShown', true)
+      if (isDisposed) return
+      await dialogService.showCloudNotification()
+    } catch (error) {
+      console.warn('[CloudNotification] Failed to show', error)
+      await settingStore
+        .set('Comfy.Desktop.CloudNotificationShown', false)
+        .catch((resetError) => {
+          console.warn(
+            '[CloudNotification] Failed to reset shown state',
+            resetError
+          )
+        })
+    }
+  }, 2000)
+}
+
+onMounted(() => {
+  void scheduleCloudNotification()
+})
+
+onUnmounted(() => {
+  isDisposed = true
+  if (cloudNotificationTimer) clearTimeout(cloudNotificationTimer)
+})
+</script>

src/platform/cloud/onboarding/CloudAuthTimeoutView.vue

@@ -74,7 +74,7 @@ import { ref } from 'vue'
 import { useRouter } from 'vue-router'
 
 import Button from '@/components/ui/button/Button.vue'
-import { useFirebaseAuthActions } from '@/composables/auth/useFirebaseAuthActions'
+import { useAuthActions } from '@/composables/auth/useAuthActions'
 
 interface Props {
   errorMessage?: string
@@ -83,7 +83,7 @@ interface Props {
 defineProps<Props>()
 
 const router = useRouter()
-const { logout } = useFirebaseAuthActions()
+const { logout } = useAuthActions()
 const showTechnicalDetails = ref(false)
 
 const handleRestart = async () => {

src/platform/cloud/onboarding/CloudForgotPasswordView.vue

@@ -76,11 +76,11 @@ import { useI18n } from 'vue-i18n'
 import { useRouter } from 'vue-router'
 
 import Button from '@/components/ui/button/Button.vue'
-import { useFirebaseAuthActions } from '@/composables/auth/useFirebaseAuthActions'
+import { useAuthActions } from '@/composables/auth/useAuthActions'
 
 const { t } = useI18n()
 const router = useRouter()
-const authActions = useFirebaseAuthActions()
+const authActions = useAuthActions()
 
 const email = ref('')
 const loading = ref(false)

src/platform/cloud/onboarding/CloudLoginView.vue

@@ -110,7 +110,7 @@ import { useI18n } from 'vue-i18n'
 import { useRoute, useRouter } from 'vue-router'
 
 import Button from '@/components/ui/button/Button.vue'
-import { useFirebaseAuthActions } from '@/composables/auth/useFirebaseAuthActions'
+import { useAuthActions } from '@/composables/auth/useAuthActions'
 import CloudSignInForm from '@/platform/cloud/onboarding/components/CloudSignInForm.vue'
 import { useFreeTierOnboarding } from '@/platform/cloud/onboarding/composables/useFreeTierOnboarding'
 import { getSafePreviousFullPath } from '@/platform/cloud/onboarding/utils/previousFullPath'
@@ -120,7 +120,7 @@ import type { SignInData } from '@/schemas/signInSchema'
 const { t } = useI18n()
 const router = useRouter()
 const route = useRoute()
-const authActions = useFirebaseAuthActions()
+const authActions = useAuthActions()
 const isSecureContext = globalThis.isSecureContext
 const authError = ref('')
 const toastStore = useToastStore()

src/platform/cloud/onboarding/CloudSignupView.vue

@@ -42,7 +42,7 @@
             </Button>
             <span
               v-if="isFreeTierEnabled"
-              class="absolute -top-2.5 -right-2.5 rounded-full bg-yellow-400 px-2 py-0.5 text-[10px] font-bold whitespace-nowrap text-gray-900"
+              class="absolute -top-2.5 -right-2.5 rounded-full bg-yellow-400 px-2 py-0.5 text-2xs font-bold whitespace-nowrap text-gray-900"
             >
               {{ t('auth.login.freeTierBadge') }}
             </span>
@@ -133,7 +133,7 @@ import { useRoute, useRouter } from 'vue-router'
 
 import SignUpForm from '@/components/dialog/content/signin/SignUpForm.vue'
 import Button from '@/components/ui/button/Button.vue'
-import { useFirebaseAuthActions } from '@/composables/auth/useFirebaseAuthActions'
+import { useAuthActions } from '@/composables/auth/useAuthActions'
 import { useFreeTierOnboarding } from '@/platform/cloud/onboarding/composables/useFreeTierOnboarding'
 import { getSafePreviousFullPath } from '@/platform/cloud/onboarding/utils/previousFullPath'
 import { isCloud } from '@/platform/distribution/types'
@@ -145,7 +145,7 @@ import { isInChina } from '@/utils/networkUtil'
 const { t } = useI18n()
 const router = useRouter()
 const route = useRoute()
-const authActions = useFirebaseAuthActions()
+const authActions = useAuthActions()
 const isSecureContext = globalThis.isSecureContext
 const authError = ref('')
 const userIsInChina = ref(false)

src/platform/cloud/onboarding/CloudSubscriptionRedirectView.test.ts

@@ -25,8 +25,8 @@ const authActionMocks = vi.hoisted(() => ({
   accessBillingPortal: vi.fn()
 }))
 
-vi.mock('@/composables/auth/useFirebaseAuthActions', () => ({
-  useFirebaseAuthActions: () => authActionMocks
+vi.mock('@/composables/auth/useAuthActions', () => ({
+  useAuthActions: () => authActionMocks
 }))
 
 vi.mock('@/composables/useErrorHandling', () => ({

src/platform/cloud/onboarding/CloudSubscriptionRedirectView.vue

@@ -6,7 +6,7 @@ import { useI18n } from 'vue-i18n'
 import { useRoute, useRouter } from 'vue-router'
 
 import { useBillingContext } from '@/composables/billing/useBillingContext'
-import { useFirebaseAuthActions } from '@/composables/auth/useFirebaseAuthActions'
+import { useAuthActions } from '@/composables/auth/useAuthActions'
 import { useErrorHandling } from '@/composables/useErrorHandling'
 import type { TierKey } from '@/platform/cloud/subscription/constants/tierPricing'
 import { performSubscriptionCheckout } from '@/platform/cloud/subscription/utils/subscriptionCheckoutUtil'
@@ -16,7 +16,7 @@ import type { BillingCycle } from '../subscription/utils/subscriptionTierRank'
 const { t } = useI18n()
 const route = useRoute()
 const router = useRouter()
-const { reportError, accessBillingPortal } = useFirebaseAuthActions()
+const { reportError, accessBillingPortal } = useAuthActions()
 const { wrapWithErrorHandlingAsync } = useErrorHandling()
 
 const { isActiveSubscription, isInitialized, initialize } = useBillingContext()

src/platform/cloud/onboarding/components/CloudSignInForm.vue

@@ -89,9 +89,9 @@ import { useI18n } from 'vue-i18n'
 import Button from '@/components/ui/button/Button.vue'
 import { signInSchema } from '@/schemas/signInSchema'
 import type { SignInData } from '@/schemas/signInSchema'
-import { useFirebaseAuthStore } from '@/stores/firebaseAuthStore'
+import { useAuthStore } from '@/stores/authStore'
 
-const authStore = useFirebaseAuthStore()
+const authStore = useAuthStore()
 const loading = computed(() => authStore.loading)
 
 const { t } = useI18n()

src/platform/cloud/subscription/components/PricingTable.test.ts

@@ -31,8 +31,8 @@ vi.mock('@/platform/cloud/subscription/composables/useSubscription', () => ({
   })
 }))
 
-vi.mock('@/composables/auth/useFirebaseAuthActions', () => ({
-  useFirebaseAuthActions: () => ({
+vi.mock('@/composables/auth/useAuthActions', () => ({
+  useAuthActions: () => ({
     accessBillingPortal: mockAccessBillingPortal,
     reportError: mockReportError
   })
@@ -56,13 +56,13 @@ vi.mock('@/composables/useErrorHandling', () => ({
   })
 }))
 
-vi.mock('@/stores/firebaseAuthStore', () => ({
-  useFirebaseAuthStore: () =>
+vi.mock('@/stores/authStore', () => ({
+  useAuthStore: () =>
     reactive({
       getAuthHeader: mockGetAuthHeader,
       userId: computed(() => mockUserId.value)
     }),
-  FirebaseAuthStoreError: class extends Error {}
+  AuthStoreError: class extends Error {}
 }))
 
 vi.mock('@/platform/telemetry', () => ({

src/platform/cloud/subscription/components/PricingTable.vue

@@ -30,7 +30,7 @@
             <span>{{ option.label }}</span>
             <div
               v-if="option.value === 'yearly'"
-              class="flex items-center rounded-full bg-primary-background px-1 py-0.5 text-[11px] font-bold text-white"
+              class="flex items-center rounded-full bg-primary-background px-1 py-0.5 text-2xs font-bold text-white"
             >
               -20%
             </div>
@@ -58,7 +58,7 @@
             </span>
             <div
               v-if="tier.isPopular"
-              class="flex h-5 items-center rounded-full bg-base-foreground px-1.5 text-[11px] font-bold tracking-tight text-base-background uppercase"
+              class="flex h-5 items-center rounded-full bg-base-foreground px-1.5 text-2xs font-bold tracking-tight text-base-background uppercase"
             >
               {{ t('subscription.mostPopular') }}
             </div>
@@ -262,7 +262,7 @@ import { computed, ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 
 import Button from '@/components/ui/button/Button.vue'
-import { useFirebaseAuthActions } from '@/composables/auth/useFirebaseAuthActions'
+import { useAuthActions } from '@/composables/auth/useAuthActions'
 import { useErrorHandling } from '@/composables/useErrorHandling'
 import { useSubscription } from '@/platform/cloud/subscription/composables/useSubscription'
 import {
@@ -279,7 +279,7 @@ import type { BillingCycle } from '@/platform/cloud/subscription/utils/subscript
 import { isCloud } from '@/platform/distribution/types'
 import { useTelemetry } from '@/platform/telemetry'
 import type { CheckoutAttributionMetadata } from '@/platform/telemetry/types'
-import { useFirebaseAuthStore } from '@/stores/firebaseAuthStore'
+import { useAuthStore } from '@/stores/authStore'
 import type { components } from '@/types/comfyRegistryTypes'
 
 type SubscriptionTier = components['schemas']['SubscriptionTier']
@@ -365,8 +365,8 @@ const {
   isYearlySubscription
 } = useSubscription()
 const telemetry = useTelemetry()
-const { userId } = storeToRefs(useFirebaseAuthStore())
-const { accessBillingPortal, reportError } = useFirebaseAuthActions()
+const { userId } = storeToRefs(useAuthStore())
+const { accessBillingPortal, reportError } = useAuthActions()
 const { wrapWithErrorHandlingAsync } = useErrorHandling()
 
 const isLoading = ref(false)

src/platform/cloud/subscription/components/SubscriptionPanel.test.ts

@@ -82,8 +82,8 @@ vi.mock(
   })
 )
 
-vi.mock('@/composables/auth/useFirebaseAuthActions', () => ({
-  useFirebaseAuthActions: vi.fn(() => ({
+vi.mock('@/composables/auth/useAuthActions', () => ({
+  useAuthActions: vi.fn(() => ({
     authActions: vi.fn(() => ({
       accessBillingPortal: vi.fn()
     }))

src/platform/cloud/subscription/components/SubscriptionPanelContentLegacy.vue

@@ -211,7 +211,7 @@ import { computed, onBeforeUnmount, onMounted } from 'vue'
 import { useI18n } from 'vue-i18n'
 
 import Button from '@/components/ui/button/Button.vue'
-import { useFirebaseAuthActions } from '@/composables/auth/useFirebaseAuthActions'
+import { useAuthActions } from '@/composables/auth/useAuthActions'
 import SubscribeButton from '@/platform/cloud/subscription/components/SubscribeButton.vue'
 import { useSubscription } from '@/platform/cloud/subscription/composables/useSubscription'
 import { useSubscriptionActions } from '@/platform/cloud/subscription/composables/useSubscriptionActions'
@@ -227,7 +227,7 @@ import type { TierBenefit } from '@/platform/cloud/subscription/utils/tierBenefi
 import { getCommonTierBenefits } from '@/platform/cloud/subscription/utils/tierBenefits'
 import { cn } from '@/utils/tailwindUtil'
 
-const authActions = useFirebaseAuthActions()
+const authActions = useAuthActions()
 const { t, n } = useI18n()
 
 const {

src/platform/cloud/subscription/composables/useSubscription.test.ts

@@ -65,8 +65,8 @@ vi.mock('@/platform/telemetry', () => ({
   useTelemetry: vi.fn(() => mockTelemetry)
 }))
 
-vi.mock('@/composables/auth/useFirebaseAuthActions', () => ({
-  useFirebaseAuthActions: vi.fn(() => ({
+vi.mock('@/composables/auth/useAuthActions', () => ({
+  useAuthActions: vi.fn(() => ({
     reportError: mockReportError,
     accessBillingPortal: mockAccessBillingPortal
   }))
@@ -106,14 +106,14 @@ vi.mock('@/services/dialogService', () => ({
   }))
 }))
 
-vi.mock('@/stores/firebaseAuthStore', () => ({
-  useFirebaseAuthStore: vi.fn(() => ({
+vi.mock('@/stores/authStore', () => ({
+  useAuthStore: vi.fn(() => ({
     getAuthHeader: mockGetAuthHeader,
     get userId() {
       return mockUserId.value
     }
   })),
-  FirebaseAuthStoreError: class extends Error {}
+  AuthStoreError: class extends Error {}
 }))
 
 // Mock fetch

src/platform/cloud/subscription/composables/useSubscription.ts

@@ -2,7 +2,7 @@ import { computed, ref, watch } from 'vue'
 import { createSharedComposable } from '@vueuse/core'
 
 import { useCurrentUser } from '@/composables/auth/useCurrentUser'
-import { useFirebaseAuthActions } from '@/composables/auth/useFirebaseAuthActions'
+import { useAuthActions } from '@/composables/auth/useAuthActions'
 import { useErrorHandling } from '@/composables/useErrorHandling'
 import { getComfyApiBaseUrl, getComfyPlatformBaseUrl } from '@/config/comfyApi'
 import { t } from '@/i18n'
@@ -10,10 +10,7 @@ import { isCloud } from '@/platform/distribution/types'
 import { useTelemetry } from '@/platform/telemetry'
 import type { SubscriptionDialogReason } from '@/platform/cloud/subscription/composables/useSubscriptionDialog'
 import type { CheckoutAttributionMetadata } from '@/platform/telemetry/types'
-import {
-  FirebaseAuthStoreError,
-  useFirebaseAuthStore
-} from '@/stores/firebaseAuthStore'
+import { AuthStoreError, useAuthStore } from '@/stores/authStore'
 import { useDialogService } from '@/services/dialogService'
 import { TIER_TO_KEY } from '@/platform/cloud/subscription/constants/tierPricing'
 import type { operations } from '@/types/comfyRegistryTypes'
@@ -37,11 +34,11 @@ function useSubscriptionInternal() {
 
     return subscriptionStatus.value?.is_active ?? false
   })
-  const { reportError, accessBillingPortal } = useFirebaseAuthActions()
+  const { reportError, accessBillingPortal } = useAuthActions()
   const { showSubscriptionRequiredDialog } = useDialogService()
 
-  const firebaseAuthStore = useFirebaseAuthStore()
-  const { getAuthHeader } = firebaseAuthStore
+  const authStore = useAuthStore()
+  const { getAuthHeader } = authStore
   const { wrapWithErrorHandlingAsync } = useErrorHandling()
 
   const { isLoggedIn } = useCurrentUser()
@@ -194,7 +191,7 @@ function useSubscriptionInternal() {
   async function fetchSubscriptionStatus(): Promise<CloudSubscriptionStatusResponse | null> {
     const authHeader = await getAuthHeader()
     if (!authHeader) {
-      throw new FirebaseAuthStoreError(t('toastMessages.userNotAuthenticated'))
+      throw new AuthStoreError(t('toastMessages.userNotAuthenticated'))
     }
 
     const response = await fetch(
@@ -209,7 +206,7 @@ function useSubscriptionInternal() {
 
     if (!response.ok) {
       const errorData = await response.json()
-      throw new FirebaseAuthStoreError(
+      throw new AuthStoreError(
         t('toastMessages.failedToFetchSubscription', {
           error: errorData.message
         })
@@ -248,9 +245,7 @@ function useSubscriptionInternal() {
     async (): Promise<CloudSubscriptionCheckoutResponse> => {
       const authHeader = await getAuthHeader()
       if (!authHeader) {
-        throw new FirebaseAuthStoreError(
-          t('toastMessages.userNotAuthenticated')
-        )
+        throw new AuthStoreError(t('toastMessages.userNotAuthenticated'))
       }
       const checkoutAttribution = await getCheckoutAttributionForCloud()
 
@@ -268,7 +263,7 @@ function useSubscriptionInternal() {
 
       if (!response.ok) {
         const errorData = await response.json()
-        throw new FirebaseAuthStoreError(
+        throw new AuthStoreError(
           t('toastMessages.failedToInitiateSubscription', {
             error: errorData.message
           })

src/platform/cloud/subscription/composables/useSubscriptionActions.test.ts

@@ -8,8 +8,8 @@ const mockFetchStatus = vi.fn()
 const mockShowTopUpCreditsDialog = vi.fn()
 const mockExecute = vi.fn()
 
-vi.mock('@/composables/auth/useFirebaseAuthActions', () => ({
-  useFirebaseAuthActions: () => ({
+vi.mock('@/composables/auth/useAuthActions', () => ({
+  useAuthActions: () => ({
     fetchBalance: mockFetchBalance
   })
 }))

src/platform/cloud/subscription/composables/useSubscriptionActions.ts

@@ -1,7 +1,7 @@
 import { onMounted, ref } from 'vue'
 
 import { useBillingContext } from '@/composables/billing/useBillingContext'
-import { useFirebaseAuthActions } from '@/composables/auth/useFirebaseAuthActions'
+import { useAuthActions } from '@/composables/auth/useAuthActions'
 import { isCloud } from '@/platform/distribution/types'
 import { useTelemetry } from '@/platform/telemetry'
 import { useDialogService } from '@/services/dialogService'
@@ -12,7 +12,7 @@ import { useCommandStore } from '@/stores/commandStore'
  */
 export function useSubscriptionActions() {
   const dialogService = useDialogService()
-  const authActions = useFirebaseAuthActions()
+  const authActions = useAuthActions()
   const commandStore = useCommandStore()
   const telemetry = useTelemetry()
   const { fetchStatus } = useBillingContext()

src/platform/cloud/subscription/utils/subscriptionCheckoutUtil.test.ts

@@ -36,14 +36,14 @@ vi.mock('@/platform/telemetry', () => ({
   useTelemetry: vi.fn(() => mockTelemetry)
 }))
 
-vi.mock('@/stores/firebaseAuthStore', () => ({
-  useFirebaseAuthStore: vi.fn(() =>
+vi.mock('@/stores/authStore', () => ({
+  useAuthStore: vi.fn(() =>
     reactive({
       getAuthHeader: mockGetAuthHeader,
       userId: computed(() => mockUserId.value)
     })
   ),
-  FirebaseAuthStoreError: class extends Error {}
+  AuthStoreError: class extends Error {}
 }))
 
 vi.mock('@/platform/distribution/types', () => ({

src/platform/cloud/subscription/utils/subscriptionCheckoutUtil.ts

@@ -4,10 +4,7 @@ import { getComfyApiBaseUrl } from '@/config/comfyApi'
 import { t } from '@/i18n'
 import { isCloud } from '@/platform/distribution/types'
 import { useTelemetry } from '@/platform/telemetry'
-import {
-  FirebaseAuthStoreError,
-  useFirebaseAuthStore
-} from '@/stores/firebaseAuthStore'
+import { AuthStoreError, useAuthStore } from '@/stores/authStore'
 import type { CheckoutAttributionMetadata } from '@/platform/telemetry/types'
 import type { TierKey } from '@/platform/cloud/subscription/constants/tierPricing'
 import type { BillingCycle } from './subscriptionTierRank'
@@ -51,13 +48,13 @@ export async function performSubscriptionCheckout(
 ): Promise<void> {
   if (!isCloud) return
 
-  const firebaseAuthStore = useFirebaseAuthStore()
-  const { userId } = storeToRefs(firebaseAuthStore)
+  const authStore = useAuthStore()
+  const { userId } = storeToRefs(authStore)
   const telemetry = useTelemetry()
-  const authHeader = await firebaseAuthStore.getAuthHeader()
+  const authHeader = await authStore.getAuthHeader()
 
   if (!authHeader) {
-    throw new FirebaseAuthStoreError(t('toastMessages.userNotAuthenticated'))
+    throw new AuthStoreError(t('toastMessages.userNotAuthenticated'))
   }
 
   const checkoutTier = getCheckoutTier(tierKey, currentBillingCycle)
@@ -97,7 +94,7 @@ export async function performSubscriptionCheckout(
       }
     }
 
-    throw new FirebaseAuthStoreError(
+    throw new AuthStoreError(
       t('toastMessages.failedToInitiateSubscription', {
         error: errorMessage
       })

src/platform/settings/components/SettingDialog.vue

@@ -90,7 +90,7 @@ import CurrentUserMessage from '@/components/dialog/content/setting/CurrentUserM
 import BaseModalLayout from '@/components/widget/layout/BaseModalLayout.vue'
 import NavItem from '@/components/widget/nav/NavItem.vue'
 import NavTitle from '@/components/widget/nav/NavTitle.vue'
-import { useFirebaseAuthActions } from '@/composables/auth/useFirebaseAuthActions'
+import { useAuthActions } from '@/composables/auth/useAuthActions'
 import ColorPaletteMessage from '@/platform/settings/components/ColorPaletteMessage.vue'
 import SettingsPanel from '@/platform/settings/components/SettingsPanel.vue'
 import { useSettingSearch } from '@/platform/settings/composables/useSettingSearch'
@@ -129,7 +129,7 @@ const {
   getSearchResults
 } = useSettingSearch()
 
-const authActions = useFirebaseAuthActions()
+const authActions = useAuthActions()
 
 const navRef = ref<HTMLElement | null>(null)
 const activeCategoryKey = ref<string | null>(defaultCategory.value?.key ?? null)

src/platform/telemetry/providers/cloud/ImpactTelemetryProvider.test.ts

@@ -6,7 +6,7 @@ type MockApiKeyUser = {
   email?: string
 } | null
 
-type MockFirebaseUser = {
+type MockAuthUser = {
   uid: string
   email?: string | null
 } | null
@@ -14,19 +14,19 @@ type MockFirebaseUser = {
 const {
   mockCaptureCheckoutAttributionFromSearch,
   mockUseApiKeyAuthStore,
-  mockUseFirebaseAuthStore,
+  mockUseAuthStore,
   mockApiKeyAuthStore,
-  mockFirebaseAuthStore
+  mockAuthStore
 } = vi.hoisted(() => ({
   mockCaptureCheckoutAttributionFromSearch: vi.fn(),
   mockUseApiKeyAuthStore: vi.fn(),
-  mockUseFirebaseAuthStore: vi.fn(),
+  mockUseAuthStore: vi.fn(),
   mockApiKeyAuthStore: {
     isAuthenticated: false,
     currentUser: null as MockApiKeyUser
   },
-  mockFirebaseAuthStore: {
-    currentUser: null as MockFirebaseUser
+  mockAuthStore: {
+    currentUser: null as MockAuthUser
   }
 }))
 
@@ -38,8 +38,8 @@ vi.mock('@/stores/apiKeyAuthStore', () => ({
   useApiKeyAuthStore: mockUseApiKeyAuthStore
 }))
 
-vi.mock('@/stores/firebaseAuthStore', () => ({
-  useFirebaseAuthStore: mockUseFirebaseAuthStore
+vi.mock('@/stores/authStore', () => ({
+  useAuthStore: mockUseAuthStore
 }))
 
 import { ImpactTelemetryProvider } from './ImpactTelemetryProvider'
@@ -64,14 +64,14 @@ describe('ImpactTelemetryProvider', () => {
   beforeEach(() => {
     mockCaptureCheckoutAttributionFromSearch.mockReset()
     mockUseApiKeyAuthStore.mockReset()
-    mockUseFirebaseAuthStore.mockReset()
+    mockUseAuthStore.mockReset()
     mockApiKeyAuthStore.isAuthenticated = false
     mockApiKeyAuthStore.currentUser = null
-    mockFirebaseAuthStore.currentUser = null
+    mockAuthStore.currentUser = null
     vi.restoreAllMocks()
     vi.unstubAllGlobals()
     mockUseApiKeyAuthStore.mockReturnValue(mockApiKeyAuthStore)
-    mockUseFirebaseAuthStore.mockReturnValue(mockFirebaseAuthStore)
+    mockUseAuthStore.mockReturnValue(mockAuthStore)
 
     const queueFn: NonNullable<Window['ire']> = (...args: unknown[]) => {
       ;(queueFn.a ??= []).push(args)
@@ -93,7 +93,7 @@ describe('ImpactTelemetryProvider', () => {
   })
 
   it('captures attribution and invokes identify with hashed email', async () => {
-    mockFirebaseAuthStore.currentUser = {
+    mockAuthStore.currentUser = {
       uid: 'user-123',
       email: ' User@Example.com '
     }
@@ -153,7 +153,7 @@ describe('ImpactTelemetryProvider', () => {
   })
 
   it('invokes identify on each page view even with identical identity payloads', async () => {
-    mockFirebaseAuthStore.currentUser = {
+    mockAuthStore.currentUser = {
       uid: 'user-123',
       email: 'user@example.com'
     }
@@ -189,7 +189,7 @@ describe('ImpactTelemetryProvider', () => {
       id: 'api-key-user-123',
       email: 'apikey@example.com'
     }
-    mockFirebaseAuthStore.currentUser = {
+    mockAuthStore.currentUser = {
       uid: 'firebase-user-123',
       email: 'firebase@example.com'
     }
@@ -228,7 +228,7 @@ describe('ImpactTelemetryProvider', () => {
       id: 'api-key-user-123',
       email: 'apikey@example.com'
     }
-    mockFirebaseAuthStore.currentUser = null
+    mockAuthStore.currentUser = null
     vi.stubGlobal('crypto', {
       subtle: {
         digest: vi.fn(

src/platform/telemetry/providers/cloud/ImpactTelemetryProvider.ts

@@ -1,6 +1,6 @@
 import { captureCheckoutAttributionFromSearch } from '@/platform/telemetry/utils/checkoutAttribution'
 import { useApiKeyAuthStore } from '@/stores/apiKeyAuthStore'
-import { useFirebaseAuthStore } from '@/stores/firebaseAuthStore'
+import { useAuthStore } from '@/stores/authStore'
 
 import type { PageViewMetadata, TelemetryProvider } from '../../types'
 
@@ -17,7 +17,7 @@ export class ImpactTelemetryProvider implements TelemetryProvider {
   private initialized = false
   private stores: {
     apiKeyAuthStore: ReturnType<typeof useApiKeyAuthStore>
-    firebaseAuthStore: ReturnType<typeof useFirebaseAuthStore>
+    authStore: ReturnType<typeof useAuthStore>
   } | null = null
 
   constructor() {
@@ -109,12 +109,11 @@ export class ImpactTelemetryProvider implements TelemetryProvider {
       }
     }
 
-    if (stores.firebaseAuthStore.currentUser) {
+    if (stores.authStore.currentUser) {
       return {
-        customerId:
-          stores.firebaseAuthStore.currentUser.uid ?? EMPTY_CUSTOMER_VALUE,
+        customerId: stores.authStore.currentUser.uid ?? EMPTY_CUSTOMER_VALUE,
         customerEmail:
-          stores.firebaseAuthStore.currentUser.email ?? EMPTY_CUSTOMER_VALUE
+          stores.authStore.currentUser.email ?? EMPTY_CUSTOMER_VALUE
       }
     }
 
@@ -135,7 +134,7 @@ export class ImpactTelemetryProvider implements TelemetryProvider {
 
   private resolveAuthStores(): {
     apiKeyAuthStore: ReturnType<typeof useApiKeyAuthStore>
-    firebaseAuthStore: ReturnType<typeof useFirebaseAuthStore>
+    authStore: ReturnType<typeof useAuthStore>
   } | null {
     if (this.stores) {
       return this.stores
@@ -144,7 +143,7 @@ export class ImpactTelemetryProvider implements TelemetryProvider {
     try {
       const stores = {
         apiKeyAuthStore: useApiKeyAuthStore(),
-        firebaseAuthStore: useFirebaseAuthStore()
+        authStore: useAuthStore()
       }
       this.stores = stores
       return stores

src/platform/workspace/api/workspaceApi.ts

@@ -2,7 +2,7 @@ import axios from 'axios'
 
 import { t } from '@/i18n'
 import { api } from '@/scripts/api'
-import { useFirebaseAuthStore } from '@/stores/firebaseAuthStore'
+import { useAuthStore } from '@/stores/authStore'
 
 export type WorkspaceType = 'personal' | 'team'
 export type WorkspaceRole = 'owner' | 'member'
@@ -288,7 +288,7 @@ const workspaceApiClient = axios.create({
 })
 
 async function getAuthHeaderOrThrow() {
-  const authHeader = await useFirebaseAuthStore().getAuthHeader()
+  const authHeader = await useAuthStore().getAuthHeader()
   if (!authHeader) {
     throw new WorkspaceApiError(
       t('toastMessages.userNotAuthenticated'),
@@ -300,7 +300,7 @@ async function getAuthHeaderOrThrow() {
 }
 
 async function getFirebaseHeaderOrThrow() {
-  const authHeader = await useFirebaseAuthStore().getFirebaseAuthHeader()
+  const authHeader = await useAuthStore().getFirebaseAuthHeader()
   if (!authHeader) {
     throw new WorkspaceApiError(
       t('toastMessages.userNotAuthenticated'),

src/platform/workspace/auth/WorkspaceAuthGate.test.ts

@@ -8,8 +8,8 @@ import WorkspaceAuthGate from './WorkspaceAuthGate.vue'
 const mockIsInitialized = ref(false)
 const mockCurrentUser = ref<object | null>(null)
 
-vi.mock('@/stores/firebaseAuthStore', () => ({
-  useFirebaseAuthStore: () => ({
+vi.mock('@/stores/authStore', () => ({
+  useAuthStore: () => ({
     isInitialized: mockIsInitialized,
     currentUser: mockCurrentUser
   })

src/platform/workspace/auth/WorkspaceAuthGate.vue

@@ -27,7 +27,7 @@ import { isCloud } from '@/platform/distribution/types'
 import { useSubscriptionDialog } from '@/platform/cloud/subscription/composables/useSubscriptionDialog'
 import { refreshRemoteConfig } from '@/platform/remoteConfig/refreshRemoteConfig'
 import { useTeamWorkspaceStore } from '@/platform/workspace/stores/teamWorkspaceStore'
-import { useFirebaseAuthStore } from '@/stores/firebaseAuthStore'
+import { useAuthStore } from '@/stores/authStore'
 
 const FIREBASE_INIT_TIMEOUT_MS = 16_000
 const CONFIG_REFRESH_TIMEOUT_MS = 10_000
@@ -38,7 +38,7 @@ const subscriptionDialog = useSubscriptionDialog()
 async function initialize(): Promise<void> {
   if (!isCloud) return
 
-  const authStore = useFirebaseAuthStore()
+  const authStore = useAuthStore()
   const { isInitialized, currentUser } = storeToRefs(authStore)
 
   try {

src/platform/workspace/components/PricingTableWorkspace.vue

@@ -30,7 +30,7 @@
             <span>{{ option.label }}</span>
             <div
               v-if="option.value === 'yearly'"
-              class="flex items-center rounded-full bg-primary-background px-1 py-0.5 text-[11px] font-bold text-white"
+              class="flex items-center rounded-full bg-primary-background px-1 py-0.5 text-2xs font-bold text-white"
             >
               -20%
             </div>
@@ -58,7 +58,7 @@
             </span>
             <div
               v-if="tier.isPopular"
-              class="flex h-5 items-center rounded-full bg-base-foreground px-1.5 text-[11px] font-bold tracking-tight text-base-background uppercase"
+              class="flex h-5 items-center rounded-full bg-base-foreground px-1.5 text-2xs font-bold tracking-tight text-base-background uppercase"
             >
               {{ t('subscription.mostPopular') }}
             </div>

src/platform/workspace/components/WorkspaceSwitcherPopover.vue

@@ -48,7 +48,7 @@
                     </span>
                     <span
                       v-if="resolveTierLabel(workspace)"
-                      class="rounded-full bg-base-foreground px-1 py-0.5 text-[10px] font-bold text-base-background uppercase"
+                      class="rounded-full bg-base-foreground px-1 py-0.5 text-2xs font-bold text-base-background uppercase"
                     >
                       {{ resolveTierLabel(workspace) }}
                     </span>

src/platform/workspace/components/dialogs/TeamWorkspacesDialogContent.test.ts

@@ -300,6 +300,25 @@ describe('TeamWorkspacesDialogContent', () => {
 
       expect(mockCreateWorkspace).not.toHaveBeenCalled()
     })
+
+    it('resets loading state after createWorkspace fails', async () => {
+      mockCreateWorkspace.mockRejectedValue(new Error('Limit reached'))
+      const wrapper = mountComponent()
+
+      await typeAndCreate(wrapper, 'New Team')
+
+      expect(findCreateButton(wrapper).props('loading')).toBe(false)
+    })
+
+    it('resets loading state after onConfirm fails', async () => {
+      mockCreateWorkspace.mockResolvedValue({ id: 'new-ws' })
+      const onConfirm = vi.fn().mockRejectedValue(new Error('Setup failed'))
+      const wrapper = mountComponent({ onConfirm })
+
+      await typeAndCreate(wrapper, 'New Team')
+
+      expect(findCreateButton(wrapper).props('loading')).toBe(false)
+    })
   })
 
   describe('close button', () => {

src/platform/workspace/components/dialogs/TeamWorkspacesDialogContent.vue

@@ -62,7 +62,7 @@
                 </span>
                 <span
                   v-if="tierLabels.get(workspace.id)"
-                  class="shrink-0 rounded-full bg-base-foreground px-1 py-0.5 text-[10px] font-bold text-base-background uppercase"
+                  class="shrink-0 rounded-full bg-base-foreground px-1 py-0.5 text-2xs font-bold text-base-background uppercase"
                 >
                   {{ tierLabels.get(workspace.id) }}
                 </span>
@@ -201,28 +201,30 @@ async function handleSwitch(workspaceId: string) {
 async function onCreate() {
   if (!isValidName.value || loading.value) return
   loading.value = true
-  const name = workspaceName.value.trim()
   try {
-    await workspaceStore.createWorkspace(name)
-  } catch (error) {
-    toast.add({
-      severity: 'error',
-      summary: t('workspacePanel.toast.failedToCreateWorkspace'),
-      detail: error instanceof Error ? error.message : t('g.unknownError')
-    })
+    const name = workspaceName.value.trim()
+    try {
+      await workspaceStore.createWorkspace(name)
+    } catch (error) {
+      toast.add({
+        severity: 'error',
+        summary: t('workspacePanel.toast.failedToCreateWorkspace'),
+        detail: error instanceof Error ? error.message : t('g.unknownError')
+      })
+      return
+    }
+    try {
+      await onConfirm?.(name)
+    } catch (error) {
+      toast.add({
+        severity: 'error',
+        summary: t('teamWorkspacesDialog.confirmCallbackFailed'),
+        detail: error instanceof Error ? error.message : t('g.unknownError')
+      })
+    }
+    dialogStore.closeDialog({ key: DIALOG_KEY })
+  } finally {
     loading.value = false
-    return
   }
-  try {
-    await onConfirm?.(name)
-  } catch (error) {
-    toast.add({
-      severity: 'error',
-      summary: t('teamWorkspacesDialog.confirmCallbackFailed'),
-      detail: error instanceof Error ? error.message : t('g.unknownError')
-    })
-  }
-  dialogStore.closeDialog({ key: DIALOG_KEY })
-  loading.value = false
 }
 </script>

src/platform/workspace/components/dialogs/settings/MembersPanelContent.vue

@@ -153,7 +153,7 @@
                       </span>
                       <span
                         v-if="uiConfig.showRoleBadge"
-                        class="rounded-full bg-base-foreground px-1 py-0.5 text-[10px] font-bold text-base-background uppercase"
+                        class="rounded-full bg-base-foreground px-1 py-0.5 text-2xs font-bold text-base-background uppercase"
                       >
                         {{ $t('workspaceSwitcher.roleOwner') }}
                       </span>
@@ -202,7 +202,7 @@
                       </span>
                       <span
                         v-if="uiConfig.showRoleBadge"
-                        class="rounded-full bg-base-foreground px-1 py-0.5 text-[10px] font-bold text-base-background uppercase"
+                        class="rounded-full bg-base-foreground px-1 py-0.5 text-2xs font-bold text-base-background uppercase"
                       >
                         {{ getRoleBadgeLabel(member.role) }}
                       </span>

src/platform/workspace/stores/useWorkspaceAuth.test.ts

@@ -10,8 +10,8 @@ import { WORKSPACE_STORAGE_KEYS } from '@/platform/workspace/workspaceConstants'
 
 const mockGetIdToken = vi.fn()
 
-vi.mock('@/stores/firebaseAuthStore', () => ({
-  useFirebaseAuthStore: () => ({
+vi.mock('@/stores/authStore', () => ({
+  useAuthStore: () => ({
     getIdToken: mockGetIdToken
   })
 }))

src/platform/workspace/stores/workspaceAuthStore.ts

@@ -9,7 +9,7 @@ import {
   WORKSPACE_STORAGE_KEYS
 } from '@/platform/workspace/workspaceConstants'
 import { api } from '@/scripts/api'
-import { useFirebaseAuthStore } from '@/stores/firebaseAuthStore'
+import { useAuthStore } from '@/stores/authStore'
 import type { AuthHeader } from '@/types/authTypes'
 import type { WorkspaceWithRole } from '@/platform/workspace/workspaceTypes'
 import { useFeatureFlags } from '@/composables/useFeatureFlags'
@@ -181,8 +181,8 @@ export const useWorkspaceAuthStore = defineStore('workspaceAuth', () => {
     error.value = null
 
     try {
-      const firebaseAuthStore = useFirebaseAuthStore()
-      const firebaseToken = await firebaseAuthStore.getIdToken()
+      const authStore = useAuthStore()
+      const firebaseToken = await authStore.getIdToken()
       if (!firebaseToken) {
         throw new WorkspaceAuthError(
           t('workspaceAuth.errors.notAuthenticated'),

src/renderer/extensions/vueNodes/widgets/components/form/dropdown/FormDropdownMenu.test.ts

@@ -110,4 +110,19 @@ describe('FormDropdownMenu', () => {
     const virtualGrid = wrapper.findComponent({ name: 'VirtualGrid' })
     expect(virtualGrid.props('maxColumns')).toBe(1)
   })
+
+  it('has data-capture-wheel="true" on the root element', () => {
+    const wrapper = mount(FormDropdownMenu, {
+      props: defaultProps,
+      global: {
+        stubs: {
+          FormDropdownMenuFilter: true,
+          FormDropdownMenuActions: true,
+          VirtualGrid: true
+        }
+      }
+    })
+
+    expect(wrapper.attributes('data-capture-wheel')).toBe('true')
+  })
 })

src/renderer/extensions/vueNodes/widgets/components/form/dropdown/FormDropdownMenu.vue

@@ -98,6 +98,7 @@ const virtualItems = computed<VirtualDropdownItem[]>(() =>
 <template>
   <div
     class="flex h-[640px] w-103 flex-col rounded-lg bg-component-node-background pt-4 outline -outline-offset-1 outline-node-component-border"
+    data-capture-wheel="true"
   >
     <FormDropdownMenuFilter
       v-if="filterOptions.length > 0"

src/renderer/extensions/vueNodes/widgets/components/form/dropdown/FormDropdownMenuActions.vue

@@ -103,6 +103,7 @@ function toggleBaseModelSelection(item: FilterOption) {
   <div class="text-secondary flex gap-2 px-4">
     <FormSearchInput
       v-model="searchQuery"
+      autofocus
       :class="
         cn(
           actionButtonStyle,

src/renderer/extensions/vueNodes/widgets/composables/useRemoteWidget.test.ts

@@ -38,9 +38,9 @@ vi.mock('@/platform/distribution/types', () => ({
   }
 }))
 
-vi.mock('@/stores/firebaseAuthStore', async () => {
+vi.mock('@/stores/authStore', async () => {
   return {
-    useFirebaseAuthStore: vi.fn(() => ({
+    useAuthStore: vi.fn(() => ({
       getAuthHeader: vi.fn(() => Promise.resolve(mockCloudAuth.authHeader))
     }))
   }

src/renderer/extensions/vueNodes/widgets/composables/useRemoteWidget.ts

@@ -5,7 +5,7 @@ import type { IWidget, LGraphNode } from '@/lib/litegraph/src/litegraph'
 import { isCloud } from '@/platform/distribution/types'
 import type { RemoteWidgetConfig } from '@/schemas/nodeDefSchema'
 import { api } from '@/scripts/api'
-import { useFirebaseAuthStore } from '@/stores/firebaseAuthStore'
+import { useAuthStore } from '@/stores/authStore'
 
 const MAX_RETRIES = 5
 const TIMEOUT = 4096
@@ -23,7 +23,7 @@ interface CacheEntry<T> {
 
 async function getAuthHeaders() {
   if (isCloud) {
-    const authStore = useFirebaseAuthStore()
+    const authStore = useAuthStore()
     const authHeader = await authStore.getAuthHeader()
     return {
       ...(authHeader && { headers: authHeader })

src/router.ts

@@ -11,7 +11,7 @@ import { useFeatureFlags } from '@/composables/useFeatureFlags'
 import { isCloud, isDesktop } from '@/platform/distribution/types'
 import { useTelemetry } from '@/platform/telemetry'
 import { useDialogService } from '@/services/dialogService'
-import { useFirebaseAuthStore } from '@/stores/firebaseAuthStore'
+import { useAuthStore } from '@/stores/authStore'
 import { useUserStore } from '@/stores/userStore'
 import LayoutDefault from '@/views/layouts/LayoutDefault.vue'
 
@@ -140,7 +140,7 @@ if (isCloud) {
   }
   // Global authentication guard
   router.beforeEach(async (to, _from, next) => {
-    const authStore = useFirebaseAuthStore()
+    const authStore = useAuthStore()
 
     // Wait for Firebase auth to initialize
     // Timeout after 16 seconds

src/scripts/api.ts

@@ -60,7 +60,7 @@ import type {
   JobListItem
 } from '@/platform/remote/comfyui/jobs/jobTypes'
 import type { ComfyNodeDef } from '@/schemas/nodeDefSchema'
-import type { useFirebaseAuthStore } from '@/stores/firebaseAuthStore'
+import type { useAuthStore } from '@/stores/authStore'
 import type { AuthHeader } from '@/types/authTypes'
 import type { NodeExecutionId } from '@/types/nodeIdentification'
 import {
@@ -332,7 +332,7 @@ export class ComfyApi extends EventTarget {
   /**
    * Cache Firebase auth store composable function.
    */
-  private authStoreComposable?: typeof useFirebaseAuthStore
+  private authStoreComposable?: typeof useAuthStore
 
   reportedUnknownMessageTypes = new Set<string>()
 
@@ -399,8 +399,8 @@ export class ComfyApi extends EventTarget {
   private async getAuthStore() {
     if (isCloud) {
       if (!this.authStoreComposable) {
-        const module = await import('@/stores/firebaseAuthStore')
-        this.authStoreComposable = module.useFirebaseAuthStore
+        const module = await import('@/stores/authStore')
+        this.authStoreComposable = module.useAuthStore
       }
 
       return this.authStoreComposable()

src/scripts/app.ts

@@ -67,7 +67,7 @@ import { useExecutionStore } from '@/stores/executionStore'
 import { useExecutionErrorStore } from '@/stores/executionErrorStore'
 import { useMissingNodesErrorStore } from '@/platform/nodeReplacement/missingNodesErrorStore'
 import { useExtensionStore } from '@/stores/extensionStore'
-import { useFirebaseAuthStore } from '@/stores/firebaseAuthStore'
+import { useAuthStore } from '@/stores/authStore'
 import { useNodeOutputStore } from '@/stores/nodeOutputStore'
 import { useJobPreviewStore } from '@/stores/jobPreviewStore'
 import { KeyComboImpl } from '@/platform/keybindings/keyCombo'
@@ -1594,7 +1594,7 @@ export class ComfyApp {
     executionErrorStore.clearAllErrors()
 
     // Get auth token for backend nodes - uses workspace token if enabled, otherwise Firebase token
-    const comfyOrgAuthToken = await useFirebaseAuthStore().getAuthToken()
+    const comfyOrgAuthToken = await useAuthStore().getAuthToken()
     const comfyOrgApiKey = useApiKeyAuthStore().getApiKey()
 
     try {

src/services/customerEventsService.test.ts

@@ -11,7 +11,7 @@ const mockAxiosInstance = vi.hoisted(() => ({
   get: vi.fn()
 }))
 
-const mockFirebaseAuthStore = vi.hoisted(() => ({
+const mockAuthStore = vi.hoisted(() => ({
   getAuthHeader: vi.fn()
 }))
 
@@ -27,8 +27,8 @@ vi.mock('axios', () => ({
   }
 }))
 
-vi.mock('@/stores/firebaseAuthStore', () => ({
-  useFirebaseAuthStore: vi.fn(() => mockFirebaseAuthStore)
+vi.mock('@/stores/authStore', () => ({
+  useAuthStore: vi.fn(() => mockAuthStore)
 }))
 
 vi.mock('@/i18n', () => ({
@@ -81,7 +81,7 @@ describe('useCustomerEventsService', () => {
     vi.clearAllMocks()
 
     // Setup default mocks
-    mockFirebaseAuthStore.getAuthHeader.mockResolvedValue(mockAuthHeaders)
+    mockAuthStore.getAuthHeader.mockResolvedValue(mockAuthHeaders)
     mockI18n.d.mockImplementation((date, options) => {
       // Mock i18n date formatting
       if (options?.month === 'short') {
@@ -118,7 +118,7 @@ describe('useCustomerEventsService', () => {
         limit: 10
       })
 
-      expect(mockFirebaseAuthStore.getAuthHeader).toHaveBeenCalled()
+      expect(mockAuthStore.getAuthHeader).toHaveBeenCalled()
       expect(mockAxiosInstance.get).toHaveBeenCalledWith('/customers/events', {
         params: { page: 1, limit: 10 },
         headers: mockAuthHeaders
@@ -141,7 +141,7 @@ describe('useCustomerEventsService', () => {
     })
 
     it('should return null when auth headers are missing', async () => {
-      mockFirebaseAuthStore.getAuthHeader.mockResolvedValue(null)
+      mockAuthStore.getAuthHeader.mockResolvedValue(null)
 
       const result = await service.getMyEvents()
 

src/services/customerEventsService.ts

@@ -4,7 +4,7 @@ import { ref, watch } from 'vue'
 
 import { getComfyApiBaseUrl } from '@/config/comfyApi'
 import { d } from '@/i18n'
-import { useFirebaseAuthStore } from '@/stores/firebaseAuthStore'
+import { useAuthStore } from '@/stores/authStore'
 import type { components, operations } from '@/types/comfyRegistryTypes'
 import { isAbortError } from '@/utils/typeGuardUtil'
 
@@ -180,7 +180,7 @@ export const useCustomerEventsService = () => {
     }
 
     // Get auth headers
-    const authHeaders = await useFirebaseAuthStore().getAuthHeader()
+    const authHeaders = await useAuthStore().getAuthHeader()
     if (!authHeaders) {
       error.value = 'Authentication header is missing'
       return null

src/stores/apiKeyAuthStore.ts

@@ -5,7 +5,7 @@ import { computed, ref, watch } from 'vue'
 import { useErrorHandling } from '@/composables/useErrorHandling'
 import { t } from '@/i18n'
 import { useToastStore } from '@/platform/updates/common/toastStore'
-import { useFirebaseAuthStore } from '@/stores/firebaseAuthStore'
+import { useAuthStore } from '@/stores/authStore'
 import type { ApiKeyAuthHeader } from '@/types/authTypes'
 import type { operations } from '@/types/comfyRegistryTypes'
 
@@ -15,7 +15,7 @@ type ComfyApiUser =
 const STORAGE_KEY = 'comfy_api_key'
 
 export const useApiKeyAuthStore = defineStore('apiKeyAuth', () => {
-  const firebaseAuthStore = useFirebaseAuthStore()
+  const authStore = useAuthStore()
   const apiKey = useLocalStorage<string | null>(STORAGE_KEY, null)
   const toastStore = useToastStore()
   const { wrapWithErrorHandlingAsync, toastErrorHandler } = useErrorHandling()
@@ -24,7 +24,7 @@ export const useApiKeyAuthStore = defineStore('apiKeyAuth', () => {
   const isAuthenticated = computed(() => !!currentUser.value)
 
   const initializeUserFromApiKey = async () => {
-    const createCustomerResponse = await firebaseAuthStore
+    const createCustomerResponse = await authStore
       .createCustomer()
       .catch((err) => {
         console.error(err)

src/stores/authStore.test.ts

@@ -7,7 +7,7 @@ import { beforeEach, describe, expect, it, vi } from 'vitest'
 import * as vuefire from 'vuefire'
 
 import { useDialogService } from '@/services/dialogService'
-import { useFirebaseAuthStore } from '@/stores/firebaseAuthStore'
+import { useAuthStore } from '@/stores/authStore'
 import { createTestingPinia } from '@pinia/testing'
 
 // Hoisted mocks for dynamic imports
@@ -122,8 +122,8 @@ vi.mock('@/stores/apiKeyAuthStore', () => ({
   })
 }))
 
-describe('useFirebaseAuthStore', () => {
-  let store: ReturnType<typeof useFirebaseAuthStore>
+describe('useAuthStore', () => {
+  let store: ReturnType<typeof useAuthStore>
   let authStateCallback: (user: User | null) => void
   let idTokenCallback: (user: User | null) => void
 
@@ -182,7 +182,7 @@ describe('useFirebaseAuthStore', () => {
 
     // Initialize Pinia
     setActivePinia(createTestingPinia({ stubActions: false }))
-    store = useFirebaseAuthStore()
+    store = useAuthStore()
 
     // Reset and set up getIdToken mock
     mockUser.getIdToken.mockReset()
@@ -210,8 +210,8 @@ describe('useFirebaseAuthStore', () => {
       )
 
       setActivePinia(createTestingPinia({ stubActions: false }))
-      const storeModule = await import('@/stores/firebaseAuthStore')
-      store = storeModule.useFirebaseAuthStore()
+      const storeModule = await import('@/stores/authStore')
+      store = storeModule.useAuthStore()
     })
 
     it("should not increment tokenRefreshTrigger on the user's first ID token event", () => {

src/stores/authStore.ts

@@ -49,14 +49,14 @@ export type BillingPortalTargetTier = NonNullable<
   >['application/json']
 >['target_tier']
 
-export class FirebaseAuthStoreError extends Error {
+export class AuthStoreError extends Error {
   constructor(message: string) {
     super(message)
-    this.name = 'FirebaseAuthStoreError'
+    this.name = 'AuthStoreError'
   }
 }
 
-export const useFirebaseAuthStore = defineStore('firebaseAuth', () => {
+export const useAuthStore = defineStore('auth', () => {
   const { flags } = useFeatureFlags()
 
   // State
@@ -241,9 +241,7 @@ export const useFirebaseAuthStore = defineStore('firebaseAuth', () => {
     try {
       const authHeader = await getAuthHeader()
       if (!authHeader) {
-        throw new FirebaseAuthStoreError(
-          t('toastMessages.userNotAuthenticated')
-        )
+        throw new AuthStoreError(t('toastMessages.userNotAuthenticated'))
       }
 
       const response = await fetch(buildApiUrl('/customers/balance'), {
@@ -259,7 +257,7 @@ export const useFirebaseAuthStore = defineStore('firebaseAuth', () => {
           return null
         }
         const errorData = await response.json()
-        throw new FirebaseAuthStoreError(
+        throw new AuthStoreError(
           t('toastMessages.failedToFetchBalance', {
             error: errorData.message
           })
@@ -279,7 +277,7 @@ export const useFirebaseAuthStore = defineStore('firebaseAuth', () => {
   const createCustomer = async (): Promise<CreateCustomerResponse> => {
     const authHeader = await getAuthHeader()
     if (!authHeader) {
-      throw new FirebaseAuthStoreError(t('toastMessages.userNotAuthenticated'))
+      throw new AuthStoreError(t('toastMessages.userNotAuthenticated'))
     }
 
     const createCustomerRes = await fetch(buildApiUrl('/customers'), {
@@ -290,7 +288,7 @@ export const useFirebaseAuthStore = defineStore('firebaseAuth', () => {
       }
     })
     if (!createCustomerRes.ok) {
-      throw new FirebaseAuthStoreError(
+      throw new AuthStoreError(
         t('toastMessages.failedToCreateCustomer', {
           error: createCustomerRes.statusText
         })
@@ -300,7 +298,7 @@ export const useFirebaseAuthStore = defineStore('firebaseAuth', () => {
     const createCustomerResJson: CreateCustomerResponse =
       await createCustomerRes.json()
     if (!createCustomerResJson?.id) {
-      throw new FirebaseAuthStoreError(
+      throw new AuthStoreError(
         t('toastMessages.failedToCreateCustomer', {
           error: 'No customer ID returned'
         })
@@ -431,7 +429,7 @@ export const useFirebaseAuthStore = defineStore('firebaseAuth', () => {
   /** Update password for current user */
   const _updatePassword = async (newPassword: string): Promise<void> => {
     if (!currentUser.value) {
-      throw new FirebaseAuthStoreError(t('toastMessages.userNotAuthenticated'))
+      throw new AuthStoreError(t('toastMessages.userNotAuthenticated'))
     }
     await updatePassword(currentUser.value, newPassword)
   }
@@ -441,7 +439,7 @@ export const useFirebaseAuthStore = defineStore('firebaseAuth', () => {
   ): Promise<CreditPurchaseResponse> => {
     const authHeader = await getAuthHeader()
     if (!authHeader) {
-      throw new FirebaseAuthStoreError(t('toastMessages.userNotAuthenticated'))
+      throw new AuthStoreError(t('toastMessages.userNotAuthenticated'))
     }
 
     // Ensure customer was created during login/registration
@@ -461,7 +459,7 @@ export const useFirebaseAuthStore = defineStore('firebaseAuth', () => {
 
     if (!response.ok) {
       const errorData = await response.json()
-      throw new FirebaseAuthStoreError(
+      throw new AuthStoreError(
         t('toastMessages.failedToInitiateCreditPurchase', {
           error: errorData.message
         })
@@ -481,7 +479,7 @@ export const useFirebaseAuthStore = defineStore('firebaseAuth', () => {
   ): Promise<AccessBillingPortalResponse> => {
     const authHeader = await getAuthHeader()
     if (!authHeader) {
-      throw new FirebaseAuthStoreError(t('toastMessages.userNotAuthenticated'))
+      throw new AuthStoreError(t('toastMessages.userNotAuthenticated'))
     }
 
     const response = await fetch(buildApiUrl('/customers/billing'), {
@@ -497,7 +495,7 @@ export const useFirebaseAuthStore = defineStore('firebaseAuth', () => {
 
     if (!response.ok) {
       const errorData = await response.json()
-      throw new FirebaseAuthStoreError(
+      throw new AuthStoreError(
         t('toastMessages.failedToAccessBillingPortal', {
           error: errorData.message
         })

src/stores/bootstrapStore.test.ts

@@ -50,12 +50,12 @@ vi.mock('@/stores/userStore', () => ({
   }))
 }))
 
-const mockIsFirebaseInitialized = ref(false)
-const mockIsFirebaseAuthenticated = ref(false)
-vi.mock('@/stores/firebaseAuthStore', () => ({
-  useFirebaseAuthStore: vi.fn(() => ({
-    isInitialized: mockIsFirebaseInitialized,
-    isAuthenticated: mockIsFirebaseAuthenticated
+const mockIsAuthInitialized = ref(false)
+const mockIsAuthAuthenticated = ref(false)
+vi.mock('@/stores/authStore', () => ({
+  useAuthStore: vi.fn(() => ({
+    isInitialized: mockIsAuthInitialized,
+    isAuthenticated: mockIsAuthAuthenticated
   }))
 }))
 
@@ -67,8 +67,8 @@ vi.mock('@/platform/distribution/types', () => mockDistributionTypes)
 describe('bootstrapStore', () => {
   beforeEach(() => {
     mockIsSettingsReady.value = false
-    mockIsFirebaseInitialized.value = false
-    mockIsFirebaseAuthenticated.value = false
+    mockIsAuthInitialized.value = false
+    mockIsAuthAuthenticated.value = false
     mockNeedsLogin.value = false
     mockDistributionTypes.isCloud = false
     setActivePinia(createTestingPinia({ stubActions: false }))
@@ -107,14 +107,14 @@ describe('bootstrapStore', () => {
       expect(settingStore.isReady).toBe(false)
 
       // Firebase initialized but user not yet authenticated
-      mockIsFirebaseInitialized.value = true
+      mockIsAuthInitialized.value = true
       await nextTick()
 
       expect(store.isI18nReady).toBe(false)
       expect(settingStore.isReady).toBe(false)
 
       // User authenticates (e.g. signs in on login page)
-      mockIsFirebaseAuthenticated.value = true
+      mockIsAuthAuthenticated.value = true
       await bootstrapPromise
 
       await vi.waitFor(() => {

src/stores/bootstrapStore.ts

@@ -5,7 +5,7 @@ import { isCloud } from '@/platform/distribution/types'
 import { useSettingStore } from '@/platform/settings/settingStore'
 import { useWorkflowStore } from '@/platform/workflow/management/stores/workflowStore'
 import { api } from '@/scripts/api'
-import { useFirebaseAuthStore } from '@/stores/firebaseAuthStore'
+import { useAuthStore } from '@/stores/authStore'
 import { useUserStore } from '@/stores/userStore'
 
 export const useBootstrapStore = defineStore('bootstrap', () => {
@@ -37,9 +37,7 @@ export const useBootstrapStore = defineStore('bootstrap', () => {
 
   async function startStoreBootstrap() {
     if (isCloud) {
-      const { isInitialized, isAuthenticated } = storeToRefs(
-        useFirebaseAuthStore()
-      )
+      const { isInitialized, isAuthenticated } = storeToRefs(useAuthStore())
       await until(isInitialized).toBe(true)
       await until(isAuthenticated).toBe(true)
     }

src/stores/workspaceStore.ts

@@ -13,7 +13,7 @@ import type { SidebarTabExtension, ToastManager } from '@/types/extensionTypes'
 import { useApiKeyAuthStore } from './apiKeyAuthStore'
 import { useCommandStore } from './commandStore'
 import { useExecutionErrorStore } from './executionErrorStore'
-import { useFirebaseAuthStore } from './firebaseAuthStore'
+import { useAuthStore } from './authStore'
 import { useQueueSettingsStore } from './queueStore'
 import { useBottomPanelStore } from './workspace/bottomPanelStore'
 import { useSidebarTabStore } from './workspace/sidebarTabStore'
@@ -48,7 +48,7 @@ function workspaceStoreSetup() {
   const dialog = useDialogService()
   const bottomPanel = useBottomPanelStore()
 
-  const authStore = useFirebaseAuthStore()
+  const authStore = useAuthStore()
   const apiKeyStore = useApiKeyAuthStore()
 
   const firebaseUser = computed(() => authStore.currentUser)

src/views/GraphView.vue

@@ -26,6 +26,7 @@
   <ModelImportProgressDialog />
   <AssetExportProgressDialog />
   <ManagerProgressToast />
+  <DesktopCloudNotificationController />
   <UnloadWindowConfirmDialog v-if="!isDesktop" />
   <MenuHamburger />
 </template>
@@ -63,6 +64,7 @@ import type { ServerConfig, ServerConfigValue } from '@/constants/serverConfig'
 import { i18n, loadLocale } from '@/i18n'
 import AssetExportProgressDialog from '@/platform/assets/components/AssetExportProgressDialog.vue'
 import ModelImportProgressDialog from '@/platform/assets/components/ModelImportProgressDialog.vue'
+import DesktopCloudNotificationController from '@/platform/cloud/notification/components/DesktopCloudNotificationController.vue'
 import { isCloud, isDesktop } from '@/platform/distribution/types'
 import { useSettingStore } from '@/platform/settings/settingStore'
 import { useTelemetry } from '@/platform/telemetry'
@@ -78,7 +80,7 @@ import { useAppMode } from '@/composables/useAppMode'
 import { useAssetsStore } from '@/stores/assetsStore'
 import { useCommandStore } from '@/stores/commandStore'
 import { useExecutionStore } from '@/stores/executionStore'
-import { useFirebaseAuthStore } from '@/stores/firebaseAuthStore'
+import { useAuthStore } from '@/stores/authStore'
 import { useMenuItemStore } from '@/stores/menuItemStore'
 import { useModelStore } from '@/stores/modelStore'
 import { useNodeDefStore, useNodeFrequencyStore } from '@/stores/nodeDefStore'
@@ -120,7 +122,7 @@ watch(linearMode, (isLinear) => {
 })
 
 const telemetry = useTelemetry()
-const firebaseAuthStore = useFirebaseAuthStore()
+const authStore = useAuthStore()
 let hasTrackedLogin = false
 
 watch(
@@ -308,7 +310,7 @@ void nextTick(() => {
 const onGraphReady = () => {
   runWhenGlobalIdle(() => {
     // Track user login when app is ready in graph view (cloud only)
-    if (isCloud && firebaseAuthStore.isAuthenticated && !hasTrackedLogin) {
+    if (isCloud && authStore.isAuthenticated && !hasTrackedLogin) {
       telemetry?.trackUserLoggedIn()
       hasTrackedLogin = true
     }