From 41eb45754b5cf35c498cb047105b4b4fb0cf47a2 Mon Sep 17 00:00:00 2001
From: Benjamin Lu <benjaminlu1107@gmail.com>
Date: Mon, 8 Dec 2025 21:20:07 -0800
Subject: [PATCH] Fix desktop menu docs links regression (#7181)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

## Summary
- make `useExternalLink` rely on the global i18n locale so it can be
used safely outside setup
- restore `electronAdapter` to use the shared `useExternalLink` helper
for docs URLs and static links

## Motivation
Desktop menu items disappeared because a top-level call to
`useExternalLink` in `electronAdapter` triggered `useI18n` at
module-eval time, throwing and blocking extension registration. By
making the composable global-locale-only and using it in
`electronAdapter`, the module can load without setup context while
preserving link behavior.

## Testing
- pnpm typecheck
- pnpm lint:fix

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7181-Fix-desktop-menu-docs-links-regression-2c06d73d36508157ae48cff078b9173e)
by [Unito](https://www.unito.io)
---
 src/composables/useExternalLink.ts            |  4 +-
 .../tests/composables/useExternalLink.test.ts | 38 ++++++++++---------
 2 files changed, 22 insertions(+), 20 deletions(-)

diff --git a/src/composables/useExternalLink.ts b/src/composables/useExternalLink.ts
index 59cb9f689..2758e2ced 100644
--- a/src/composables/useExternalLink.ts
+++ b/src/composables/useExternalLink.ts
@@ -1,7 +1,7 @@
 import { computed } from 'vue'
 
 import { electronAPI, isElectron } from '@/utils/envUtil'
-import { useI18n } from 'vue-i18n'
+import { i18n } from '@/i18n'
 
 /**
  * Composable for building docs.comfy.org URLs with automatic locale and platform detection
@@ -23,7 +23,7 @@ import { useI18n } from 'vue-i18n'
  * ```
  */
 export function useExternalLink() {
-  const { locale } = useI18n()
+  const locale = computed(() => String(i18n.global.locale.value))
 
   const isChinese = computed(() => {
     return locale.value === 'zh' || locale.value === 'zh-TW'
diff --git a/tests-ui/tests/composables/useExternalLink.test.ts b/tests-ui/tests/composables/useExternalLink.test.ts
index 986322cba..7f0ef90aa 100644
--- a/tests-ui/tests/composables/useExternalLink.test.ts
+++ b/tests-ui/tests/composables/useExternalLink.test.ts
@@ -1,7 +1,4 @@
 import { beforeEach, describe, expect, it, vi } from 'vitest'
-import { ref } from 'vue'
-
-import { useExternalLink } from '@/composables/useExternalLink'
 
 // Mock the environment utilities
 vi.mock('@/utils/envUtil', () => ({
@@ -9,22 +6,27 @@ vi.mock('@/utils/envUtil', () => ({
   electronAPI: vi.fn()
 }))
 
-// Mock vue-i18n
-const mockLocale = ref('en')
-vi.mock('vue-i18n', () => ({
-  useI18n: vi.fn(() => ({
-    locale: mockLocale
-  }))
+// Provide a minimal i18n instance for the composable
+const i18n = vi.hoisted(() => ({
+  global: {
+    locale: {
+      value: 'en'
+    }
+  }
+}))
+vi.mock('@/i18n', () => ({
+  i18n
 }))
 
 // Import after mocking to get the mocked versions
+import { useExternalLink } from '@/composables/useExternalLink'
 import { electronAPI, isElectron } from '@/utils/envUtil'
 
 describe('useExternalLink', () => {
   beforeEach(() => {
     vi.clearAllMocks()
     // Reset to default state
-    mockLocale.value = 'en'
+    i18n.global.locale.value = 'en'
     vi.mocked(isElectron).mockReturnValue(false)
   })
 
@@ -53,7 +55,7 @@ describe('useExternalLink', () => {
 
   describe('buildDocsUrl', () => {
     it('should build basic docs URL without locale', () => {
-      mockLocale.value = 'en'
+      i18n.global.locale.value = 'en'
       const { buildDocsUrl } = useExternalLink()
 
       const url = buildDocsUrl('/changelog')
@@ -61,7 +63,7 @@ describe('useExternalLink', () => {
     })
 
     it('should build docs URL with Chinese (zh) locale when requested', () => {
-      mockLocale.value = 'zh'
+      i18n.global.locale.value = 'zh'
       const { buildDocsUrl } = useExternalLink()
 
       const url = buildDocsUrl('/changelog', { includeLocale: true })
@@ -69,7 +71,7 @@ describe('useExternalLink', () => {
     })
 
     it('should build docs URL with Chinese (zh-TW) locale when requested', () => {
-      mockLocale.value = 'zh-TW'
+      i18n.global.locale.value = 'zh-TW'
       const { buildDocsUrl } = useExternalLink()
 
       const url = buildDocsUrl('/changelog', { includeLocale: true })
@@ -77,7 +79,7 @@ describe('useExternalLink', () => {
     })
 
     it('should not include locale for English when requested', () => {
-      mockLocale.value = 'en'
+      i18n.global.locale.value = 'en'
       const { buildDocsUrl } = useExternalLink()
 
       const url = buildDocsUrl('/changelog', { includeLocale: true })
@@ -92,7 +94,7 @@ describe('useExternalLink', () => {
     })
 
     it('should add platform suffix when requested', () => {
-      mockLocale.value = 'en'
+      i18n.global.locale.value = 'en'
       vi.mocked(isElectron).mockReturnValue(true)
       vi.mocked(electronAPI).mockReturnValue({
         getPlatform: () => 'darwin'
@@ -104,7 +106,7 @@ describe('useExternalLink', () => {
     })
 
     it('should add platform suffix with trailing slash', () => {
-      mockLocale.value = 'en'
+      i18n.global.locale.value = 'en'
       vi.mocked(isElectron).mockReturnValue(true)
       vi.mocked(electronAPI).mockReturnValue({
         getPlatform: () => 'win32'
@@ -116,7 +118,7 @@ describe('useExternalLink', () => {
     })
 
     it('should combine locale and platform', () => {
-      mockLocale.value = 'zh'
+      i18n.global.locale.value = 'zh'
       vi.mocked(isElectron).mockReturnValue(true)
       vi.mocked(electronAPI).mockReturnValue({
         getPlatform: () => 'darwin'
@@ -133,7 +135,7 @@ describe('useExternalLink', () => {
     })
 
     it('should not add platform when not desktop', () => {
-      mockLocale.value = 'en'
+      i18n.global.locale.value = 'en'
       vi.mocked(isElectron).mockReturnValue(false)
 
       const { buildDocsUrl } = useExternalLink()