[style] Migrate to @prettier/plugin-oxc for faster formatting

.prettierrc

@@ -4,15 +4,15 @@
   "semi": false,
   "trailingComma": "none",
   "printWidth": 80,
-  "importOrder": ["^@core/(.*)$", "<THIRD_PARTY_MODULES>", "^@/(.*)$", "^[./]"],
-  "importOrderSeparation": true,
-  "importOrderSortSpecifiers": true,
-  "overrides": [
-    {
-      "files": "*.{js,cjs,mjs,ts,cts,mts,tsx,vue}",
-      "options": {
-        "plugins": ["@trivago/prettier-plugin-sort-imports"]
-      }
-    }
-  ]
+  "importOrder": [
+    "^@core/(.*)$",
+    "",
+    "<THIRD_PARTY_MODULES>",
+    "",
+    "^@/(.*)$",
+    "",
+    "^[./]"
+  ],
+  "importOrderTypeScriptVersion": "5.0.0",
+  "plugins": ["@prettier/plugin-oxc", "@ianvs/prettier-plugin-sort-imports"]
 }

.storybook/preview.ts

@@ -3,14 +3,18 @@ import Aura from '@primevue/themes/aura'
 import { setup } from '@storybook/vue3'
 import type { Preview, StoryContext, StoryFn } from '@storybook/vue3-vite'
 import { createPinia } from 'pinia'
+
 import 'primeicons/primeicons.css'
+
 import PrimeVue from 'primevue/config'
 import ConfirmationService from 'primevue/confirmationservice'
 import ToastService from 'primevue/toastservice'
 import Tooltip from 'primevue/tooltip'
 
 import '@/assets/css/style.css'
+
 import { i18n } from '@/i18n'
