From d7654baebf198af538d1fe7be08627757ca9dc20 Mon Sep 17 00:00:00 2001 From: Jin Yi Date: Fri, 30 Jan 2026 09:16:28 +0900 Subject: [PATCH] [feat] Show context-appropriate empty state messages in Manager tabs (#8415) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ## Summary Shows tab-specific empty state messages in Node Manager instead of generic "No search results found" message. ## Changes - Added computed properties to determine empty state messages based on current tab and search state - Display tab-specific messages when a tab is empty without active search (e.g., "No Missing Nodes" for Missing tab) - Fall back to search-related messages only when there's an active search query - Added Korean translations for empty state messages | Tab | Empty State Title | |-----|-------------------| | All Installed | No Extensions Installed | | Update Available | All Up to Date | | Conflicting | No Conflicts Detected | | Workflow | No Extensions in Workflow | | Missing | No Missing Nodes | ## Review Focus - Verify i18n key structure matches existing patterns ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-8415-feat-Show-context-appropriate-empty-state-messages-in-Manager-tabs-2f76d73d3650817ab8a0d41b45df3411) by [Unito](https://www.unito.io) --- src/locales/en/main.json | 22 +++++++++ src/locales/ko/main.json | 22 +++++++++ .../components/manager/ManagerDialog.vue | 46 +++++++++++++++---- 3 files changed, 80 insertions(+), 10 deletions(-) diff --git a/src/locales/en/main.json b/src/locales/en/main.json index 25214e179..17f4b8268 100644 --- a/src/locales/en/main.json +++ b/src/locales/en/main.json @@ -343,6 +343,28 @@ "errorConnecting": "Error connecting to the Comfy Node Registry.", "noResultsFound": "No results found matching your search.", "tryDifferentSearch": "Please try a different search query.", + "emptyState": { + "allInstalled": { + "title": "No Extensions Installed", + "message": "You haven't installed any extensions yet." + }, + "updateAvailable": { + "title": "All Up to Date", + "message": "All your extensions are up to date." + }, + "conflicting": { + "title": "No Conflicts Detected", + "message": "All your extensions are compatible." + }, + "workflow": { + "title": "No Extensions in Workflow", + "message": "This workflow doesn't use any extension nodes." + }, + "missing": { + "title": "No Missing Nodes", + "message": "All required nodes are installed." + } + }, "tryAgainLater": "Please try again later.", "gettingInfo": "Getting info...", "nodePack": "Node Pack", diff --git a/src/locales/ko/main.json b/src/locales/ko/main.json index f94f93146..b1e83aea8 100644 --- a/src/locales/ko/main.json +++ b/src/locales/ko/main.json @@ -1302,6 +1302,28 @@ "discoverCommunityContent": "커뮤니티에서 만든 노드 팩 및 확장 프로그램을 찾아보세요...", "downloads": "다운로드", "enablePackToChangeVersion": "버전을 변경하려면 이 팩을 활성화하세요", + "emptyState": { + "allInstalled": { + "title": "설치된 확장 프로그램 없음", + "message": "아직 설치한 확장 프로그램이 없습니다." + }, + "conflicting": { + "title": "충돌 없음", + "message": "모든 확장 프로그램이 호환됩니다." + }, + "missing": { + "title": "누락된 노드 없음", + "message": "필요한 모든 노드가 설치되어 있습니다." + }, + "updateAvailable": { + "title": "모두 최신 상태", + "message": "모든 확장 프로그램이 최신 버전입니다." + }, + "workflow": { + "title": "워크플로에 확장 프로그램 없음", + "message": "이 워크플로는 확장 노드를 사용하지 않습니다." + } + }, "errorConnecting": "Comfy Node Registry에 연결하는 중 오류가 발생했습니다.", "extensionsSuccessfullyInstalled": "확장이 성공적으로 설치되어 사용할 준비가 되었습니다!", "failed": "실패 ({count})", diff --git a/src/workbench/extensions/manager/components/manager/ManagerDialog.vue b/src/workbench/extensions/manager/components/manager/ManagerDialog.vue index 97f41da56..3800af058 100644 --- a/src/workbench/extensions/manager/components/manager/ManagerDialog.vue +++ b/src/workbench/extensions/manager/components/manager/ManagerDialog.vue @@ -130,16 +130,8 @@
selectedTab.value?.id === ManagerTab.Missing ) +// Map of tab IDs to their empty state i18n key suffixes +const tabEmptyStateKeys: Partial> = { + [ManagerTab.AllInstalled]: 'allInstalled', + [ManagerTab.UpdateAvailable]: 'updateAvailable', + [ManagerTab.Conflicting]: 'conflicting', + [ManagerTab.Workflow]: 'workflow', + [ManagerTab.Missing]: 'missing' +} + +// Empty state messages based on current tab and search state +const emptyStateTitle = computed(() => { + if (comfyManagerStore.error) return t('manager.errorConnecting') + if (searchQuery.value) return t('manager.noResultsFound') + + const tabId = selectedTab.value?.id as ManagerTab | undefined + const emptyStateKey = tabId ? tabEmptyStateKeys[tabId] : undefined + + return emptyStateKey + ? t(`manager.emptyState.${emptyStateKey}.title`) + : t('manager.noResultsFound') +}) + +const emptyStateMessage = computed(() => { + if (comfyManagerStore.error) return t('manager.tryAgainLater') + if (searchQuery.value) return t('manager.tryDifferentSearch') + + const tabId = selectedTab.value?.id as ManagerTab | undefined + const emptyStateKey = tabId ? tabEmptyStateKeys[tabId] : undefined + + return emptyStateKey + ? t(`manager.emptyState.${emptyStateKey}.message`) + : t('manager.tryDifferentSearch') +}) + const onClickWarningLink = () => { window.open( buildDocsUrl('/troubleshooting/custom-node-issues', {