+
@@ -98,12 +101,13 @@ onUnmounted(() => {
diff --git a/src/components/card/CardBottom.vue b/src/components/card/CardBottom.vue
index 7f35754e6c..4a0ae10475 100644
--- a/src/components/card/CardBottom.vue
+++ b/src/components/card/CardBottom.vue
@@ -1,7 +1,19 @@
-
+
+
+
+
+
+
+
+ {{
+ $t('sideToolbar.templates', 'Templates')
+ }}
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/components/dialog/content/LoadWorkflowWarning.vue b/src/components/dialog/content/LoadWorkflowWarning.vue
index a89c94981e..17c38c29b6 100644
--- a/src/components/dialog/content/LoadWorkflowWarning.vue
+++ b/src/components/dialog/content/LoadWorkflowWarning.vue
@@ -58,11 +58,11 @@ import { useI18n } from 'vue-i18n'
import NoResultsPlaceholder from '@/components/common/NoResultsPlaceholder.vue'
import MissingCoreNodesMessage from '@/components/dialog/content/MissingCoreNodesMessage.vue'
-import { useMissingNodes } from '@/composables/nodePack/useMissingNodes'
import { useToastStore } from '@/platform/updates/common/toastStore'
import { useDialogStore } from '@/stores/dialogStore'
import type { MissingNodeType } from '@/types/comfy'
import PackInstallButton from '@/workbench/extensions/manager/components/manager/button/PackInstallButton.vue'
+import { useMissingNodes } from '@/workbench/extensions/manager/composables/nodePack/useMissingNodes'
import { useManagerState } from '@/workbench/extensions/manager/composables/useManagerState'
import { useComfyManagerStore } from '@/workbench/extensions/manager/stores/comfyManagerStore'
import { ManagerTab } from '@/workbench/extensions/manager/types/comfyManagerTypes'
diff --git a/src/components/dialog/content/setting/SettingItem.spec.ts b/src/components/dialog/content/setting/SettingItem.test.ts
similarity index 100%
rename from src/components/dialog/content/setting/SettingItem.spec.ts
rename to src/components/dialog/content/setting/SettingItem.test.ts
diff --git a/src/components/dialog/content/setting/UsageLogsTable.spec.ts b/src/components/dialog/content/setting/UsageLogsTable.test.ts
similarity index 100%
rename from src/components/dialog/content/setting/UsageLogsTable.spec.ts
rename to src/components/dialog/content/setting/UsageLogsTable.test.ts
diff --git a/src/components/dialog/content/signin/SignInForm.spec.ts b/src/components/dialog/content/signin/SignInForm.test.ts
similarity index 100%
rename from src/components/dialog/content/signin/SignInForm.spec.ts
rename to src/components/dialog/content/signin/SignInForm.test.ts
diff --git a/src/components/graph/GraphCanvas.vue b/src/components/graph/GraphCanvas.vue
index ac33aa2804..260f4b9b65 100644
--- a/src/components/graph/GraphCanvas.vue
+++ b/src/components/graph/GraphCanvas.vue
@@ -62,6 +62,7 @@
@@ -68,7 +68,7 @@ import { useExtensionService } from '@/services/extensionService'
import { type ComfyCommandImpl, useCommandStore } from '@/stores/commandStore'
import FrameNodes from './selectionToolbox/FrameNodes.vue'
-import MoreOptions from './selectionToolbox/MoreOptions.vue'
+import NodeOptionsButton from './selectionToolbox/NodeOptionsButton.vue'
import VerticalDivider from './selectionToolbox/VerticalDivider.vue'
const commandStore = useCommandStore()
diff --git a/src/components/graph/selectionToolbox/BypassButton.spec.ts b/src/components/graph/selectionToolbox/BypassButton.test.ts
similarity index 100%
rename from src/components/graph/selectionToolbox/BypassButton.spec.ts
rename to src/components/graph/selectionToolbox/BypassButton.test.ts
diff --git a/src/components/graph/selectionToolbox/ColorPickerButton.spec.ts b/src/components/graph/selectionToolbox/ColorPickerButton.test.ts
similarity index 100%
rename from src/components/graph/selectionToolbox/ColorPickerButton.spec.ts
rename to src/components/graph/selectionToolbox/ColorPickerButton.test.ts
diff --git a/src/components/graph/selectionToolbox/ExecuteButton.spec.ts b/src/components/graph/selectionToolbox/ExecuteButton.test.ts
similarity index 100%
rename from src/components/graph/selectionToolbox/ExecuteButton.spec.ts
rename to src/components/graph/selectionToolbox/ExecuteButton.test.ts
diff --git a/src/components/graph/selectionToolbox/InfoButton.spec.ts b/src/components/graph/selectionToolbox/InfoButton.test.ts
similarity index 100%
rename from src/components/graph/selectionToolbox/InfoButton.spec.ts
rename to src/components/graph/selectionToolbox/InfoButton.test.ts
diff --git a/src/components/graph/selectionToolbox/MoreOptions.vue b/src/components/graph/selectionToolbox/NodeOptions.vue
similarity index 82%
rename from src/components/graph/selectionToolbox/MoreOptions.vue
rename to src/components/graph/selectionToolbox/NodeOptions.vue
index f40a49b603..beda4e6ed7 100644
--- a/src/components/graph/selectionToolbox/MoreOptions.vue
+++ b/src/components/graph/selectionToolbox/NodeOptions.vue
@@ -1,20 +1,5 @@
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ pageTitle }}
+
+
+
+
+
+
+
+
+ + {{ $t('templateWorkflows.noResults', 'No templates found') }} +
++ {{ + $t( + 'templateWorkflows.noResultsHint', + 'Try adjusting your search or filters' + ) + }} +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + {{ + getTemplateTitle( + template, + getEffectiveSourceModule(template) + ) + }} +
+
+
+
+
+ + {{ getTemplateDescription(template) }} +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ $t('templateWorkflows.loadingMore', 'Loading more...') }}
+
+
+ {{
+ $t('templateWorkflows.resultsCount', {
+ count: filteredCount,
+ total: totalCount
+ })
+ }}
+
+
+
-
-
+
diff --git a/src/components/graph/selectionToolbox/NodeOptionsButton.vue b/src/components/graph/selectionToolbox/NodeOptionsButton.vue
new file mode 100644
index 0000000000..5fb5425043
--- /dev/null
+++ b/src/components/graph/selectionToolbox/NodeOptionsButton.vue
@@ -0,0 +1,33 @@
+
+
+
+
+
diff --git a/src/components/graph/widgets/ChatHistoryWidget.spec.ts b/src/components/graph/widgets/ChatHistoryWidget.test.ts
similarity index 100%
rename from src/components/graph/widgets/ChatHistoryWidget.spec.ts
rename to src/components/graph/widgets/ChatHistoryWidget.test.ts
diff --git a/src/components/helpcenter/HelpCenterMenuContent.vue b/src/components/helpcenter/HelpCenterMenuContent.vue
index aef8ff751a..708d9f9056 100644
--- a/src/components/helpcenter/HelpCenterMenuContent.vue
+++ b/src/components/helpcenter/HelpCenterMenuContent.vue
@@ -141,13 +141,13 @@ import {
import { useI18n } from 'vue-i18n'
import PuzzleIcon from '@/components/icons/PuzzleIcon.vue'
-import { useConflictAcknowledgment } from '@/composables/useConflictAcknowledgment'
import { useSettingStore } from '@/platform/settings/settingStore'
import type { ReleaseNote } from '@/platform/updates/common/releaseService'
import { useReleaseStore } from '@/platform/updates/common/releaseStore'
import { useCommandStore } from '@/stores/commandStore'
import { electronAPI, isElectron } from '@/utils/envUtil'
import { formatVersionAnchor } from '@/utils/formatUtil'
+import { useConflictAcknowledgment } from '@/workbench/extensions/manager/composables/useConflictAcknowledgment'
import { useManagerState } from '@/workbench/extensions/manager/composables/useManagerState'
import { ManagerTab } from '@/workbench/extensions/manager/types/comfyManagerTypes'
@@ -168,7 +168,8 @@ const EXTERNAL_LINKS = {
DOCS: 'https://docs.comfy.org/',
DISCORD: 'https://www.comfy.org/discord',
GITHUB: 'https://github.com/comfyanonymous/ComfyUI',
- DESKTOP_GUIDE: 'https://comfyorg.notion.site/',
+ DESKTOP_GUIDE_WINDOWS: 'https://docs.comfy.org/installation/desktop/windows',
+ DESKTOP_GUIDE_MACOS: 'https://docs.comfy.org/installation/desktop/macos',
UPDATE_GUIDE: 'https://docs.comfy.org/installation/update_comfyui'
} as const
@@ -222,7 +223,11 @@ const moreItems = computed(() => {
label: t('helpCenter.desktopUserGuide'),
visible: isElectron(),
action: () => {
- openExternalLink(EXTERNAL_LINKS.DESKTOP_GUIDE)
+ const docsUrl =
+ electronAPI().getPlatform() === 'darwin'
+ ? EXTERNAL_LINKS.DESKTOP_GUIDE_MACOS
+ : EXTERNAL_LINKS.DESKTOP_GUIDE_WINDOWS
+ openExternalLink(docsUrl)
emit('close')
}
},
diff --git a/src/components/input/MultiSelect.vue b/src/components/input/MultiSelect.vue
index d687c583b9..28111ff6ea 100644
--- a/src/components/input/MultiSelect.vue
+++ b/src/components/input/MultiSelect.vue
@@ -9,7 +9,7 @@
-->
-
-
diff --git a/src/components/install/HardwareOption.stories.ts b/src/components/install/HardwareOption.stories.ts
new file mode 100644
index 0000000000..d830af49fa
--- /dev/null
+++ b/src/components/install/HardwareOption.stories.ts
@@ -0,0 +1,73 @@
+// eslint-disable-next-line storybook/no-renderer-packages
+import type { Meta, StoryObj } from '@storybook/vue3'
+
+import HardwareOption from './HardwareOption.vue'
+
+const meta: Meta = {
+ title: 'Desktop/Components/HardwareOption',
+ component: HardwareOption,
+ parameters: {
+ layout: 'centered',
+ backgrounds: {
+ default: 'dark',
+ values: [{ name: 'dark', value: '#1a1a1a' }]
+ }
+ },
+ argTypes: {
+ selected: { control: 'boolean' },
+ imagePath: { control: 'text' },
+ placeholderText: { control: 'text' },
+ subtitle: { control: 'text' }
+ }
+}
+
+export default meta
+type Story = StoryObj
+
+export const AppleMetalSelected: Story = {
+ args: {
+ imagePath: '/assets/images/apple-mps-logo.png',
+ placeholderText: 'Apple Metal',
+ subtitle: 'Apple Metal',
+ value: 'mps',
+ selected: true
+ }
+}
+
+export const AppleMetalUnselected: Story = {
+ args: {
+ imagePath: '/assets/images/apple-mps-logo.png',
+ placeholderText: 'Apple Metal',
+ subtitle: 'Apple Metal',
+ value: 'mps',
+ selected: false
+ }
+}
+
+export const CPUOption: Story = {
+ args: {
+ placeholderText: 'CPU',
+ subtitle: 'Subtitle',
+ value: 'cpu',
+ selected: false
+ }
+}
+
+export const ManualInstall: Story = {
+ args: {
+ placeholderText: 'Manual Install',
+ subtitle: 'Subtitle',
+ value: 'unsupported',
+ selected: false
+ }
+}
+
+export const NvidiaSelected: Story = {
+ args: {
+ imagePath: '/assets/images/nvidia-logo-square.jpg',
+ placeholderText: 'NVIDIA',
+ subtitle: 'NVIDIA',
+ value: 'nvidia',
+ selected: true
+ }
+}
diff --git a/src/components/install/HardwareOption.vue b/src/components/install/HardwareOption.vue
new file mode 100644
index 0000000000..ae254fd8f3
--- /dev/null
+++ b/src/components/install/HardwareOption.vue
@@ -0,0 +1,55 @@
+
+ = {
+ title: 'Desktop/Components/InstallLocationPicker',
+ component: InstallLocationPicker,
+ parameters: {
+ layout: 'padded',
+ backgrounds: {
+ default: 'dark',
+ values: [
+ { name: 'dark', value: '#0a0a0a' },
+ { name: 'neutral-900', value: '#171717' },
+ { name: 'neutral-950', value: '#0a0a0a' }
+ ]
+ }
+ },
+ decorators: [
+ () => {
+ // Mock electron API
+ ;(window as any).electronAPI = {
+ getSystemPaths: () =>
+ Promise.resolve({
+ defaultInstallPath: '/Users/username/ComfyUI'
+ }),
+ validateInstallPath: () =>
+ Promise.resolve({
+ isValid: true,
+ exists: false,
+ canWrite: true,
+ freeSpace: 100000000000,
+ requiredSpace: 10000000000,
+ isNonDefaultDrive: false
+ }),
+ validateComfyUISource: () =>
+ Promise.resolve({
+ isValid: true
+ }),
+ showDirectoryPicker: () => Promise.resolve('/Users/username/ComfyUI')
+ }
+ return { template: '
+
+// Default story with accordion expanded
+export const Default: Story = {
+ render: (args) => ({
+ components: { InstallLocationPicker },
+ setup() {
+ const installPath = ref('/Users/username/ComfyUI')
+ const pathError = ref('')
+ const migrationSourcePath = ref('/Users/username/ComfyUI-old')
+ const migrationItemIds = ref(['models', 'custom_nodes'])
+
+ return {
+ args,
+ installPath,
+ pathError,
+ migrationSourcePath,
+ migrationItemIds
+ }
+ },
+ template: `
+ (['models', 'custom_nodes'])
+
+ return {
+ args,
+ installPath,
+ pathError,
+ migrationSourcePath,
+ migrationItemIds
+ }
+ },
+ template: `
+ (['models', 'custom_nodes'])
+
+ return {
+ args,
+ installPath,
+ pathError,
+ migrationSourcePath,
+ migrationItemIds
+ }
+ },
+ template: `
+
+
+
+
+
+
+
diff --git a/src/components/install/InstallFooter.vue b/src/components/install/InstallFooter.vue
new file mode 100644
index 0000000000..ef9ab698c9
--- /dev/null
+++ b/src/components/install/InstallFooter.vue
@@ -0,0 +1,79 @@
+
+
+
+
+
+
+
+
+
+ {{ $t('install.gpu') }}
+
+
+ {{ $t('install.installLocation') }}
+
+
+ {{ $t('install.desktopSettings') }}
+
+
+
+
+
+
+
+
+
diff --git a/src/components/install/InstallLocationPicker.stories.ts b/src/components/install/InstallLocationPicker.stories.ts
new file mode 100644
index 0000000000..e6ef924ae0
--- /dev/null
+++ b/src/components/install/InstallLocationPicker.stories.ts
@@ -0,0 +1,148 @@
+// eslint-disable-next-line storybook/no-renderer-packages
+import type { Meta, StoryObj } from '@storybook/vue3'
+import { ref } from 'vue'
+
+import InstallLocationPicker from './InstallLocationPicker.vue'
+
+const meta: Meta
+
+ `
+ })
+}
+
+// Story with different background to test transparency
+export const OnNeutral900: Story = {
+ render: (args) => ({
+ components: { InstallLocationPicker },
+ setup() {
+ const installPath = ref('/Users/username/ComfyUI')
+ const pathError = ref('')
+ const migrationSourcePath = ref('/Users/username/ComfyUI-old')
+ const migrationItemIds = ref
+
+ `
+ })
+}
+
+// Story with debug overlay showing background colors
+export const DebugBackgrounds: Story = {
+ render: (args) => ({
+ components: { InstallLocationPicker },
+ setup() {
+ const installPath = ref('/Users/username/ComfyUI')
+ const pathError = ref('')
+ const migrationSourcePath = ref('/Users/username/ComfyUI-old')
+ const migrationItemIds = ref
+
+ `
+ })
+}
diff --git a/src/components/install/InstallLocationPicker.vue b/src/components/install/InstallLocationPicker.vue
index 33b32a5f98..0e22f34a96 100644
--- a/src/components/install/InstallLocationPicker.vue
+++ b/src/components/install/InstallLocationPicker.vue
@@ -1,103 +1,215 @@
-
+
+ Parent bg: neutral-950 (#0a0a0a)
+ Accordion content: bg-transparent
+ Migration options: bg-transparent + p-4 rounded-lg
+
+
-
-
- {{ $t('install.chooseInstallationLocation') }}
+
- {{ $t('install.chooseInstallationLocation') }}
+
+
+ {{ $t('install.locationPicker.title') }}
-
- {{ $t('install.installLocationDescription') }}
+
+ {{ $t('install.locationPicker.subtitle') }}
-
-
-
-
+
+
+
- {{ pathError }}
-
-
- {{ $t('install.pathExists') }}
-
-
- {{ $t('install.nonDefaultDrive') }}
-
-
-
-
-
-
- {{ $t('install.systemLocations') }}
-
-
-
-
- App Data:
- {{ appData }}
-
-
-
-
- App Path:
- {{ appPath }}
-
-
+
+
+
+ {{ pathError }}
+
+
+ {{ $t('install.pathExists') }}
+
+
+ {{ $t('install.nonDefaultDrive') }}
+
+
+
+
+
+
+ {{ $t('install.locationPicker.migrateFromExisting') }}
+
+
+
+
+
+
+
+ {{ $t('install.locationPicker.chooseDownloadServers') }}
+
+
+
+
+
+
+
+
diff --git a/src/components/install/MigrationPicker.stories.ts b/src/components/install/MigrationPicker.stories.ts
new file mode 100644
index 0000000000..ad09e1871b
--- /dev/null
+++ b/src/components/install/MigrationPicker.stories.ts
@@ -0,0 +1,45 @@
+// eslint-disable-next-line storybook/no-renderer-packages
+import type { Meta, StoryObj } from '@storybook/vue3'
+import { ref } from 'vue'
+
+import MigrationPicker from './MigrationPicker.vue'
+
+const meta: Meta = {
+ title: 'Desktop/Components/MigrationPicker',
+ component: MigrationPicker,
+ parameters: {
+ backgrounds: {
+ default: 'dark',
+ values: [
+ { name: 'dark', value: '#0a0a0a' },
+ { name: 'neutral-900', value: '#171717' }
+ ]
+ }
+ },
+ decorators: [
+ () => {
+ ;(window as any).electronAPI = {
+ validateComfyUISource: () => Promise.resolve({ isValid: true }),
+ showDirectoryPicker: () => Promise.resolve('/Users/username/ComfyUI')
+ }
+
+ return { template: '
+
+export const Default: Story = {
+ render: () => ({
+ components: { MigrationPicker },
+ setup() {
+ const sourcePath = ref('')
+ const migrationItemIds = ref([])
+ return { sourcePath, migrationItemIds }
+ },
+ template:
+ '
- {{ $t('install.migrateFromExistingInstallation') }}
-
-
{{ $t('install.migrationSourcePathDescription') }}
@@ -13,7 +9,7 @@
-
+
{{ $t('install.selectItemsToMigrate') }}
diff --git a/src/components/install/MirrorsConfiguration.vue b/src/components/install/MirrorsConfiguration.vue
deleted file mode 100644
index c4c3565d69..0000000000
--- a/src/components/install/MirrorsConfiguration.vue
+++ /dev/null
@@ -1,121 +0,0 @@
-
-
-
-
-
-
-
diff --git a/src/components/install/mirror/MirrorItem.vue b/src/components/install/mirror/MirrorItem.vue
index a4c5b563c4..3665d66c9f 100644
--- a/src/components/install/mirror/MirrorItem.vue
+++ b/src/components/install/mirror/MirrorItem.vue
@@ -1,10 +1,10 @@
-
-
-
+
+
+
{{ $t(`settings.${normalizedSettingId}.name`) }}
-
+
{{ $t(`settings.${normalizedSettingId}.tooltip`) }}
@@ -16,18 +16,61 @@
"
@state-change="validationState = $event"
/>
+
+
+ {{ $t('g.learnMore') }}
+
+
+
+
diff --git a/src/components/templates/TemplateWorkflowCard.spec.ts b/src/components/templates/TemplateWorkflowCard.spec.ts
deleted file mode 100644
index 733b723d6c..0000000000
--- a/src/components/templates/TemplateWorkflowCard.spec.ts
+++ /dev/null
@@ -1,273 +0,0 @@
-import { mount } from '@vue/test-utils'
-import { describe, expect, it, vi } from 'vitest'
-import { ref } from 'vue'
-
-import TemplateWorkflowCard from '@/components/templates/TemplateWorkflowCard.vue'
-import type { TemplateInfo } from '@/platform/workflow/templates/types/template'
-
-vi.mock('@/components/templates/thumbnails/AudioThumbnail.vue', () => ({
- default: {
- name: 'AudioThumbnail',
- template: '',
- props: ['src']
- }
-}))
-
-vi.mock('@/components/templates/thumbnails/CompareSliderThumbnail.vue', () => ({
- default: {
- name: 'CompareSliderThumbnail',
- template:
- '',
- props: ['baseImageSrc', 'overlayImageSrc', 'alt', 'isHovered']
- }
-}))
-
-vi.mock('@/components/templates/thumbnails/DefaultThumbnail.vue', () => ({
- default: {
- name: 'DefaultThumbnail',
- template: '',
- props: ['src', 'alt', 'isHovered', 'isVideo', 'hoverZoom']
- }
-}))
-
-vi.mock('@/components/templates/thumbnails/HoverDissolveThumbnail.vue', () => ({
- default: {
- name: 'HoverDissolveThumbnail',
- template:
- '',
- props: ['baseImageSrc', 'overlayImageSrc', 'alt', 'isHovered']
- }
-}))
-
-vi.mock('@vueuse/core', () => ({
- useElementHover: () => ref(false)
-}))
-
-vi.mock('@/scripts/api', () => ({
- api: {
- fileURL: (path: string) => `/fileURL${path}`,
- apiURL: (path: string) => `/apiURL${path}`,
- addEventListener: vi.fn(),
- removeEventListener: vi.fn()
- }
-}))
-
-vi.mock('@/scripts/app', () => ({
- app: {
- loadGraphData: vi.fn()
- }
-}))
-
-vi.mock('@/stores/dialogStore', () => ({
- useDialogStore: () => ({
- closeDialog: vi.fn()
- })
-}))
-
-vi.mock(
- '@/platform/workflow/templates/repositories/workflowTemplatesStore',
- () => ({
- useWorkflowTemplatesStore: () => ({
- isLoaded: true,
- loadWorkflowTemplates: vi.fn().mockResolvedValue(true),
- groupedTemplates: []
- })
- })
-)
-
-vi.mock('vue-i18n', () => ({
- useI18n: () => ({
- t: (key: string, fallback: string) => fallback || key
- })
-}))
-
-vi.mock(
- '@/platform/workflow/templates/composables/useTemplateWorkflows',
- () => ({
- useTemplateWorkflows: () => ({
- getTemplateThumbnailUrl: (
- template: TemplateInfo,
- sourceModule: string,
- index = ''
- ) => {
- const basePath =
- sourceModule === 'default'
- ? `/fileURL/templates/${template.name}`
- : `/apiURL/workflow_templates/${sourceModule}/${template.name}`
- const indexSuffix =
- sourceModule === 'default' && index ? `-${index}` : ''
- return `${basePath}${indexSuffix}.${template.mediaSubtype}`
- },
- getTemplateTitle: (template: TemplateInfo, sourceModule: string) => {
- const fallback =
- template.title ?? template.name ?? `${sourceModule} Template`
- return sourceModule === 'default'
- ? template.localizedTitle ?? fallback
- : fallback
- },
- getTemplateDescription: (
- template: TemplateInfo,
- sourceModule: string
- ) => {
- return sourceModule === 'default'
- ? template.localizedDescription ?? ''
- : template.description?.replace(/[-_]/g, ' ').trim() ?? ''
- },
- loadWorkflowTemplate: vi.fn()
- })
- })
-)
-
-describe('TemplateWorkflowCard', () => {
- const createTemplate = (overrides = {}): TemplateInfo => ({
- name: 'test-template',
- mediaType: 'image',
- mediaSubtype: 'png',
- thumbnailVariant: 'default',
- description: 'Test description',
- ...overrides
- })
-
- const mountCard = (props = {}) => {
- return mount(TemplateWorkflowCard, {
- props: {
- sourceModule: 'default',
- categoryTitle: 'Test Category',
- loading: false,
- template: createTemplate(),
- ...props
- },
- global: {
- stubs: {
- Card: {
- template:
- '
-
-
-
-
-
- {{ title }}
-
-
- {{ description }}
-
-
-
-
-
-
-
-
diff --git a/src/components/templates/TemplateWorkflowCardSkeleton.vue b/src/components/templates/TemplateWorkflowCardSkeleton.vue
deleted file mode 100644
index 00bf738398..0000000000
--- a/src/components/templates/TemplateWorkflowCardSkeleton.vue
+++ /dev/null
@@ -1,30 +0,0 @@
-
-
-
-
-
-
-
-
-
diff --git a/src/components/templates/TemplateWorkflowList.vue b/src/components/templates/TemplateWorkflowList.vue
deleted file mode 100644
index b6ac99c5ed..0000000000
--- a/src/components/templates/TemplateWorkflowList.vue
+++ /dev/null
@@ -1,68 +0,0 @@
-
-
-
-
- {{ slotProps.data.title }}
-
-
-
-
-
- {{ slotProps.data.description }}
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/src/components/templates/TemplateWorkflowView.spec.ts b/src/components/templates/TemplateWorkflowView.spec.ts
deleted file mode 100644
index d9633a7e09..0000000000
--- a/src/components/templates/TemplateWorkflowView.spec.ts
+++ /dev/null
@@ -1,185 +0,0 @@
-import { mount } from '@vue/test-utils'
-import { describe, expect, it, vi } from 'vitest'
-import { createI18n } from 'vue-i18n'
-
-import TemplateWorkflowView from '@/components/templates/TemplateWorkflowView.vue'
-import type { TemplateInfo } from '@/platform/workflow/templates/types/template'
-
-vi.mock('primevue/dataview', () => ({
- default: {
- name: 'DataView',
- template: `
-
-
-
-
-
- {{ title }}
-
-
-
-
-
-
-
-
-
-
diff --git a/src/components/templates/TemplateWorkflowsContent.vue b/src/components/templates/TemplateWorkflowsContent.vue
deleted file mode 100644
index 38925b9e40..0000000000
--- a/src/components/templates/TemplateWorkflowsContent.vue
+++ /dev/null
@@ -1,112 +0,0 @@
-
-
-
-
- {{ $t('templateWorkflows.title') }}
-
-
-
diff --git a/src/components/templates/TemplateWorkflowsSideNav.vue b/src/components/templates/TemplateWorkflowsSideNav.vue
deleted file mode 100644
index 07ff87990e..0000000000
--- a/src/components/templates/TemplateWorkflowsSideNav.vue
+++ /dev/null
@@ -1,50 +0,0 @@
-
-
-
-
-
-
- {{ slotProps.option.label }}
-
-
-
-
-
-
-
-
diff --git a/src/components/templates/thumbnails/AudioThumbnail.spec.ts b/src/components/templates/thumbnails/AudioThumbnail.test.ts
similarity index 100%
rename from src/components/templates/thumbnails/AudioThumbnail.spec.ts
rename to src/components/templates/thumbnails/AudioThumbnail.test.ts
diff --git a/src/components/templates/thumbnails/AudioThumbnail.vue b/src/components/templates/thumbnails/AudioThumbnail.vue
index dda6e79a52..49333d93e2 100644
--- a/src/components/templates/thumbnails/AudioThumbnail.vue
+++ b/src/components/templates/thumbnails/AudioThumbnail.vue
@@ -1,6 +1,12 @@
-
+
diff --git a/src/components/templates/thumbnails/BaseThumbnail.spec.ts b/src/components/templates/thumbnails/BaseThumbnail.test.ts
similarity index 94%
rename from src/components/templates/thumbnails/BaseThumbnail.spec.ts
rename to src/components/templates/thumbnails/BaseThumbnail.test.ts
index cd0b44f535..ecb03df419 100644
--- a/src/components/templates/thumbnails/BaseThumbnail.spec.ts
+++ b/src/components/templates/thumbnails/BaseThumbnail.test.ts
@@ -51,8 +51,9 @@ describe('BaseThumbnail', () => {
vm.error = true
await nextTick()
- expect(wrapper.find('.pi-file').exists()).toBe(true)
- expect(wrapper.find('.transform-gpu').exists()).toBe(false)
+ expect(
+ wrapper.find('img[src="/assets/images/default-template.png"]').exists()
+ ).toBe(true)
})
it('applies transition classes to content', () => {
diff --git a/src/components/templates/thumbnails/BaseThumbnail.vue b/src/components/templates/thumbnails/BaseThumbnail.vue
index ee4c0f3a4d..62168a561b 100644
--- a/src/components/templates/thumbnails/BaseThumbnail.vue
+++ b/src/components/templates/thumbnails/BaseThumbnail.vue
@@ -1,5 +1,7 @@
-
+
-
+ 
diff --git a/src/components/templates/thumbnails/CompareSliderThumbnail.spec.ts b/src/components/templates/thumbnails/CompareSliderThumbnail.test.ts
similarity index 100%
rename from src/components/templates/thumbnails/CompareSliderThumbnail.spec.ts
rename to src/components/templates/thumbnails/CompareSliderThumbnail.test.ts
diff --git a/src/components/templates/thumbnails/DefaultThumbnail.spec.ts b/src/components/templates/thumbnails/DefaultThumbnail.test.ts
similarity index 100%
rename from src/components/templates/thumbnails/DefaultThumbnail.spec.ts
rename to src/components/templates/thumbnails/DefaultThumbnail.test.ts
diff --git a/src/components/templates/thumbnails/HoverDissolveThumbnail.spec.ts b/src/components/templates/thumbnails/HoverDissolveThumbnail.test.ts
similarity index 100%
rename from src/components/templates/thumbnails/HoverDissolveThumbnail.spec.ts
rename to src/components/templates/thumbnails/HoverDissolveThumbnail.test.ts
diff --git a/src/components/topbar/CommandMenubar.vue b/src/components/topbar/CommandMenubar.vue
index e9f33f8123..5d03d9c677 100644
--- a/src/components/topbar/CommandMenubar.vue
+++ b/src/components/topbar/CommandMenubar.vue
@@ -314,9 +314,19 @@ const hasActiveStateSiblings = (item: MenuItem): boolean => {
.comfy-command-menu ul {
background-color: var(--comfy-menu-secondary-bg) !important;
}
-
.comfy-command-menu-top .p-tieredmenu-submenu {
left: calc(100% + 15px) !important;
top: -4px !important;
}
+@media (max-height: 700px) {
+ .comfy-command-menu .p-tieredmenu-submenu {
+ @apply absolute max-h-[90vh] overflow-y-auto;
+ }
+ /* Help (last) submenu upward offset in compact mode */
+ .p-tieredmenu-root-list
+ > .p-tieredmenu-item:last-of-type
+ .p-tieredmenu-submenu {
+ top: -188px !important;
+ }
+}
diff --git a/src/components/topbar/CurrentUserButton.spec.ts b/src/components/topbar/CurrentUserButton.test.ts
similarity index 100%
rename from src/components/topbar/CurrentUserButton.spec.ts
rename to src/components/topbar/CurrentUserButton.test.ts
diff --git a/src/components/topbar/CurrentUserPopover.spec.ts b/src/components/topbar/CurrentUserPopover.test.ts
similarity index 100%
rename from src/components/topbar/CurrentUserPopover.spec.ts
rename to src/components/topbar/CurrentUserPopover.test.ts
diff --git a/src/components/widget/layout/BaseModalLayout.vue b/src/components/widget/layout/BaseModalLayout.vue
index c455f62eec..6c30d7ddea 100644
--- a/src/components/widget/layout/BaseModalLayout.vue
+++ b/src/components/widget/layout/BaseModalLayout.vue
@@ -127,7 +127,7 @@ const toggleRightPanel = () => {
const layoutClasses = cn(
'base-widget-layout',
'rounded-2xl overflow-hidden relative',
- 'bg-zinc-50 dark-theme:bg-zinc-800'
+ 'bg-gray-50 dark-theme:bg-gray-800'
)
const rightPanelButtonClasses = computed(() => {
@@ -144,7 +144,7 @@ const closeButtonClasses = cn(
const mainContainerClasses = cn(
'flex-1 flex',
- 'bg-zinc-100 dark-theme:bg-neutral-900'
+ 'bg-gray-100 dark-theme:bg-neutral-900'
)
const headerClasses = cn(
diff --git a/src/components/widget/nav/NavIcon.vue b/src/components/widget/nav/NavIcon.vue
index 653a6a70ed..bcc5c5a00d 100644
--- a/src/components/widget/nav/NavIcon.vue
+++ b/src/components/widget/nav/NavIcon.vue
@@ -1,5 +1,5 @@
-
+
diff --git a/src/components/widget/panel/LeftSidePanel.vue b/src/components/widget/panel/LeftSidePanel.vue
index 964753365d..b6d76b382e 100644
--- a/src/components/widget/panel/LeftSidePanel.vue
+++ b/src/components/widget/panel/LeftSidePanel.vue
@@ -1,5 +1,5 @@
-
+
-
+ {{ $t('install.locationPicker.title') }}
-- {{ $t('install.installLocationDescription') }} +
+ {{ $t('install.locationPicker.subtitle') }}
-
-
-
-
+
+
- {{ pathError }}
-
-
- {{ $t('install.pathExists') }}
-
-
- {{ $t('install.nonDefaultDrive') }}
-
-
-
-
-
+
-
-
+
+
diff --git a/src/components/install/MigrationPicker.stories.ts b/src/components/install/MigrationPicker.stories.ts
new file mode 100644
index 0000000000..ad09e1871b
--- /dev/null
+++ b/src/components/install/MigrationPicker.stories.ts
@@ -0,0 +1,45 @@
+// eslint-disable-next-line storybook/no-renderer-packages
+import type { Meta, StoryObj } from '@storybook/vue3'
+import { ref } from 'vue'
+
+import MigrationPicker from './MigrationPicker.vue'
+
+const meta: Meta- {{ $t('install.systemLocations') }} -
-
-
+
+
+ {{ $t('install.locationPicker.migrateFromExisting') }}
+
+
+
+
+
+
+
+ {{ $t('install.locationPicker.chooseDownloadServers') }}
+
+
+
+
+
+
-
- App Data:
- {{ appData }}
-
-
-
-
- App Path:
- {{ appPath }}
-
-
+
+
+
+ {{ pathError }}
+
+
+ {{ $t('install.pathExists') }}
+
+
+ {{ $t('install.nonDefaultDrive') }}
+
+
+
+
-
-
- {{ $t('install.migrateFromExistingInstallation') }} -
-{{ $t('install.migrationSourcePathDescription') }}
@@ -13,7 +9,7 @@
+
-
-
-
-
-
diff --git a/src/components/install/mirror/MirrorItem.vue b/src/components/install/mirror/MirrorItem.vue
index a4c5b563c4..3665d66c9f 100644
--- a/src/components/install/mirror/MirrorItem.vue
+++ b/src/components/install/mirror/MirrorItem.vue
@@ -1,10 +1,10 @@
-
{{ $t('install.selectItemsToMigrate') }}
diff --git a/src/components/install/MirrorsConfiguration.vue b/src/components/install/MirrorsConfiguration.vue deleted file mode 100644 index c4c3565d69..0000000000 --- a/src/components/install/MirrorsConfiguration.vue +++ /dev/null @@ -1,121 +0,0 @@ - -
-
-
+
+
+
+
{{ $t(`settings.${normalizedSettingId}.name`) }}
-
+
{{ $t(`settings.${normalizedSettingId}.tooltip`) }}
@@ -16,18 +16,61 @@
"
@state-change="validationState = $event"
/>
+
+
+ {{ $t('g.learnMore') }}
+
+
+
+
diff --git a/src/components/templates/TemplateWorkflowCard.spec.ts b/src/components/templates/TemplateWorkflowCard.spec.ts
deleted file mode 100644
index 733b723d6c..0000000000
--- a/src/components/templates/TemplateWorkflowCard.spec.ts
+++ /dev/null
@@ -1,273 +0,0 @@
-import { mount } from '@vue/test-utils'
-import { describe, expect, it, vi } from 'vitest'
-import { ref } from 'vue'
-
-import TemplateWorkflowCard from '@/components/templates/TemplateWorkflowCard.vue'
-import type { TemplateInfo } from '@/platform/workflow/templates/types/template'
-
-vi.mock('@/components/templates/thumbnails/AudioThumbnail.vue', () => ({
- default: {
- name: 'AudioThumbnail',
- template: '',
- props: ['src']
- }
-}))
-
-vi.mock('@/components/templates/thumbnails/CompareSliderThumbnail.vue', () => ({
- default: {
- name: 'CompareSliderThumbnail',
- template:
- '',
- props: ['baseImageSrc', 'overlayImageSrc', 'alt', 'isHovered']
- }
-}))
-
-vi.mock('@/components/templates/thumbnails/DefaultThumbnail.vue', () => ({
- default: {
- name: 'DefaultThumbnail',
- template: '',
- props: ['src', 'alt', 'isHovered', 'isVideo', 'hoverZoom']
- }
-}))
-
-vi.mock('@/components/templates/thumbnails/HoverDissolveThumbnail.vue', () => ({
- default: {
- name: 'HoverDissolveThumbnail',
- template:
- '',
- props: ['baseImageSrc', 'overlayImageSrc', 'alt', 'isHovered']
- }
-}))
-
-vi.mock('@vueuse/core', () => ({
- useElementHover: () => ref(false)
-}))
-
-vi.mock('@/scripts/api', () => ({
- api: {
- fileURL: (path: string) => `/fileURL${path}`,
- apiURL: (path: string) => `/apiURL${path}`,
- addEventListener: vi.fn(),
- removeEventListener: vi.fn()
- }
-}))
-
-vi.mock('@/scripts/app', () => ({
- app: {
- loadGraphData: vi.fn()
- }
-}))
-
-vi.mock('@/stores/dialogStore', () => ({
- useDialogStore: () => ({
- closeDialog: vi.fn()
- })
-}))
-
-vi.mock(
- '@/platform/workflow/templates/repositories/workflowTemplatesStore',
- () => ({
- useWorkflowTemplatesStore: () => ({
- isLoaded: true,
- loadWorkflowTemplates: vi.fn().mockResolvedValue(true),
- groupedTemplates: []
- })
- })
-)
-
-vi.mock('vue-i18n', () => ({
- useI18n: () => ({
- t: (key: string, fallback: string) => fallback || key
- })
-}))
-
-vi.mock(
- '@/platform/workflow/templates/composables/useTemplateWorkflows',
- () => ({
- useTemplateWorkflows: () => ({
- getTemplateThumbnailUrl: (
- template: TemplateInfo,
- sourceModule: string,
- index = ''
- ) => {
- const basePath =
- sourceModule === 'default'
- ? `/fileURL/templates/${template.name}`
- : `/apiURL/workflow_templates/${sourceModule}/${template.name}`
- const indexSuffix =
- sourceModule === 'default' && index ? `-${index}` : ''
- return `${basePath}${indexSuffix}.${template.mediaSubtype}`
- },
- getTemplateTitle: (template: TemplateInfo, sourceModule: string) => {
- const fallback =
- template.title ?? template.name ?? `${sourceModule} Template`
- return sourceModule === 'default'
- ? template.localizedTitle ?? fallback
- : fallback
- },
- getTemplateDescription: (
- template: TemplateInfo,
- sourceModule: string
- ) => {
- return sourceModule === 'default'
- ? template.localizedDescription ?? ''
- : template.description?.replace(/[-_]/g, ' ').trim() ?? ''
- },
- loadWorkflowTemplate: vi.fn()
- })
- })
-)
-
-describe('TemplateWorkflowCard', () => {
- const createTemplate = (overrides = {}): TemplateInfo => ({
- name: 'test-template',
- mediaType: 'image',
- mediaSubtype: 'png',
- thumbnailVariant: 'default',
- description: 'Test description',
- ...overrides
- })
-
- const mountCard = (props = {}) => {
- return mount(TemplateWorkflowCard, {
- props: {
- sourceModule: 'default',
- categoryTitle: 'Test Category',
- loading: false,
- template: createTemplate(),
- ...props
- },
- global: {
- stubs: {
- Card: {
- template:
- '
-
-
-
-
-
- {{ title }}
-
-
- {{ description }}
-
-
-
-
-
-
-
-
diff --git a/src/components/templates/TemplateWorkflowCardSkeleton.vue b/src/components/templates/TemplateWorkflowCardSkeleton.vue
deleted file mode 100644
index 00bf738398..0000000000
--- a/src/components/templates/TemplateWorkflowCardSkeleton.vue
+++ /dev/null
@@ -1,30 +0,0 @@
-
-
-
-
-
-
-
-
-
diff --git a/src/components/templates/TemplateWorkflowList.vue b/src/components/templates/TemplateWorkflowList.vue
deleted file mode 100644
index b6ac99c5ed..0000000000
--- a/src/components/templates/TemplateWorkflowList.vue
+++ /dev/null
@@ -1,68 +0,0 @@
-
-
-
-
- {{ slotProps.data.title }}
-
-
-
-
-
- {{ slotProps.data.description }}
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/src/components/templates/TemplateWorkflowView.spec.ts b/src/components/templates/TemplateWorkflowView.spec.ts
deleted file mode 100644
index d9633a7e09..0000000000
--- a/src/components/templates/TemplateWorkflowView.spec.ts
+++ /dev/null
@@ -1,185 +0,0 @@
-import { mount } from '@vue/test-utils'
-import { describe, expect, it, vi } from 'vitest'
-import { createI18n } from 'vue-i18n'
-
-import TemplateWorkflowView from '@/components/templates/TemplateWorkflowView.vue'
-import type { TemplateInfo } from '@/platform/workflow/templates/types/template'
-
-vi.mock('primevue/dataview', () => ({
- default: {
- name: 'DataView',
- template: `
-
-
-
-
-
- {{ title }}
-
-
-
-
-
-
-
-
-
-
diff --git a/src/components/templates/TemplateWorkflowsContent.vue b/src/components/templates/TemplateWorkflowsContent.vue
deleted file mode 100644
index 38925b9e40..0000000000
--- a/src/components/templates/TemplateWorkflowsContent.vue
+++ /dev/null
@@ -1,112 +0,0 @@
-
-
-
-
- {{ $t('templateWorkflows.title') }}
-
-
-
diff --git a/src/components/templates/TemplateWorkflowsSideNav.vue b/src/components/templates/TemplateWorkflowsSideNav.vue
deleted file mode 100644
index 07ff87990e..0000000000
--- a/src/components/templates/TemplateWorkflowsSideNav.vue
+++ /dev/null
@@ -1,50 +0,0 @@
-
-
-
-
-
-
- {{ slotProps.option.label }}
-
-
-
-
-
-
-
-
diff --git a/src/components/templates/thumbnails/AudioThumbnail.spec.ts b/src/components/templates/thumbnails/AudioThumbnail.test.ts
similarity index 100%
rename from src/components/templates/thumbnails/AudioThumbnail.spec.ts
rename to src/components/templates/thumbnails/AudioThumbnail.test.ts
diff --git a/src/components/templates/thumbnails/AudioThumbnail.vue b/src/components/templates/thumbnails/AudioThumbnail.vue
index dda6e79a52..49333d93e2 100644
--- a/src/components/templates/thumbnails/AudioThumbnail.vue
+++ b/src/components/templates/thumbnails/AudioThumbnail.vue
@@ -1,6 +1,12 @@
-
+
diff --git a/src/components/templates/thumbnails/BaseThumbnail.spec.ts b/src/components/templates/thumbnails/BaseThumbnail.test.ts
similarity index 94%
rename from src/components/templates/thumbnails/BaseThumbnail.spec.ts
rename to src/components/templates/thumbnails/BaseThumbnail.test.ts
index cd0b44f535..ecb03df419 100644
--- a/src/components/templates/thumbnails/BaseThumbnail.spec.ts
+++ b/src/components/templates/thumbnails/BaseThumbnail.test.ts
@@ -51,8 +51,9 @@ describe('BaseThumbnail', () => {
vm.error = true
await nextTick()
- expect(wrapper.find('.pi-file').exists()).toBe(true)
- expect(wrapper.find('.transform-gpu').exists()).toBe(false)
+ expect(
+ wrapper.find('img[src="/assets/images/default-template.png"]').exists()
+ ).toBe(true)
})
it('applies transition classes to content', () => {
diff --git a/src/components/templates/thumbnails/BaseThumbnail.vue b/src/components/templates/thumbnails/BaseThumbnail.vue
index ee4c0f3a4d..62168a561b 100644
--- a/src/components/templates/thumbnails/BaseThumbnail.vue
+++ b/src/components/templates/thumbnails/BaseThumbnail.vue
@@ -1,5 +1,7 @@
-
+
-
+
diff --git a/src/components/templates/thumbnails/CompareSliderThumbnail.spec.ts b/src/components/templates/thumbnails/CompareSliderThumbnail.test.ts
similarity index 100%
rename from src/components/templates/thumbnails/CompareSliderThumbnail.spec.ts
rename to src/components/templates/thumbnails/CompareSliderThumbnail.test.ts
diff --git a/src/components/templates/thumbnails/DefaultThumbnail.spec.ts b/src/components/templates/thumbnails/DefaultThumbnail.test.ts
similarity index 100%
rename from src/components/templates/thumbnails/DefaultThumbnail.spec.ts
rename to src/components/templates/thumbnails/DefaultThumbnail.test.ts
diff --git a/src/components/templates/thumbnails/HoverDissolveThumbnail.spec.ts b/src/components/templates/thumbnails/HoverDissolveThumbnail.test.ts
similarity index 100%
rename from src/components/templates/thumbnails/HoverDissolveThumbnail.spec.ts
rename to src/components/templates/thumbnails/HoverDissolveThumbnail.test.ts
diff --git a/src/components/topbar/CommandMenubar.vue b/src/components/topbar/CommandMenubar.vue
index e9f33f8123..5d03d9c677 100644
--- a/src/components/topbar/CommandMenubar.vue
+++ b/src/components/topbar/CommandMenubar.vue
@@ -314,9 +314,19 @@ const hasActiveStateSiblings = (item: MenuItem): boolean => {
.comfy-command-menu ul {
background-color: var(--comfy-menu-secondary-bg) !important;
}
-
.comfy-command-menu-top .p-tieredmenu-submenu {
left: calc(100% + 15px) !important;
top: -4px !important;
}
+@media (max-height: 700px) {
+ .comfy-command-menu .p-tieredmenu-submenu {
+ @apply absolute max-h-[90vh] overflow-y-auto;
+ }
+ /* Help (last) submenu upward offset in compact mode */
+ .p-tieredmenu-root-list
+ > .p-tieredmenu-item:last-of-type
+ .p-tieredmenu-submenu {
+ top: -188px !important;
+ }
+}
diff --git a/src/components/topbar/CurrentUserButton.spec.ts b/src/components/topbar/CurrentUserButton.test.ts
similarity index 100%
rename from src/components/topbar/CurrentUserButton.spec.ts
rename to src/components/topbar/CurrentUserButton.test.ts
diff --git a/src/components/topbar/CurrentUserPopover.spec.ts b/src/components/topbar/CurrentUserPopover.test.ts
similarity index 100%
rename from src/components/topbar/CurrentUserPopover.spec.ts
rename to src/components/topbar/CurrentUserPopover.test.ts
diff --git a/src/components/widget/layout/BaseModalLayout.vue b/src/components/widget/layout/BaseModalLayout.vue
index c455f62eec..6c30d7ddea 100644
--- a/src/components/widget/layout/BaseModalLayout.vue
+++ b/src/components/widget/layout/BaseModalLayout.vue
@@ -127,7 +127,7 @@ const toggleRightPanel = () => {
const layoutClasses = cn(
'base-widget-layout',
'rounded-2xl overflow-hidden relative',
- 'bg-zinc-50 dark-theme:bg-zinc-800'
+ 'bg-gray-50 dark-theme:bg-gray-800'
)
const rightPanelButtonClasses = computed(() => {
@@ -144,7 +144,7 @@ const closeButtonClasses = cn(
const mainContainerClasses = cn(
'flex-1 flex',
- 'bg-zinc-100 dark-theme:bg-neutral-900'
+ 'bg-gray-100 dark-theme:bg-neutral-900'
)
const headerClasses = cn(
diff --git a/src/components/widget/nav/NavIcon.vue b/src/components/widget/nav/NavIcon.vue
index 653a6a70ed..bcc5c5a00d 100644
--- a/src/components/widget/nav/NavIcon.vue
+++ b/src/components/widget/nav/NavIcon.vue
@@ -1,5 +1,5 @@
-
+
diff --git a/src/components/widget/panel/LeftSidePanel.vue b/src/components/widget/panel/LeftSidePanel.vue
index 964753365d..b6d76b382e 100644
--- a/src/components/widget/panel/LeftSidePanel.vue
+++ b/src/components/widget/panel/LeftSidePanel.vue
@@ -1,5 +1,5 @@
-
+
-
+
@@ -16,18 +16,61 @@
"
@state-change="validationState = $event"
/>
+ {{ $t(`settings.${normalizedSettingId}.name`) }}
-+
{{ $t(`settings.${normalizedSettingId}.tooltip`) }}
+
+ {{ $t('g.learnMore') }}
+
+
+
+
-
-
-
-
-
-
-
-
-
-
-
- - {{ title }} -
-- {{ description }} -
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- {{ title }}
-
-
-
-
-
-
-
-
- {{ t('templateWorkflows.loadingMore') }}
-
-
-
-
-
-
- - {{ $t('templateWorkflows.title') }} -
-
-
-
- - {{ slotProps.option.label }} -
-
+
diff --git a/src/components/templates/thumbnails/BaseThumbnail.spec.ts b/src/components/templates/thumbnails/BaseThumbnail.test.ts
similarity index 94%
rename from src/components/templates/thumbnails/BaseThumbnail.spec.ts
rename to src/components/templates/thumbnails/BaseThumbnail.test.ts
index cd0b44f535..ecb03df419 100644
--- a/src/components/templates/thumbnails/BaseThumbnail.spec.ts
+++ b/src/components/templates/thumbnails/BaseThumbnail.test.ts
@@ -51,8 +51,9 @@ describe('BaseThumbnail', () => {
vm.error = true
await nextTick()
- expect(wrapper.find('.pi-file').exists()).toBe(true)
- expect(wrapper.find('.transform-gpu').exists()).toBe(false)
+ expect(
+ wrapper.find('img[src="/assets/images/default-template.png"]').exists()
+ ).toBe(true)
})
it('applies transition classes to content', () => {
diff --git a/src/components/templates/thumbnails/BaseThumbnail.vue b/src/components/templates/thumbnails/BaseThumbnail.vue
index ee4c0f3a4d..62168a561b 100644
--- a/src/components/templates/thumbnails/BaseThumbnail.vue
+++ b/src/components/templates/thumbnails/BaseThumbnail.vue
@@ -1,5 +1,7 @@
-
+
diff --git a/src/components/templates/thumbnails/CompareSliderThumbnail.spec.ts b/src/components/templates/thumbnails/CompareSliderThumbnail.test.ts
similarity index 100%
rename from src/components/templates/thumbnails/CompareSliderThumbnail.spec.ts
rename to src/components/templates/thumbnails/CompareSliderThumbnail.test.ts
diff --git a/src/components/templates/thumbnails/DefaultThumbnail.spec.ts b/src/components/templates/thumbnails/DefaultThumbnail.test.ts
similarity index 100%
rename from src/components/templates/thumbnails/DefaultThumbnail.spec.ts
rename to src/components/templates/thumbnails/DefaultThumbnail.test.ts
diff --git a/src/components/templates/thumbnails/HoverDissolveThumbnail.spec.ts b/src/components/templates/thumbnails/HoverDissolveThumbnail.test.ts
similarity index 100%
rename from src/components/templates/thumbnails/HoverDissolveThumbnail.spec.ts
rename to src/components/templates/thumbnails/HoverDissolveThumbnail.test.ts
diff --git a/src/components/topbar/CommandMenubar.vue b/src/components/topbar/CommandMenubar.vue
index e9f33f8123..5d03d9c677 100644
--- a/src/components/topbar/CommandMenubar.vue
+++ b/src/components/topbar/CommandMenubar.vue
@@ -314,9 +314,19 @@ const hasActiveStateSiblings = (item: MenuItem): boolean => {
.comfy-command-menu ul {
background-color: var(--comfy-menu-secondary-bg) !important;
}
-
.comfy-command-menu-top .p-tieredmenu-submenu {
left: calc(100% + 15px) !important;
top: -4px !important;
}
+@media (max-height: 700px) {
+ .comfy-command-menu .p-tieredmenu-submenu {
+ @apply absolute max-h-[90vh] overflow-y-auto;
+ }
+ /* Help (last) submenu upward offset in compact mode */
+ .p-tieredmenu-root-list
+ > .p-tieredmenu-item:last-of-type
+ .p-tieredmenu-submenu {
+ top: -188px !important;
+ }
+}
diff --git a/src/components/topbar/CurrentUserButton.spec.ts b/src/components/topbar/CurrentUserButton.test.ts
similarity index 100%
rename from src/components/topbar/CurrentUserButton.spec.ts
rename to src/components/topbar/CurrentUserButton.test.ts
diff --git a/src/components/topbar/CurrentUserPopover.spec.ts b/src/components/topbar/CurrentUserPopover.test.ts
similarity index 100%
rename from src/components/topbar/CurrentUserPopover.spec.ts
rename to src/components/topbar/CurrentUserPopover.test.ts
diff --git a/src/components/widget/layout/BaseModalLayout.vue b/src/components/widget/layout/BaseModalLayout.vue
index c455f62eec..6c30d7ddea 100644
--- a/src/components/widget/layout/BaseModalLayout.vue
+++ b/src/components/widget/layout/BaseModalLayout.vue
@@ -127,7 +127,7 @@ const toggleRightPanel = () => {
const layoutClasses = cn(
'base-widget-layout',
'rounded-2xl overflow-hidden relative',
- 'bg-zinc-50 dark-theme:bg-zinc-800'
+ 'bg-gray-50 dark-theme:bg-gray-800'
)
const rightPanelButtonClasses = computed(() => {
@@ -144,7 +144,7 @@ const closeButtonClasses = cn(
const mainContainerClasses = cn(
'flex-1 flex',
- 'bg-zinc-100 dark-theme:bg-neutral-900'
+ 'bg-gray-100 dark-theme:bg-neutral-900'
)
const headerClasses = cn(
diff --git a/src/components/widget/nav/NavIcon.vue b/src/components/widget/nav/NavIcon.vue
index 653a6a70ed..bcc5c5a00d 100644
--- a/src/components/widget/nav/NavIcon.vue
+++ b/src/components/widget/nav/NavIcon.vue
@@ -1,5 +1,5 @@
-
+
diff --git a/src/components/widget/panel/LeftSidePanel.vue b/src/components/widget/panel/LeftSidePanel.vue
index 964753365d..b6d76b382e 100644
--- a/src/components/widget/panel/LeftSidePanel.vue
+++ b/src/components/widget/panel/LeftSidePanel.vue
@@ -1,5 +1,5 @@
-
-
+
+
-