diff --git a/packages/@n8n/config/src/configs/frontend.config.ts b/packages/@n8n/config/src/configs/frontend.config.ts index 63f812952f..62fa004dd5 100644 --- a/packages/@n8n/config/src/configs/frontend.config.ts +++ b/packages/@n8n/config/src/configs/frontend.config.ts @@ -7,5 +7,5 @@ export type FrontendBetaFeatures = 'canvas_v2'; export class FrontendConfig { /** Which UI experiments to enable. Separate multiple values with a comma `,` */ @Env('N8N_UI_BETA_FEATURES') - betaFeatures: StringArray = []; + betaFeatures: StringArray = ['canvas_v2']; } diff --git a/packages/editor-ui/src/components/MainHeader/WorkflowDetails.vue b/packages/editor-ui/src/components/MainHeader/WorkflowDetails.vue index 6c053057de..6725bbf92d 100644 --- a/packages/editor-ui/src/components/MainHeader/WorkflowDetails.vue +++ b/packages/editor-ui/src/components/MainHeader/WorkflowDetails.vue @@ -191,30 +191,32 @@ const workflowMenuItems = computed(() => { disabled: !onWorkflowPage.value || isNewWorkflow.value, }); - actions.push({ - id: WORKFLOW_MENU_ACTIONS.SWITCH_NODE_VIEW_VERSION, - ...(nodeViewVersion.value === '2' - ? nodeViewSwitcherDiscovered.value || isNewUser.value - ? {} - : { - badge: locale.baseText('menuActions.badge.new'), - } - : nodeViewSwitcherDiscovered.value - ? { - badge: locale.baseText('menuActions.badge.beta'), - badgeProps: { - theme: 'tertiary', - }, - } - : { - badge: locale.baseText('menuActions.badge.new'), - }), - label: - nodeViewVersion.value === '2' - ? locale.baseText('menuActions.switchToOldNodeViewVersion') - : locale.baseText('menuActions.switchToNewNodeViewVersion'), - disabled: !onWorkflowPage.value, - }); + if (settingsStore.isCanvasV2Enabled) { + actions.push({ + id: WORKFLOW_MENU_ACTIONS.SWITCH_NODE_VIEW_VERSION, + ...(nodeViewVersion.value === '2' + ? nodeViewSwitcherDiscovered.value || isNewUser.value + ? {} + : { + badge: locale.baseText('menuActions.badge.new'), + } + : nodeViewSwitcherDiscovered.value + ? { + badge: locale.baseText('menuActions.badge.beta'), + badgeProps: { + theme: 'tertiary', + }, + } + : { + badge: locale.baseText('menuActions.badge.new'), + }), + label: + nodeViewVersion.value === '2' + ? locale.baseText('menuActions.switchToOldNodeViewVersion') + : locale.baseText('menuActions.switchToNewNodeViewVersion'), + disabled: !onWorkflowPage.value, + }); + } if ((workflowPermissions.value.delete && !props.readOnly) || isNewWorkflow.value) { actions.push({ diff --git a/packages/editor-ui/src/composables/useNodeViewVersionSwitcher.test.ts b/packages/editor-ui/src/composables/useNodeViewVersionSwitcher.test.ts index e5cfe1cb2d..2b8ce7710d 100644 --- a/packages/editor-ui/src/composables/useNodeViewVersionSwitcher.test.ts +++ b/packages/editor-ui/src/composables/useNodeViewVersionSwitcher.test.ts @@ -16,6 +16,11 @@ describe('useNodeViewVersionSwitcher', () => { const initialState = { [STORES.WORKFLOWS]: {}, [STORES.NDV]: {}, + [STORES.SETTINGS]: { + settings: { + betaFeatures: ['canvas_v2'], + }, + }, }; beforeEach(() => { diff --git a/packages/editor-ui/src/composables/useNodeViewVersionSwitcher.ts b/packages/editor-ui/src/composables/useNodeViewVersionSwitcher.ts index 59a033315f..b0ef4a4f4c 100644 --- a/packages/editor-ui/src/composables/useNodeViewVersionSwitcher.ts +++ b/packages/editor-ui/src/composables/useNodeViewVersionSwitcher.ts @@ -3,15 +3,18 @@ import { useLocalStorage } from '@vueuse/core'; import { useTelemetry } from '@/composables/useTelemetry'; import { useWorkflowsStore } from '@/stores/workflows.store'; import { useNDVStore } from '@/stores/ndv.store'; +import { useSettingsStore } from '@/stores/settings.store'; export function useNodeViewVersionSwitcher() { const ndvStore = useNDVStore(); const workflowsStore = useWorkflowsStore(); const telemetry = useTelemetry(); + const settingsStore = useSettingsStore(); const isNewUser = computed(() => workflowsStore.activeWorkflows.length === 0); - const nodeViewVersion = useLocalStorage('NodeView.version', '2'); + const defaultVersion = settingsStore.isCanvasV2Enabled ? '2' : '1'; + const nodeViewVersion = useLocalStorage('NodeView.version', defaultVersion); const nodeViewVersionMigrated = useLocalStorage('NodeView.migrated', false); function setNodeViewSwitcherDropdownOpened(visible: boolean) {