diff --git a/browser_tests/fixtures/ComfyPage.ts b/browser_tests/fixtures/ComfyPage.ts index e27f440cd..00c9ca098 100644 --- a/browser_tests/fixtures/ComfyPage.ts +++ b/browser_tests/fixtures/ComfyPage.ts @@ -270,6 +270,7 @@ export class ComfyPage { localStorage.clear() sessionStorage.clear() localStorage.setItem('Comfy.userId', id) + localStorage.setItem('api-nodes-news-seen', 'true') }, this.id) } await this.goto() diff --git a/src/assets/images/api-nodes-news.webp b/src/assets/images/api-nodes-news.webp new file mode 100644 index 000000000..e0f6b0e2f Binary files /dev/null and b/src/assets/images/api-nodes-news.webp differ diff --git a/src/components/dialog/content/ApiNodesNewsContent.vue b/src/components/dialog/content/ApiNodesNewsContent.vue new file mode 100644 index 000000000..83490f897 --- /dev/null +++ b/src/components/dialog/content/ApiNodesNewsContent.vue @@ -0,0 +1,69 @@ + + + diff --git a/src/locales/en/main.json b/src/locales/en/main.json index b9c5b4b36..8dc9f1445 100644 --- a/src/locales/en/main.json +++ b/src/locales/en/main.json @@ -1192,5 +1192,25 @@ "provider": "Sign-in Provider", "notSet": "Not set", "updatePassword": "Update Password" + }, + "apiNodesNews": { + "introducing": "Introducing", + "subtitle": "All External Models now available in ComfyUI", + "steps": { + "step1": { + "title": "Login/Create an account:", + "subtitle": "Settings > User > Login" + }, + "step2": { + "title": "Purchase credits:", + "subtitle": "Settings > Credits > Buy Credits" + }, + "step3": { + "title": "Locate new API Nodes under 'API Node' section and add to the canvas" + }, + "step4": { + "title": "Run!" + } + } } } \ No newline at end of file diff --git a/src/locales/es/main.json b/src/locales/es/main.json index 466d81fe0..ec9db1cb3 100644 --- a/src/locales/es/main.json +++ b/src/locales/es/main.json @@ -4,6 +4,26 @@ "title": "Nodo(s) de API", "totalCost": "Costo total" }, + "apiNodesNews": { + "introducing": "Presentamos", + "steps": { + "step1": { + "subtitle": "Configuración > Usuario > Iniciar sesión", + "title": "Inicia sesión/Crea una cuenta:" + }, + "step2": { + "subtitle": "Configuración > Créditos > Comprar créditos", + "title": "Compra créditos:" + }, + "step3": { + "title": "Ubica los nuevos nodos API en la sección 'API Node' y agrégalos al lienzo" + }, + "step4": { + "title": "¡Ejecuta!" + } + }, + "subtitle": "Todos los modelos externos ahora disponibles en ComfyUI" + }, "apiNodesSignInDialog": { "message": "Este flujo de trabajo contiene nodos de API, que requieren que inicies sesión en tu cuenta para poder ejecutar.", "title": "Se requiere iniciar sesión para usar los nodos de API" diff --git a/src/locales/fr/main.json b/src/locales/fr/main.json index 17c475057..3de32fde0 100644 --- a/src/locales/fr/main.json +++ b/src/locales/fr/main.json @@ -4,6 +4,26 @@ "title": "Nœud(s) API", "totalCost": "Coût total" }, + "apiNodesNews": { + "introducing": "Présentation", + "steps": { + "step1": { + "subtitle": "Paramètres > Utilisateur > Connexion", + "title": "Connectez-vous / Créez un compte :" + }, + "step2": { + "subtitle": "Paramètres > Crédits > Acheter des crédits", + "title": "Achetez des crédits :" + }, + "step3": { + "title": "Trouvez les nouveaux nœuds API dans la section 'API Node' et ajoutez-les à la toile" + }, + "step4": { + "title": "Lancez !" + } + }, + "subtitle": "Tous les modèles externes sont désormais disponibles dans ComfyUI" + }, "apiNodesSignInDialog": { "message": "Ce flux de travail contient des nœuds API, qui nécessitent que vous soyez connecté à votre compte pour pouvoir fonctionner.", "title": "Connexion requise pour utiliser les nœuds API" diff --git a/src/locales/ja/main.json b/src/locales/ja/main.json index 7ad30e5e3..72bd3fc78 100644 --- a/src/locales/ja/main.json +++ b/src/locales/ja/main.json @@ -4,6 +4,26 @@ "title": "APIノード", "totalCost": "合計コスト" }, + "apiNodesNews": { + "introducing": "紹介", + "steps": { + "step1": { + "subtitle": "設定 > ユーザー > ログイン", + "title": "ログイン/アカウント作成:" + }, + "step2": { + "subtitle": "設定 > クレジット > クレジットを購入", + "title": "クレジットを購入:" + }, + "step3": { + "title": "「APIノード」セクションで新しいAPIノードを見つけてキャンバスに追加" + }, + "step4": { + "title": "実行!" + } + }, + "subtitle": "すべての外部モデルがComfyUIで利用可能になりました" + }, "apiNodesSignInDialog": { "message": "このワークフローにはAPIノードが含まれており、実行するためにはアカウントにサインインする必要があります。", "title": "APIノードを使用するためにはサインインが必要です" diff --git a/src/locales/ko/main.json b/src/locales/ko/main.json index 25f127fb7..f04c26632 100644 --- a/src/locales/ko/main.json +++ b/src/locales/ko/main.json @@ -4,6 +4,26 @@ "title": "API 노드(들)", "totalCost": "총 비용" }, + "apiNodesNews": { + "introducing": "소개합니다", + "steps": { + "step1": { + "subtitle": "설정 > 사용자 > 로그인", + "title": "로그인/계정 생성:" + }, + "step2": { + "subtitle": "설정 > 크레딧 > 크레딧 구매", + "title": "크레딧 구매:" + }, + "step3": { + "title": "'API Node' 섹션에서 새로운 API 노드를 찾아 캔버스에 추가하세요" + }, + "step4": { + "title": "실행!" + } + }, + "subtitle": "모든 외부 모델이 이제 ComfyUI에서 사용 가능합니다" + }, "apiNodesSignInDialog": { "message": "이 워크플로우에는 API 노드가 포함되어 있으며, 실행하려면 계정에 로그인해야 합니다.", "title": "API 노드 사용에 필요한 로그인" diff --git a/src/locales/ru/main.json b/src/locales/ru/main.json index 20f8e89c7..4fc6ff548 100644 --- a/src/locales/ru/main.json +++ b/src/locales/ru/main.json @@ -4,6 +4,26 @@ "title": "API Node(s)", "totalCost": "Общая стоимость" }, + "apiNodesNews": { + "introducing": "Представляем", + "steps": { + "step1": { + "subtitle": "Настройки > Пользователь > Войти", + "title": "Войти/Создать аккаунт:" + }, + "step2": { + "subtitle": "Настройки > Кредиты > Купить кредиты", + "title": "Купить кредиты:" + }, + "step3": { + "title": "Найдите новые API-узлы в разделе 'API Node' и добавьте их на холст" + }, + "step4": { + "title": "Запустить!" + } + }, + "subtitle": "Все внешние модели теперь доступны в ComfyUI" + }, "apiNodesSignInDialog": { "message": "Этот рабочий процесс содержит API Nodes, которые требуют входа в вашу учетную запись для выполнения.", "title": "Требуется вход для использования API Nodes" diff --git a/src/locales/zh/main.json b/src/locales/zh/main.json index 9155f9d5d..d8c3493f4 100644 --- a/src/locales/zh/main.json +++ b/src/locales/zh/main.json @@ -4,6 +4,26 @@ "title": "API节点", "totalCost": "总成本" }, + "apiNodesNews": { + "introducing": "介绍", + "steps": { + "step1": { + "subtitle": "设置 > 用户 > 登录", + "title": "登录/创建账户:" + }, + "step2": { + "subtitle": "设置 > 积分 > 购买积分", + "title": "购买积分:" + }, + "step3": { + "title": "在“API 节点”部分找到新的 API 节点并添加到画布" + }, + "step4": { + "title": "运行!" + } + }, + "subtitle": "所有外部模型现已在 ComfyUI 中可用" + }, "apiNodesSignInDialog": { "message": "此工作流包含API节点,需要您登录账户才能运行。", "title": "使用API节点需要登录" diff --git a/src/services/dialogService.ts b/src/services/dialogService.ts index dff67e533..105f2333e 100644 --- a/src/services/dialogService.ts +++ b/src/services/dialogService.ts @@ -1,3 +1,4 @@ +import ApiNodesNewsContent from '@/components/dialog/content/ApiNodesNewsContent.vue' import ApiNodesSignInContent from '@/components/dialog/content/ApiNodesSignInContent.vue' import ConfirmationDialogContent from '@/components/dialog/content/ConfirmationDialogContent.vue' import ErrorDialogContent from '@/components/dialog/content/ErrorDialogContent.vue' @@ -379,6 +380,31 @@ export const useDialogService = () => { }) } + /** + * Shows a dialog for the API nodes news. + * TODO: Remove the news dialog on next major feature release. + */ + function showApiNodesNewsDialog() { + if (localStorage.getItem('api-nodes-news-seen') === 'true') { + return + } + + return dialogStore.showDialog({ + key: 'api-nodes-news', + component: ApiNodesNewsContent, + props: { + onClose: () => { + dialogStore.closeDialog({ key: 'api-nodes-news' }) + localStorage.setItem('api-nodes-news-seen', 'true') + } + }, + dialogComponentProps: { + modal: false, + position: 'bottomright' + } + }) + } + return { showLoadWorkflowWarning, showMissingModelsWarning, @@ -394,6 +420,7 @@ export const useDialogService = () => { showSignInDialog, showTopUpCreditsDialog, showUpdatePasswordDialog, + showApiNodesNewsDialog, prompt, confirm } diff --git a/src/views/GraphView.vue b/src/views/GraphView.vue index 00265910e..322b523ea 100644 --- a/src/views/GraphView.vue +++ b/src/views/GraphView.vue @@ -42,6 +42,7 @@ import { StatusWsMessageStatus } from '@/schemas/apiSchema' import { api } from '@/scripts/api' import { app } from '@/scripts/app' import { setupAutoQueueHandler } from '@/services/autoQueueService' +import { useDialogService } from '@/services/dialogService' import { useKeybindingService } from '@/services/keybindingService' import { useCommandStore } from '@/stores/commandStore' import { useExecutionStore } from '@/stores/executionStore' @@ -241,6 +242,8 @@ const onGraphReady = () => { // Explicitly initialize nodeSearchService to avoid indexing delay when // node search is triggered useNodeDefStore().nodeSearchService.searchNode('') + + useDialogService().showApiNodesNewsDialog() }, { timeout: 1000 } )