Comfy-Org/ComfyUI_frontend
1
0
Fork 0
mirror of https://github.com/Comfy-Org/ComfyUI_frontend.git synced 2026-04-29 02:32:18 +00:00
Code Issues Packages Projects Releases Wiki Activity

[backport core/1.32] make vue node settings appear higher in the settings dialog (#6821)

Browse Source 
Backport of #6820 to `core/1.32`

Automatically created by backport workflow.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-6821-backport-core-1-32-make-vue-node-settings-appear-higher-in-the-settings-dialog-2b36d73d365081f98ab0f9540ffc362c)
by [Unito](https://www.unito.io)

Co-authored-by: Christian Byrne <cbyrne@comfy.org>
This commit is contained in:
Comfy Org PR Bot
2025-11-22 15:03:43 +09:00
committed by GitHub
parent 662f79edf4
commit e94a74f167
3 changed files with 17 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/locales/en/settings.json
View File

@@ -335,11 +335,11 @@
"name": "Validate workflows" "name": "Validate workflows"
}, },
"Comfy_VueNodes_AutoScaleLayout": { "Comfy_VueNodes_AutoScaleLayout": {
"name": "Auto-scale layout (Vue nodes)", "name": "Auto-scale layout (Nodes 2.0)",
"tooltip": "Automatically scale node positions when switching to Vue rendering to prevent overlap" "tooltip": "Automatically scale node positions when switching to Vue rendering to prevent overlap"
}, },
"Comfy_VueNodes_Enabled": { "Comfy_VueNodes_Enabled": {
"name": "Modern Node Design (Vue Nodes)", "name": "Modern Node Design (Nodes 2.0)",
"tooltip": "Modern: DOM-based rendering with enhanced interactivity, native browser features, and updated visual design. Classic: Traditional canvas rendering." "tooltip": "Modern: DOM-based rendering with enhanced interactivity, native browser features, and updated visual design. Classic: Traditional canvas rendering."
}, },
"Comfy_WidgetControlMode": { "Comfy_WidgetControlMode": {

9
src/platform/settings/components/SettingDialogContent.vue
View File

@@ -107,10 +107,17 @@ const {
const authActions = useFirebaseAuthActions() const authActions = useFirebaseAuthActions()
// Get max sortOrder from settings in a group
const getGroupSortOrder = (group: SettingTreeNode): number =>
Math.max(0, ...flattenTree<SettingParams>(group).map((s) => s.sortOrder ?? 0))
// Sort groups for a category // Sort groups for a category
const sortedGroups = (category: SettingTreeNode): ISettingGroup[] => { const sortedGroups = (category: SettingTreeNode): ISettingGroup[] => {
return [...(category.children ?? [])] return [...(category.children ?? [])]
.sort((a, b) => a.label.localeCompare(b.label)) .sort((a, b) => {
const orderDiff = getGroupSortOrder(b) - getGroupSortOrder(a)
return orderDiff !== 0 ? orderDiff : a.label.localeCompare(b.label)
})
.map((group) => ({ .map((group) => ({
label: group.label, label: group.label,
settings: flattenTree<SettingParams>(group).sort((a, b) => { settings: flattenTree<SettingParams>(group).sort((a, b) => {

10
src/platform/settings/constants/coreSettings.ts
View File

@@ -1082,24 +1082,28 @@ export const CORE_SETTINGS: SettingParams[] = [
}, },
/** /**
* Vue Node System Settings * Nodes 2.0 Settings
*/ */
{ {
id: 'Comfy.VueNodes.Enabled', id: 'Comfy.VueNodes.Enabled',
name: 'Modern Node Design (Vue Nodes)', category: ['Comfy', 'Nodes 2.0', 'VueNodesEnabled'],
name: 'Modern Node Design (Nodes 2.0)',
type: 'boolean', type: 'boolean',
tooltip: tooltip:
'Modern: DOM-based rendering with enhanced interactivity, native browser features, and updated visual design. Classic: Traditional canvas rendering.', 'Modern: DOM-based rendering with enhanced interactivity, native browser features, and updated visual design. Classic: Traditional canvas rendering.',
defaultValue: false, defaultValue: false,
sortOrder: 100,
experimental: true, experimental: true,
versionAdded: '1.27.1' versionAdded: '1.27.1'
}, },
{ {
id: 'Comfy.VueNodes.AutoScaleLayout', id: 'Comfy.VueNodes.AutoScaleLayout',
name: 'Auto-scale layout (Vue nodes)', category: ['Comfy', 'Nodes 2.0', 'AutoScaleLayout'],
name: 'Auto-scale layout (Nodes 2.0)',
tooltip: tooltip:
'Automatically scale node positions when switching to Vue rendering to prevent overlap', 'Automatically scale node positions when switching to Vue rendering to prevent overlap',
type: 'boolean', type: 'boolean',
sortOrder: 50,
experimental: true, experimental: true,
defaultValue: true, defaultValue: true,
versionAdded: '1.30.3' versionAdded: '1.30.3'