+
 import '@/lib/litegraph/public/css/litegraph.css'
 
 const ComfyUIPreset = definePreset(Aura, {

apps/desktop-ui/.storybook/preview.ts

@@ -3,13 +3,16 @@ import Aura from '@primevue/themes/aura'
 import { setup } from '@storybook/vue3'
 import type { Preview, StoryContext, StoryFn } from '@storybook/vue3-vite'
 import { createPinia } from 'pinia'
+
 import 'primeicons/primeicons.css'
+
 import PrimeVue from 'primevue/config'
 import ConfirmationService from 'primevue/confirmationservice'
 import ToastService from 'primevue/toastservice'
 import Tooltip from 'primevue/tooltip'
 
 import '@/assets/css/style.css'
+
 import { i18n } from '@/i18n'
 
 const ComfyUIPreset = definePreset(Aura, {

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

@@ -29,8 +29,7 @@
 import { useElementHover, useEventListener } from '@vueuse/core'
 import type { IDisposable } from '@xterm/xterm'
 import Button from 'primevue/button'
-import type { Ref } from 'vue'
-import { computed, onMounted, onUnmounted, ref } from 'vue'
+import { computed, onMounted, onUnmounted, ref, type Ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 
 import { useTerminal } from '@/composables/bottomPanelTabs/useTerminal'

apps/desktop-ui/src/components/install/InstallLocationPicker.vue

@@ -104,8 +104,10 @@
 </template>
 
 <script setup lang="ts">
-import type { TorchDeviceType } from '@comfyorg/comfyui-electron-types'
-import { TorchMirrorUrl } from '@comfyorg/comfyui-electron-types'
+import {
+  TorchMirrorUrl,
+  type TorchDeviceType
+} from '@comfyorg/comfyui-electron-types'
 import { isInChina } from '@comfyorg/shared-frontend-utils/networkUtil'
 import Accordion from 'primevue/accordion'
 import AccordionContent from 'primevue/accordioncontent'
@@ -115,7 +117,7 @@ import Button from 'primevue/button'
 import Divider from 'primevue/divider'
 import InputText from 'primevue/inputtext'
 import Message from 'primevue/message'
-import { type ModelRef, computed, onMounted, ref } from 'vue'
+import { computed, onMounted, ref, type ModelRef } from 'vue'
 import { useI18n } from 'vue-i18n'
 
 import MigrationPicker from '@/components/install/MigrationPicker.vue'

apps/desktop-ui/src/components/maintenance/TaskListStatusIcon.vue

@@ -8,8 +8,7 @@
 <script setup lang="ts">
 import { PrimeIcons } from '@primevue/core/api'
 import ProgressSpinner from 'primevue/progressspinner'
-import type { MaybeRef } from 'vue'
-import { computed } from 'vue'
+import { computed, type MaybeRef } from 'vue'
 
 import { t } from '@/i18n'
 

apps/desktop-ui/src/components/maintenance/TerminalOutputDrawer.vue

@@ -12,8 +12,7 @@
 <script setup lang="ts">
 import type { Terminal } from '@xterm/xterm'
 import Drawer from 'primevue/drawer'
-import type { Ref } from 'vue'
-import { onMounted } from 'vue'
+import { onMounted, type Ref } from 'vue'
 
 import BaseTerminal from '@/components/bottomPanel/tabs/terminal/BaseTerminal.vue'
 import type { useTerminal } from '@/composables/bottomPanelTabs/useTerminal'

apps/desktop-ui/src/composables/bottomPanelTabs/useTerminal.ts

@@ -1,9 +1,10 @@
 import { FitAddon } from '@xterm/addon-fit'
 import { Terminal } from '@xterm/xterm'
+
 import '@xterm/xterm/css/xterm.css'
+
 import { debounce } from 'es-toolkit/compat'
-import type { Ref } from 'vue'
-import { markRaw, onMounted, onUnmounted } from 'vue'
+import { markRaw, onMounted, onUnmounted, type Ref } from 'vue'
 
 export function useTerminal(element: Ref<HTMLElement | undefined>) {
   const fitAddon = new FitAddon()

apps/desktop-ui/src/main.ts

@@ -1,15 +1,19 @@
 import { definePreset } from '@primevue/themes'
 import Aura from '@primevue/themes/aura'
 import { createPinia } from 'pinia'
+
 import 'primeicons/primeicons.css'
+
 import PrimeVue from 'primevue/config'
 import ConfirmationService from 'primevue/confirmationservice'
 import ToastService from 'primevue/toastservice'
 import Tooltip from 'primevue/tooltip'
 import { createApp } from 'vue'
 
 import App from './App.vue'
+
 import './assets/css/style.css'
+
 import { i18n } from './i18n'
 import router from './router'
 

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

@@ -1,5 +1,5 @@
 import { useTimeout } from '@vueuse/core'
-import { type Ref, computed, ref, watch } from 'vue'
+import { computed, ref, watch, type Ref } from 'vue'
 
 /**
  * Vue boolean ref (writable computed) with one difference: when set to `true` it stays that way for at least {@link minDuration}.

apps/desktop-ui/src/views/DesktopDialogView.vue

@@ -29,7 +29,7 @@ import { normalizeI18nKey } from '@comfyorg/shared-frontend-utils/formatUtil'
 import Button from 'primevue/button'
 import { useRoute } from 'vue-router'
 
-import { type DialogAction, getDialog } from '@/constants/desktopDialogs'
+import { getDialog, type DialogAction } from '@/constants/desktopDialogs'
 import { t } from '@/i18n'
 import { electronAPI } from '@/utils/envUtil'
 

apps/desktop-ui/src/views/MaintenanceView.vue

@@ -91,8 +91,7 @@ import Button from 'primevue/button'
 import SelectButton from 'primevue/selectbutton'
 import Toast from 'primevue/toast'
 import { useToast } from 'primevue/usetoast'
-import { computed, onMounted, onUnmounted, ref } from 'vue'
-import { watch } from 'vue'
+import { computed, onMounted, onUnmounted, ref, watch } from 'vue'
 
 import RefreshButton from '@/components/common/RefreshButton.vue'
 import StatusTag from '@/components/maintenance/StatusTag.vue'

apps/desktop-ui/src/views/ServerStartView.vue

@@ -98,14 +98,13 @@
 <script setup lang="ts">
 import {
   InstallStage,
+  ProgressStatus,
   type InstallStageInfo,
-  type InstallStageName,
-  ProgressStatus
+  type InstallStageName
 } from '@comfyorg/comfyui-electron-types'
 import type { Terminal } from '@xterm/xterm'
 import Button from 'primevue/button'
-import type { Ref } from 'vue'
-import { computed, onMounted, onUnmounted, ref } from 'vue'
+import { computed, onMounted, onUnmounted, ref, type Ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 
 import BaseTerminal from '@/components/bottomPanel/tabs/terminal/BaseTerminal.vue'

apps/desktop-ui/vite.config.mts

@@ -1,8 +1,9 @@
+import path from 'node:path'
+import { fileURLToPath } from 'node:url'
+
 import tailwindcss from '@tailwindcss/vite'
 import vue from '@vitejs/plugin-vue'
 import dotenv from 'dotenv'
-import path from 'node:path'
-import { fileURLToPath } from 'node:url'
 import { FileSystemIconLoader } from 'unplugin-icons/loaders'
 import IconsResolver from 'unplugin-icons/resolver'
 import Icons from 'unplugin-icons/vite'

browser_tests/fixtures/ComfyPage.ts

@@ -1,8 +1,14 @@
-import type { APIRequestContext, Locator, Page } from '@playwright/test'
-import { test as base, expect } from '@playwright/test'
-import dotenv from 'dotenv'
 import * as fs from 'fs'
 
+import {
+  test as base,
+  expect,
+  type APIRequestContext,
+  type Locator,
+  type Page
+} from '@playwright/test'
+import dotenv from 'dotenv'
+
 import type { LGraphNode } from '../../src/lib/litegraph/src/litegraph'
 import type { NodeId } from '../../src/platform/workflow/validation/schemas/workflowSchema'
 import type { KeyCombo } from '../../src/schemas/keyBindingSchema'
@@ -11,7 +17,6 @@ import { NodeBadgeMode } from '../../src/types/nodeSource'
 import { ComfyActionbar } from '../helpers/actionbar'
 import { ComfyTemplates } from '../helpers/templates'
 import { ComfyMouse } from './ComfyMouse'
-import { VueNodeHelpers } from './VueNodeHelpers'
 import { ComfyNodeSearchBox } from './components/ComfyNodeSearchBox'
 import { SettingDialog } from './components/SettingDialog'
 import {
@@ -23,6 +28,7 @@ import { Topbar } from './components/Topbar'
 import type { Position, Size } from './types'
 import { NodeReference, SubgraphSlotReference } from './utils/litegraphUtils'
 import TaskHistory from './utils/taskHistory'
+import { VueNodeHelpers } from './VueNodeHelpers'
 
 dotenv.config()
 

browser_tests/fixtures/UserSelectPage.ts

@@ -1,5 +1,4 @@
-import type { Page } from '@playwright/test'
-import { test as base } from '@playwright/test'
+import { test as base, type Page } from '@playwright/test'
 
 export class UserSelectPage {
   constructor(

browser_tests/fixtures/components/Topbar.ts

@@ -1,5 +1,4 @@
-import type { Locator, Page } from '@playwright/test'
-import { expect } from '@playwright/test'
+import { expect, type Locator, type Page } from '@playwright/test'
 
 export class Topbar {
   private readonly menuLocator: Locator

browser_tests/fixtures/utils/taskHistory.ts

@@ -1,7 +1,8 @@
-import type { Request, Route } from '@playwright/test'
-import _ from 'es-toolkit/compat'
 import fs from 'fs'
 import path from 'path'
+
+import type { Request, Route } from '@playwright/test'
+import _ from 'es-toolkit/compat'
 import { v4 as uuidv4 } from 'uuid'
 
 import type {

browser_tests/fixtures/utils/vueNodeFixtures.ts

@@ -1,5 +1,4 @@
-import { expect } from '@playwright/test'
-import type { Locator } from '@playwright/test'
+import { expect, type Locator } from '@playwright/test'
 
 /** DOM-centric helper for a single Vue-rendered node on the canvas. */
 export class VueNodeFixture {

browser_tests/helpers/templates.ts

@@ -1,6 +1,7 @@
-import type { Locator, Page } from '@playwright/test'
 import path from 'path'
 
+import type { Locator, Page } from '@playwright/test'
+
 import type {
   TemplateInfo,
   WorkflowTemplates

browser_tests/tests/actionbar.spec.ts

@@ -1,5 +1,4 @@
-import type { Response } from '@playwright/test'
-import { expect, mergeTests } from '@playwright/test'
+import { expect, mergeTests, type Response } from '@playwright/test'
 
 import type { StatusWsMessage } from '../../src/schemas/apiSchema.ts'
 import { comfyPageFixture } from '../fixtures/ComfyPage.ts'

browser_tests/tests/changeTracker.spec.ts

@@ -1,7 +1,7 @@
-import type { ComfyPage } from '../fixtures/ComfyPage'
 import {
   comfyExpect as expect,
-  comfyPageFixture as test
+  comfyPageFixture as test,
+  type ComfyPage
 } from '../fixtures/ComfyPage'
 
 async function beforeChange(comfyPage: ComfyPage) {

browser_tests/tests/chatHistory.spec.ts

@@ -1,5 +1,4 @@
-import type { Page } from '@playwright/test'
-import { expect } from '@playwright/test'
+import { expect, type Page } from '@playwright/test'
 
 import { comfyPageFixture as test } from '../fixtures/ComfyPage'
 

browser_tests/tests/customIcons.spec.ts

@@ -1,5 +1,4 @@
-import { expect } from '@playwright/test'
-import type { Locator } from '@playwright/test'
+import { expect, type Locator } from '@playwright/test'
 
 import { comfyPageFixture as test } from '../fixtures/ComfyPage'
 

browser_tests/tests/dialog.spec.ts

@@ -1,5 +1,4 @@
-import type { Locator } from '@playwright/test'
-import { expect } from '@playwright/test'
+import { expect, type Locator } from '@playwright/test'
 
 import type { Keybinding } from '../../src/schemas/keyBindingSchema'
 import { comfyPageFixture as test } from '../fixtures/ComfyPage'

browser_tests/tests/groupNode.spec.ts

@@ -1,7 +1,6 @@
 import { expect } from '@playwright/test'
 
-import type { ComfyPage } from '../fixtures/ComfyPage'
-import { comfyPageFixture as test } from '../fixtures/ComfyPage'
+import { comfyPageFixture as test, type ComfyPage } from '../fixtures/ComfyPage'
 import type { NodeReference } from '../fixtures/utils/litegraphUtils'
 
 test.beforeEach(async ({ comfyPage }) => {

browser_tests/tests/interaction.spec.ts

@@ -1,12 +1,11 @@
-import type { Locator } from '@playwright/test'
-import { expect } from '@playwright/test'
+import { expect, type Locator } from '@playwright/test'
 import type { Position } from '@vueuse/core'
 
 import {
   comfyPageFixture as test,
-  testComfySnapToGridGridSize
+  testComfySnapToGridGridSize,
+  type ComfyPage
 } from '../fixtures/ComfyPage'
-import type { ComfyPage } from '../fixtures/ComfyPage'
 import type { NodeReference } from '../fixtures/utils/litegraphUtils'
 
 test.beforeEach(async ({ comfyPage }) => {

browser_tests/tests/remoteWidgets.spec.ts

@@ -1,7 +1,6 @@
 import { expect } from '@playwright/test'
 
-import type { ComfyPage } from '../fixtures/ComfyPage'
-import { comfyPageFixture as test } from '../fixtures/ComfyPage'
+import { comfyPageFixture as test, type ComfyPage } from '../fixtures/ComfyPage'
 
 test.describe('Remote COMBO Widget', () => {
   const mockOptions = ['d', 'c', 'b', 'a']

browser_tests/tests/templates.spec.ts

@@ -1,5 +1,4 @@
-import type { Page } from '@playwright/test'
-import { expect } from '@playwright/test'
+import { expect, type Page } from '@playwright/test'
 
 import { comfyPageFixture as test } from '../fixtures/ComfyPage'
 

browser_tests/tests/vueNodes/interactions/node/move.spec.ts

@@ -1,7 +1,7 @@
 import {
-  type ComfyPage,
   comfyExpect as expect,
-  comfyPageFixture as test
+  comfyPageFixture as test,
+  type ComfyPage
 } from '../../../../fixtures/ComfyPage'
 import type { Position } from '../../../../fixtures/types'
 

browser_tests/tests/vueNodes/widgets/text/multilineStringWidget.spec.ts

@@ -1,7 +1,7 @@
 import {
-  type ComfyPage,
   comfyExpect as expect,
-  comfyPageFixture as test
+  comfyPageFixture as test,
+  type ComfyPage
 } from '../../../../fixtures/ComfyPage'
 
 test.describe('Vue Multiline String Widget', () => {

browser_tests/tests/workflowTabThumbnail.spec.ts

@@ -1,6 +1,6 @@
 import { expect } from '@playwright/test'
 
-import { type ComfyPage, comfyPageFixture as test } from '../fixtures/ComfyPage'
+import { comfyPageFixture as test, type ComfyPage } from '../fixtures/ComfyPage'
 
 test.describe('Workflow Tab Thumbnails', () => {
   test.beforeEach(async ({ comfyPage }) => {

browser_tests/utils/backupUtils.ts

@@ -1,6 +1,7 @@
-import fs from 'fs-extra'
 import path from 'path'
 
+import fs from 'fs-extra'
+
 type PathParts = readonly [string, ...string[]]
 
 const getBackupPath = (originalPath: string): string => `${originalPath}.bak`