fix(desktop-ui): resolve linting and typecheck errors (#7271)

Fixes linting configuration and type errors in apps/desktop-ui.

## Changes
- Updated `eslint.config.ts` to use absolute path for `.oxlintrc.json`
resolution.
- Fixed `import-x` errors in `InstallFooter.vue`, `refUtil.ts`, and
`DesktopDialogView.vue`.
- Fixed i18n raw text error in `NotSupportedView.vue` via
eslint-disable.
- Fixed type inference issue in `i18n.ts` allowing dynamic locale
switching.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7271-fix-desktop-ui-resolve-linting-and-typecheck-errors-2c46d73d3650817cbb66cc7b1dc670a8)
by [Unito](https://www.unito.io)

apps/desktop-ui/package.json

@@ -87,6 +87,8 @@
     }
   },
   "scripts": {
+    "lint": "nx run @comfyorg/desktop-ui:lint",
+    "typecheck": "nx run @comfyorg/desktop-ui:typecheck",
     "storybook": "storybook dev -p 6007",
     "build-storybook": "storybook build -o dist/storybook"
   },

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

@@ -40,7 +40,8 @@
 <script setup lang="ts">
 import type { PassThrough } from '@primevue/core'
 import Button from 'primevue/button'
-import Step, { type StepPassThroughOptions } from 'primevue/step'
+import Step from 'primevue/step'
+import type { StepPassThroughOptions } from 'primevue/step'
 import StepList from 'primevue/steplist'
 
 defineProps<{

apps/desktop-ui/src/i18n.ts

@@ -155,12 +155,14 @@ export async function loadLocale(locale: string): Promise<void> {
 }
 
 // Only include English in the initial bundle
-const messages = {
+const enMessages = buildLocale(en, enNodes, enCommands, enSettings)
-  en: buildLocale(en, enNodes, enCommands, enSettings)
-}
 
 // Type for locale messages - inferred from the English locale structure
-type LocaleMessages = typeof messages.en
+type LocaleMessages = typeof enMessages
+
+const messages: Record<string, LocaleMessages> = {
+  en: enMessages
+}
 
 export const i18n = createI18n({
   // Must set `false`, as Vue I18n Legacy API is for Vue 2

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

@@ -1,5 +1,6 @@
 import { useTimeout } from '@vueuse/core'
-import { type Ref, computed, ref, watch } from 'vue'
+import { computed, ref, watch } from 'vue'
+import 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,8 @@ 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 } from '@/constants/desktopDialogs'
+import type { DialogAction } from '@/constants/desktopDialogs'
 import { t } from '@/i18n'
 import { electronAPI } from '@/utils/envUtil'
 

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

@@ -5,7 +5,7 @@
       <img
         class="sad-girl"
         src="/assets/images/sad_girl.png"
-        alt="Sad girl illustration"
+        :alt="$t('notSupported.illustrationAlt')"
       />
 
       <div class="no-drag sad-text flex items-center">

eslint.config.ts

@@ -15,6 +15,7 @@ import {
   parser as tseslintParser
 } from 'typescript-eslint'
 import vueParser from 'vue-eslint-parser'
+import path from 'node:path'
 
 const extraFileExtensions = ['.vue']
 
@@ -292,6 +293,9 @@ export default defineConfig([
       'no-console': 'off'
     }
   },
+
   // Turn off ESLint rules that are already handled by oxlint
-  ...oxlint.buildFromOxlintConfigFile('./.oxlintrc.json')
+  ...oxlint.buildFromOxlintConfigFile(
+    path.resolve(import.meta.dirname, '.oxlintrc.json')
+  )
 ])

package.json

@@ -34,6 +34,7 @@
     "lint:unstaged:fix": "git diff --name-only HEAD | grep -E '\\.(js|ts|vue|mts)$' | xargs -r eslint --cache --fix",
     "lint:unstaged": "git diff --name-only HEAD | grep -E '\\.(js|ts|vue|mts)$' | xargs -r eslint --cache",
     "lint": "oxlint src --type-aware && eslint src --cache",
+    "lint:desktop": "nx run @comfyorg/desktop-ui:lint",
     "locale": "lobe-i18n locale",
     "oxlint": "oxlint src --type-aware",
     "preinstall": "pnpm dlx only-allow pnpm",
@@ -46,6 +47,7 @@
     "test:browser:local": "cross-env PLAYWRIGHT_LOCAL=1 pnpm test:browser",
     "test:unit": "nx run test",
     "typecheck": "vue-tsc --noEmit",
+    "typecheck:desktop": "nx run @comfyorg/desktop-ui:typecheck",
     "zipdist": "node scripts/zipdist.js",
     "clean": "nx reset"
   },

src/locales/en/main.json

@@ -475,6 +475,7 @@
   "notSupported": {
     "title": "Your device is not supported",
     "message": "Only following devices are supported:",
+    "illustrationAlt": "Sad girl illustration",
     "learnMore": "Learn More",
     "reportIssue": "Report Issue",
     "supportedDevices": {