refactor usage of isElectron to use isDesktop

apps/desktop-ui/src/components/bottomPanel/tabs/terminal/BaseTerminal.vue

@@ -1,10 +1,10 @@
 <template>
   <div
     ref="rootEl"
-    class="relative overflow-hidden h-full w-full bg-neutral-900"
+    class="relative h-full w-full overflow-hidden bg-neutral-900"
   >
-    <div class="p-terminal rounded-none h-full w-full p-2">
-      <div ref="terminalEl" class="h-full terminal-host" />
+    <div class="p-terminal h-full w-full rounded-none p-2">
+      <div ref="terminalEl" class="terminal-host h-full" />
     </div>
     <Button
       v-tooltip.left="{
@@ -26,6 +26,7 @@
 </template>
 
 <script setup lang="ts">
+import { isDesktop } from '@frontend/platform/distribution/types'
 import { useElementHover, useEventListener } from '@vueuse/core'
 import type { IDisposable } from '@xterm/xterm'
 import Button from 'primevue/button'
@@ -34,7 +35,7 @@ import { computed, onMounted, onUnmounted, ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 
 import { useTerminal } from '@/composables/bottomPanelTabs/useTerminal'
-import { electronAPI, isElectron } from '@/utils/envUtil'
+import { electronAPI } from '@/utils/envUtil'
 import { cn } from '@/utils/tailwindUtil'
 
 const { t } = useI18n()
@@ -84,7 +85,7 @@ const showContextMenu = (event: MouseEvent) => {
   electronAPI()?.showContextMenu({ type: 'text' })
 }
 
-if (isElectron()) {
+if (isDesktop) {
   useEventListener(terminalEl, 'contextmenu', showContextMenu)
 }
 

apps/desktop-ui/src/router.ts

@@ -1,14 +1,14 @@
+import { isDesktop } from '@frontend/platform/distribution/types'
 import {
   createRouter,
   createWebHashHistory,
   createWebHistory
 } from 'vue-router'
 
-import { isElectron } from '@/utils/envUtil'
 import LayoutDefault from '@/views/layouts/LayoutDefault.vue'
 
 const isFileProtocol = window.location.protocol === 'file:'
-const basePath = isElectron() ? '/' : window.location.pathname
+const basePath = isDesktop ? '/' : window.location.pathname
 
 const router = createRouter({
   history: isFileProtocol ? createWebHashHistory() : createWebHistory(basePath),

apps/desktop-ui/src/utils/envUtil.ts

@@ -1,13 +1 @@
-import type { ElectronAPI } from '@comfyorg/comfyui-electron-types'
-
-export function isElectron() {
-  return 'electronAPI' in window && window.electronAPI !== undefined
-}
-
-export function electronAPI() {
-  return (window as any).electronAPI as ElectronAPI
-}
-
-export function isNativeWindow() {
-  return isElectron() && !!window.navigator.windowControlsOverlay?.visible
-}
+export { electronAPI, isNativeWindow } from '@frontend/utils/envUtil'

apps/desktop-ui/src/views/templates/BaseViewTemplate.vue

@@ -1,28 +1,29 @@
 <template>
   <div
-    class="font-sans w-screen h-screen flex flex-col"
+    class="flex h-screen w-screen flex-col font-sans"
     :class="[
       dark
-        ? 'text-neutral-300 bg-neutral-900 dark-theme'
-        : 'text-neutral-900 bg-neutral-300'
+        ? 'dark-theme bg-neutral-900 text-neutral-300'
+        : 'bg-neutral-300 text-neutral-900'
     ]"
   >
     <!-- Virtual top menu for native window (drag handle) -->
     <div
       v-show="isNativeWindow()"
       ref="topMenuRef"
-      class="app-drag w-full h-(--comfy-topbar-height)"
+      class="app-drag h-(--comfy-topbar-height) w-full"
     />
-    <div class="grow w-full flex items-center justify-center overflow-auto">
+    <div class="flex w-full grow items-center justify-center overflow-auto">
       <slot />
     </div>
   </div>
 </template>
 
 <script setup lang="ts">
+import { isDesktop } from '@frontend/platform/distribution/types'
 import { nextTick, onMounted, ref } from 'vue'
 
-import { electronAPI, isElectron, isNativeWindow } from '../../utils/envUtil'
+import { electronAPI, isNativeWindow } from '../../utils/envUtil'
 
 const { dark = false } = defineProps<{
   dark?: boolean
@@ -40,7 +41,7 @@ const lightTheme = {
 
 const topMenuRef = ref<HTMLDivElement | null>(null)
 onMounted(async () => {
-  if (isElectron()) {
+  if (isDesktop) {
     await nextTick()
 
     electronAPI().changeTheme({

apps/desktop-ui/tsconfig.json

@@ -6,6 +6,7 @@
     "baseUrl": ".",
     "paths": {
       "@/*": ["src/*"],
+      "@frontend/*": ["../../src/*"],
       "@frontend-locales/*": ["../../src/locales/*"]
     }
   },

apps/desktop-ui/vite.config.mts

@@ -31,6 +31,7 @@ export default defineConfig(() => {
     resolve: {
       alias: {
         '@': path.resolve(projectRoot, 'src'),
+        '@frontend': path.resolve(projectRoot, '../../src'),
         '@frontend-locales': path.resolve(projectRoot, '../../src/locales')
       }
     },

src/App.vue

@@ -16,10 +16,11 @@ import { computed, onMounted } from 'vue'
 
 import GlobalDialog from '@/components/dialog/GlobalDialog.vue'
 import config from '@/config'
+import { isDesktop } from '@/platform/distribution/types'
 import { useWorkspaceStore } from '@/stores/workspaceStore'
 import { useConflictDetection } from '@/workbench/extensions/manager/composables/useConflictDetection'
 
-import { electronAPI, isElectron } from './utils/envUtil'
+import { electronAPI } from './utils/envUtil'
 
 const workspaceStore = useWorkspaceStore()
 const conflictDetection = useConflictDetection()
@@ -45,7 +46,7 @@ onMounted(() => {
   // @ts-expect-error fixme ts strict error
   window['__COMFYUI_FRONTEND_VERSION__'] = config.app_version
 
-  if (isElectron()) {
+  if (isDesktop) {
     document.addEventListener('contextmenu', showContextMenu)
   }
 

src/components/bottomPanel/tabs/terminal/BaseTerminal.vue

@@ -34,7 +34,8 @@ import { computed, onMounted, onUnmounted, ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 
 import { useTerminal } from '@/composables/bottomPanelTabs/useTerminal'
-import { electronAPI, isElectron } from '@/utils/envUtil'
+import { isDesktop } from '@/platform/distribution/types'
+import { electronAPI } from '@/utils/envUtil'
 import { cn } from '@/utils/tailwindUtil'
 
 const { t } = useI18n()
@@ -84,7 +85,7 @@ const showContextMenu = (event: MouseEvent) => {
   electronAPI()?.showContextMenu({ type: 'text' })
 }
 
-if (isElectron()) {
+if (isDesktop) {
   useEventListener(terminalEl, 'contextmenu', showContextMenu)
 }
 

src/components/dialog/content/MissingModelsWarning.vue

@@ -13,7 +13,7 @@
   </div>
   <ListBox :options="missingModels" class="comfy-missing-models">
     <template #option="{ option }">
-      <Suspense v-if="isElectron()">
+      <Suspense v-if="isDesktop">
         <ElectronFileDownload
           :url="option.url"
           :label="option.label"
@@ -39,8 +39,8 @@ import { useI18n } from 'vue-i18n'
 import ElectronFileDownload from '@/components/common/ElectronFileDownload.vue'
 import FileDownload from '@/components/common/FileDownload.vue'
 import NoResultsPlaceholder from '@/components/common/NoResultsPlaceholder.vue'
+import { isDesktop } from '@/platform/distribution/types'
 import { useSettingStore } from '@/platform/settings/settingStore'
-import { isElectron } from '@/utils/envUtil'
 
 // TODO: Read this from server internal API rather than hardcoding here
 // as some installations may wish to use custom sources

src/components/helpcenter/HelpCenterMenuContent.vue

@@ -135,12 +135,12 @@ import type { CSSProperties, Component } from 'vue'
 import { useI18n } from 'vue-i18n'
 
 import PuzzleIcon from '@/components/icons/PuzzleIcon.vue'
-import { isCloud } from '@/platform/distribution/types'
+import { isCloud, isDesktop } from '@/platform/distribution/types'
 import { useSettingStore } from '@/platform/settings/settingStore'
 import type { ReleaseNote } from '@/platform/updates/common/releaseService'
 import { useReleaseStore } from '@/platform/updates/common/releaseStore'
 import { useCommandStore } from '@/stores/commandStore'
-import { electronAPI, isElectron } from '@/utils/envUtil'
+import { electronAPI } from '@/utils/envUtil'
 import { formatVersionAnchor } from '@/utils/formatUtil'
 import { useConflictAcknowledgment } from '@/workbench/extensions/manager/composables/useConflictAcknowledgment'
 import { useManagerState } from '@/workbench/extensions/manager/composables/useManagerState'
@@ -216,7 +216,7 @@ const moreItems = computed<MenuItem[]>(() => {
       key: 'desktop-guide',
       type: 'item',
       label: t('helpCenter.desktopUserGuide'),
-      visible: isElectron(),
+      visible: isDesktop,
       action: () => {
         const docsUrl =
           electronAPI().getPlatform() === 'darwin'
@@ -230,7 +230,7 @@ const moreItems = computed<MenuItem[]>(() => {
       key: 'dev-tools',
       type: 'item',
       label: t('helpCenter.openDevTools'),
-      visible: isElectron(),
+      visible: isDesktop,
       action: () => {
         openDevTools()
         emit('close')
@@ -239,13 +239,13 @@ const moreItems = computed<MenuItem[]>(() => {
     {
       key: 'divider-1',
       type: 'divider',
-      visible: isElectron()
+      visible: isDesktop
     },
     {
       key: 'reinstall',
       type: 'item',
       label: t('helpCenter.reinstall'),
-      visible: isElectron(),
+      visible: isDesktop,
       action: () => {
         onReinstall()
         emit('close')
@@ -484,13 +484,13 @@ const onSubmenuLeave = (): void => {
 }
 
 const openDevTools = (): void => {
-  if (isElectron()) {
+  if (isDesktop) {
     electronAPI().openDevTools()
   }
 }
 
 const onReinstall = (): void => {
-  if (isElectron()) {
+  if (isDesktop) {
     void electronAPI().reinstall()
   }
 }

src/components/sidebar/tabs/ModelLibrarySidebarTab.vue

@@ -28,7 +28,7 @@
       />
     </template>
     <template #body>
-      <ElectronDownloadItems v-if="isElectron()" />
+      <ElectronDownloadItems v-if="isDesktop" />
 
       <TreeExplorer
         v-model:expanded-keys="expandedKeys"
@@ -54,13 +54,13 @@ import SidebarTabTemplate from '@/components/sidebar/tabs/SidebarTabTemplate.vue
 import ElectronDownloadItems from '@/components/sidebar/tabs/modelLibrary/ElectronDownloadItems.vue'
 import ModelTreeLeaf from '@/components/sidebar/tabs/modelLibrary/ModelTreeLeaf.vue'
 import { useTreeExpansion } from '@/composables/useTreeExpansion'
+import { isDesktop } from '@/platform/distribution/types'
 import { useSettingStore } from '@/platform/settings/settingStore'
 import { useLitegraphService } from '@/services/litegraphService'
 import type { ComfyModelDef, ModelFolder } from '@/stores/modelStore'
 import { ResourceState, useModelStore } from '@/stores/modelStore'
 import { useModelToNodeStore } from '@/stores/modelToNodeStore'
 import type { TreeExplorerNode, TreeNode } from '@/types/treeExplorerTypes'
-import { isElectron } from '@/utils/envUtil'
 import { buildTree } from '@/utils/treeUtil'
 
 const modelStore = useModelStore()

src/components/topbar/WorkflowTabs.vue

@@ -79,6 +79,7 @@ import { useI18n } from 'vue-i18n'
 
 import WorkflowTab from '@/components/topbar/WorkflowTab.vue'
 import { useOverflowObserver } from '@/composables/element/useOverflowObserver'
+import { isDesktop } from '@/platform/distribution/types'
 import { useWorkflowService } from '@/platform/workflow/core/services/workflowService'
 import type { ComfyWorkflow } from '@/platform/workflow/management/stores/workflowStore'
 import {
@@ -87,7 +88,6 @@ import {
 } from '@/platform/workflow/management/stores/workflowStore'
 import { useCommandStore } from '@/stores/commandStore'
 import { useWorkspaceStore } from '@/stores/workspaceStore'
-import { isElectron } from '@/utils/envUtil'
 import { whileMouseDown } from '@/utils/mouseDownUtil'
 
 import WorkflowOverflowMenu from './WorkflowOverflowMenu.vue'
@@ -114,8 +114,6 @@ const showOverflowArrows = ref(false)
 const leftArrowEnabled = ref(false)
 const rightArrowEnabled = ref(false)
 
-const isDesktop = isElectron()
-
 const workflowToOption = (workflow: ComfyWorkflow): WorkflowOption => ({
   value: workflow.path,
   workflow

src/composables/sidebarTabs/useModelLibrarySidebarTab.ts

@@ -1,9 +1,9 @@
 import { markRaw } from 'vue'
 
 import ModelLibrarySidebarTab from '@/components/sidebar/tabs/ModelLibrarySidebarTab.vue'
+import { isDesktop } from '@/platform/distribution/types'
 import { useElectronDownloadStore } from '@/stores/electronDownloadStore'
 import type { SidebarTabExtension } from '@/types/extensionTypes'
-import { isElectron } from '@/utils/envUtil'
 
 export const useModelLibrarySidebarTab = (): SidebarTabExtension => {
   return {
@@ -15,7 +15,7 @@ export const useModelLibrarySidebarTab = (): SidebarTabExtension => {
     component: markRaw(ModelLibrarySidebarTab),
     type: 'vue',
     iconBadge: () => {
-      if (isElectron()) {
+      if (isDesktop) {
         const electronDownloadStore = useElectronDownloadStore()
         if (electronDownloadStore.inProgressDownloads.length > 0) {
           return electronDownloadStore.inProgressDownloads.length.toString()

src/extensions/core/electronAdapter.ts

@@ -2,12 +2,13 @@ import log from 'loglevel'
 
 import { PYTHON_MIRROR } from '@/constants/uvMirrors'
 import { t } from '@/i18n'
+import { isDesktop } from '@/platform/distribution/types'
 import { useToastStore } from '@/platform/updates/common/toastStore'
 import { useWorkflowStore } from '@/platform/workflow/management/stores/workflowStore'
 import { app } from '@/scripts/app'
 import { useDialogService } from '@/services/dialogService'
 import { checkMirrorReachable } from '@/utils/electronMirrorCheck'
-import { electronAPI as getElectronAPI, isElectron } from '@/utils/envUtil'
+import { electronAPI as getElectronAPI } from '@/utils/envUtil'
 
 // Desktop documentation URLs
 const DESKTOP_DOCS = {
@@ -16,7 +17,7 @@ const DESKTOP_DOCS = {
 } as const
 
 ;(async () => {
-  if (!isElectron()) return
+  if (!isDesktop) return
 
   const electronAPI = getElectronAPI()
   const desktopAppVersion = await electronAPI.getElectronVersion()

src/platform/settings/composables/useSettingUI.ts

@@ -3,10 +3,10 @@ import type { Component } from 'vue'
 import { useI18n } from 'vue-i18n'
 
 import { useCurrentUser } from '@/composables/auth/useCurrentUser'
+import { isDesktop } from '@/platform/distribution/types'
 import type { SettingTreeNode } from '@/platform/settings/settingStore'
 import { useSettingStore } from '@/platform/settings/settingStore'
 import type { SettingParams } from '@/platform/settings/types'
-import { isElectron } from '@/utils/envUtil'
 import { normalizeI18nKey } from '@/utils/formatUtil'
 import { buildTree } from '@/utils/treeUtil'
 
@@ -129,7 +129,7 @@ export function useSettingUI(
       userPanel,
       keybindingPanel,
       extensionPanel,
-      ...(isElectron() ? [serverConfigPanel] : [])
+      ...(isDesktop ? [serverConfigPanel] : [])
     ].filter((panel) => panel.component)
   )
 
@@ -178,7 +178,7 @@ export function useSettingUI(
         keybindingPanel.node,
         extensionPanel.node,
         aboutPanel.node,
-        ...(isElectron() ? [serverConfigPanel.node] : [])
+        ...(isDesktop ? [serverConfigPanel.node] : [])
       ].map(translateCategory)
     }
   ])

src/platform/updates/common/releaseStore.ts

@@ -3,9 +3,9 @@ import { defineStore } from 'pinia'
 import { compare } from 'semver'
 import { computed, ref } from 'vue'
 
+import { isDesktop } from '@/platform/distribution/types'
 import { useSettingStore } from '@/platform/settings/settingStore'
 import { useSystemStatsStore } from '@/stores/systemStatsStore'
-import { isElectron } from '@/utils/envUtil'
 import { stringToLocale } from '@/utils/formatUtil'
 
 import { useReleaseService } from './releaseService'
@@ -81,7 +81,7 @@ export const useReleaseStore = defineStore('release', () => {
   // Show toast if needed
   const shouldShowToast = computed(() => {
     // Only show on desktop version
-    if (!isElectron()) {
+    if (!isDesktop) {
       return false
     }
 
@@ -113,7 +113,7 @@ export const useReleaseStore = defineStore('release', () => {
   // Show red-dot indicator
   const shouldShowRedDot = computed(() => {
     // Only show on desktop version
-    if (!isElectron()) {
+    if (!isDesktop) {
       return false
     }
 
@@ -160,7 +160,7 @@ export const useReleaseStore = defineStore('release', () => {
   // Show "What's New" popup
   const shouldShowPopup = computed(() => {
     // Only show on desktop version
-    if (!isElectron()) {
+    if (!isDesktop) {
       return false
     }
 

src/router.ts

@@ -4,13 +4,13 @@ import {
   createWebHistory
 } from 'vue-router'
 
+import { isDesktop } from '@/platform/distribution/types'
 import LayoutDefault from '@/views/layouts/LayoutDefault.vue'
 
 import { useUserStore } from './stores/userStore'
-import { isElectron } from './utils/envUtil'
 
 const isFileProtocol = window.location.protocol === 'file:'
-const basePath = isElectron() ? '/' : window.location.pathname
+const basePath = isDesktop ? '/' : window.location.pathname
 
 const router = createRouter({
   history: isFileProtocol

src/stores/aboutPanelStore.ts

@@ -1,8 +1,9 @@
 import { defineStore } from 'pinia'
 import { computed } from 'vue'
 
+import { isDesktop } from '@/platform/distribution/types'
 import type { AboutPageBadge } from '@/types/comfy'
-import { electronAPI, isElectron } from '@/utils/envUtil'
+import { electronAPI } from '@/utils/envUtil'
 
 import { useExtensionStore } from './extensionStore'
 import { useSystemStatsStore } from './systemStatsStore'
@@ -20,9 +21,7 @@ export const useAboutPanelStore = defineStore('aboutPanel', () => {
     // so the python server's API doesn't have the version info.
     {
       label: `ComfyUI ${
-        isElectron()
-          ? 'v' + electronAPI().getComfyUIVersion()
-          : coreVersion.value
+        isDesktop ? 'v' + electronAPI().getComfyUIVersion() : coreVersion.value
       }`,
       url: 'https://github.com/comfyanonymous/ComfyUI',
       icon: 'pi pi-github'

src/stores/electronDownloadStore.ts

@@ -3,7 +3,8 @@ import type { DownloadState } from '@comfyorg/comfyui-electron-types'
 import { defineStore } from 'pinia'
 import { computed, ref } from 'vue'
 
-import { electronAPI, isElectron } from '@/utils/envUtil'
+import { isDesktop } from '@/platform/distribution/types'
+import { electronAPI } from '@/utils/envUtil'
 
 export interface ElectronDownload
   extends Pick<DownloadState, 'url' | 'filename'> {
@@ -21,7 +22,7 @@ export const useElectronDownloadStore = defineStore('downloads', () => {
     downloads.value.find((download) => url === download.url)
 
   const initialize = async () => {
-    if (isElectron()) {
+    if (isDesktop) {
       const allDownloads = await DownloadManager.getAllDownloads()
 
       for (const download of allDownloads) {

src/stores/systemStatsStore.ts

@@ -1,9 +1,9 @@
 import { useAsyncState } from '@vueuse/core'
 import { defineStore } from 'pinia'
 
+import { isDesktop as isDesktopDistribution } from '@/platform/distribution/types'
 import type { SystemStats } from '@/schemas/apiSchema'
 import { api } from '@/scripts/api'
-import { isElectron } from '@/utils/envUtil'
 
 export const useSystemStatsStore = defineStore('systemStats', () => {
   const fetchSystemStatsData = async () => {
@@ -35,7 +35,7 @@ export const useSystemStatsStore = defineStore('systemStats', () => {
     }
 
     const os = systemStats.value.system.os.toLowerCase()
-    const isDesktop = isElectron()
+    const isDesktop = isDesktopDistribution
 
     if (isDesktop) {
       if (os.includes('windows')) {

src/stores/workspace/bottomPanelStore.ts

@@ -6,10 +6,10 @@ import {
   useCommandTerminalTab,
   useLogsTerminalTab
 } from '@/composables/bottomPanelTabs/useTerminalTabs'
+import { isDesktop } from '@/platform/distribution/types'
 import { useCommandStore } from '@/stores/commandStore'
 import type { ComfyExtension } from '@/types/comfy'
 import type { BottomPanelExtension } from '@/types/extensionTypes'
-import { isElectron } from '@/utils/envUtil'
 
 type PanelType = 'terminal' | 'shortcuts'
 
@@ -123,7 +123,7 @@ export const useBottomPanelStore = defineStore('bottomPanel', () => {
 
   const registerCoreBottomPanelTabs = () => {
     registerBottomPanelTab(useLogsTerminalTab())
-    if (isElectron()) {
+    if (isDesktop) {
       registerBottomPanelTab(useCommandTerminalTab())
     }
     useShortcutsTab().forEach(registerBottomPanelTab)

src/views/GraphView.vue

@@ -15,7 +15,7 @@
 
   <GlobalToast />
   <RerouteMigrationToast />
-  <UnloadWindowConfirmDialog v-if="!isElectron()" />
+  <UnloadWindowConfirmDialog v-if="!isDesktop" />
   <MenuHamburger />
 </template>
 
@@ -46,6 +46,7 @@ import { useErrorHandling } from '@/composables/useErrorHandling'
 import { useProgressFavicon } from '@/composables/useProgressFavicon'
 import { SERVER_CONFIG_ITEMS } from '@/constants/serverConfig'
 import { i18n } from '@/i18n'
+import { isDesktop } from '@/platform/distribution/types'
 import { useSettingStore } from '@/platform/settings/settingStore'
 import { useFrontendVersionMismatchWarning } from '@/platform/updates/common/useFrontendVersionMismatchWarning'
 import { useVersionCompatibilityStore } from '@/platform/updates/common/versionCompatibilityStore'
@@ -68,7 +69,7 @@ import { useBottomPanelStore } from '@/stores/workspace/bottomPanelStore'
 import { useColorPaletteStore } from '@/stores/workspace/colorPaletteStore'
 import { useSidebarTabStore } from '@/stores/workspace/sidebarTabStore'
 import { useWorkspaceStore } from '@/stores/workspaceStore'
-import { electronAPI, isElectron } from '@/utils/envUtil'
+import { electronAPI } from '@/utils/envUtil'
 
 setupAutoQueueHandler()
 useProgressFavicon()
@@ -93,7 +94,7 @@ watch(
       document.body.classList.add(DARK_THEME_CLASS)
     }
 
-    if (isElectron()) {
+    if (isDesktop) {
       electronAPI().changeTheme({
         color: 'rgba(0, 0, 0, 0)',
         symbolColor: newTheme.colors.comfy_base['input-text']
@@ -103,7 +104,7 @@ watch(
   { immediate: true }
 )
 
-if (isElectron()) {
+if (isDesktop) {
   watch(
     () => queueStore.tasks,
     (newTasks, oldTasks) => {

src/views/templates/BaseViewTemplate.vue

@@ -22,7 +22,8 @@
 <script setup lang="ts">
 import { nextTick, onMounted, ref } from 'vue'
 
-import { electronAPI, isElectron, isNativeWindow } from '@/utils/envUtil'
+import { isDesktop } from '@/platform/distribution/types'
+import { electronAPI, isNativeWindow } from '@/utils/envUtil'
 
 const { dark = false } = defineProps<{
   dark?: boolean
@@ -40,7 +41,7 @@ const lightTheme = {
 
 const topMenuRef = ref<HTMLDivElement | null>(null)
 onMounted(async () => {
-  if (isElectron()) {
+  if (isDesktop) {
     await nextTick()
 
     electronAPI().changeTheme({

tests-ui/tests/components/bottomPanel/tabs/terminal/BaseTerminal.test.ts

@@ -7,6 +7,10 @@ import { createI18n } from 'vue-i18n'
 
 import BaseTerminal from '@/components/bottomPanel/tabs/terminal/BaseTerminal.vue'
 
+const distributionMock = {
+  isDesktop: false
+}
+
 // Mock xterm and related modules
 vi.mock('@xterm/xterm', () => ({
   Terminal: vi.fn().mockImplementation(() => ({
@@ -53,8 +57,8 @@ vi.mock('@/composables/bottomPanelTabs/useTerminal', () => ({
   }))
 }))
 
+vi.mock('@/platform/distribution/types', () => distributionMock)
 vi.mock('@/utils/envUtil', () => ({
-  isElectron: vi.fn(() => false),
   electronAPI: vi.fn(() => null)
 }))
 
@@ -103,6 +107,7 @@ describe('BaseTerminal', () => {
 
   beforeEach(() => {
     vi.clearAllMocks()
+    distributionMock.isDesktop = false
   })
 
   afterEach(() => {

tests-ui/tests/store/bottomPanelStore.test.ts

@@ -4,6 +4,10 @@ import { beforeEach, describe, expect, it, vi } from 'vitest'
 import { useBottomPanelStore } from '@/stores/workspace/bottomPanelStore'
 import type { BottomPanelExtension } from '@/types/extensionTypes'
 
+const distributionMock = {
+  isDesktop: false
+}
+
 // Mock dependencies
 vi.mock('@/composables/bottomPanelTabs/useShortcutsTab', () => ({
   useShortcutsTab: () => [
@@ -47,13 +51,12 @@ vi.mock('@/stores/commandStore', () => ({
   })
 }))
 
-vi.mock('@/utils/envUtil', () => ({
-  isElectron: () => false
-}))
+vi.mock('@/platform/distribution/types', () => distributionMock)
 
 describe('useBottomPanelStore', () => {
   beforeEach(() => {
     setActivePinia(createPinia())
+    distributionMock.isDesktop = false
   })
 
   it('should initialize with empty panels', () => {

tests-ui/tests/store/releaseStore.test.ts

@@ -4,9 +4,12 @@ import { beforeEach, describe, expect, it, vi } from 'vitest'
 
 import { useReleaseStore } from '@/platform/updates/common/releaseStore'
 
+const distributionMock = {
+  isDesktop: true
+}
+
 // Mock the dependencies
 vi.mock('semver')
-vi.mock('@/utils/envUtil')
 vi.mock('@/platform/updates/common/releaseService')
 vi.mock('@/platform/settings/settingStore')
 vi.mock('@/stores/systemStatsStore')
@@ -15,6 +18,7 @@ vi.mock('@vueuse/core', () => ({
   useStorage: vi.fn(() => ({ value: {} })),
   createSharedComposable: vi.fn((fn) => fn)
 }))
+vi.mock('@/platform/distribution/types', () => distributionMock)
 
 describe('useReleaseStore', () => {
   let store: ReturnType<typeof useReleaseStore>
@@ -36,6 +40,7 @@ describe('useReleaseStore', () => {
 
     // Reset all mocks
     vi.clearAllMocks()
+    distributionMock.isDesktop = true
 
     // Setup mock services
     mockReleaseService = {
@@ -66,12 +71,10 @@ describe('useReleaseStore', () => {
     )
     const { useSettingStore } = await import('@/platform/settings/settingStore')
     const { useSystemStatsStore } = await import('@/stores/systemStatsStore')
-    const { isElectron } = await import('@/utils/envUtil')
 
     vi.mocked(useReleaseService).mockReturnValue(mockReleaseService)
     vi.mocked(useSettingStore).mockReturnValue(mockSettingStore)
     vi.mocked(useSystemStatsStore).mockReturnValue(mockSystemStatsStore)
-    vi.mocked(isElectron).mockReturnValue(true)
 
     // Default showVersionUpdates to true
     mockSettingStore.get.mockImplementation((key: string) => {
@@ -561,20 +564,19 @@ describe('useReleaseStore', () => {
     })
   })
 
-  describe('isElectron environment checks', () => {
-    beforeEach(async () => {
-      // Set up a new version available
+  describe('isDesktop environment checks', () => {
+    beforeEach(() => {
       store.releases = [mockRelease]
       mockSettingStore.get.mockImplementation((key: string) => {
         if (key === 'Comfy.Notification.ShowVersionUpdates') return true
         return null
       })
+      distributionMock.isDesktop = true
     })
 
     describe('when running in Electron (desktop)', () => {
-      beforeEach(async () => {
-        const { isElectron } = await import('@/utils/envUtil')
-        vi.mocked(isElectron).mockReturnValue(true)
+      beforeEach(() => {
+        distributionMock.isDesktop = true
       })
 
       it('should show toast when conditions are met', () => {
@@ -600,9 +602,8 @@ describe('useReleaseStore', () => {
     })
 
     describe('when NOT running in Electron (web)', () => {
-      beforeEach(async () => {
-        const { isElectron } = await import('@/utils/envUtil')
-        vi.mocked(isElectron).mockReturnValue(false)
+      beforeEach(() => {
+        distributionMock.isDesktop = false
       })
 
       it('should NOT show toast even when all other conditions are met', () => {

tests-ui/tests/store/systemStatsStore.test.ts

@@ -3,7 +3,10 @@ import { beforeEach, describe, expect, it, vi } from 'vitest'
 
 import { api } from '@/scripts/api'
 import { useSystemStatsStore } from '@/stores/systemStatsStore'
-import { isElectron } from '@/utils/envUtil'
+
+const distributionMock = {
+  isDesktop: false
+}
 
 // Mock the API
 vi.mock('@/scripts/api', () => ({
@@ -12,10 +15,8 @@ vi.mock('@/scripts/api', () => ({
   }
 }))
 
-// Mock the envUtil
-vi.mock('@/utils/envUtil', () => ({
-  isElectron: vi.fn()
-}))
+// Mock distribution flags
+vi.mock('@/platform/distribution/types', () => distributionMock)
 
 describe('useSystemStatsStore', () => {
   let store: ReturnType<typeof useSystemStatsStore>
@@ -23,6 +24,7 @@ describe('useSystemStatsStore', () => {
   beforeEach(() => {
     // Mock API to prevent automatic fetch on store creation
     vi.mocked(api.getSystemStats).mockResolvedValue(null as any)
+    distributionMock.isDesktop = false
     setActivePinia(createPinia())
     store = useSystemStatsStore()
     vi.clearAllMocks()
@@ -159,7 +161,7 @@ describe('useSystemStatsStore', () => {
 
     describe('desktop environment (Electron)', () => {
       beforeEach(() => {
-        vi.mocked(isElectron).mockReturnValue(true)
+        distributionMock.isDesktop = true
       })
 
       it('should return "desktop-windows" for Windows desktop', () => {
@@ -237,7 +239,7 @@ describe('useSystemStatsStore', () => {
 
     describe('git environment (non-Electron)', () => {
       beforeEach(() => {
-        vi.mocked(isElectron).mockReturnValue(false)
+        distributionMock.isDesktop = false
       })
 
       it('should return "git-windows" for Windows git', () => {
@@ -315,7 +317,7 @@ describe('useSystemStatsStore', () => {
 
     describe('case insensitive OS detection', () => {
       beforeEach(() => {
-        vi.mocked(isElectron).mockReturnValue(false)
+        distributionMock.isDesktop = false
       })
 
       it('should handle uppercase OS names', () => {