fix(editor): Fix template link behaviour for exp (no-changelog) (#18477)

This commit is contained in:
Romeo Balta
2025-08-18 10:33:29 +01:00
committed by GitHub
parent cbf935af91
commit 79d24a3e92

View File

@@ -6,7 +6,13 @@ import { onClickOutside, type VueInstance } from '@vueuse/core';
import { useI18n } from '@n8n/i18n'; import { useI18n } from '@n8n/i18n';
import { N8nNavigationDropdown, N8nTooltip, N8nLink, N8nIconButton } from '@n8n/design-system'; import { N8nNavigationDropdown, N8nTooltip, N8nLink, N8nIconButton } from '@n8n/design-system';
import type { IMenuItem } from '@n8n/design-system'; import type { IMenuItem } from '@n8n/design-system';
import { ABOUT_MODAL_KEY, RELEASE_NOTES_URL, VIEWS, WHATS_NEW_MODAL_KEY } from '@/constants'; import {
ABOUT_MODAL_KEY,
EXPERIMENT_TEMPLATE_RECO_V2_KEY,
RELEASE_NOTES_URL,
VIEWS,
WHATS_NEW_MODAL_KEY,
} from '@/constants';
import { hasPermission } from '@/utils/rbac/permissions'; import { hasPermission } from '@/utils/rbac/permissions';
import { useCloudPlanStore } from '@/stores/cloudPlan.store'; import { useCloudPlanStore } from '@/stores/cloudPlan.store';
import { useRootStore } from '@n8n/stores/useRootStore'; import { useRootStore } from '@n8n/stores/useRootStore';
@@ -29,6 +35,7 @@ import Logo from '@/components/Logo/Logo.vue';
import VersionUpdateCTA from '@/components/VersionUpdateCTA.vue'; import VersionUpdateCTA from '@/components/VersionUpdateCTA.vue';
import { TemplateClickSource, trackTemplatesClick } from '@/utils/experiments'; import { TemplateClickSource, trackTemplatesClick } from '@/utils/experiments';
import { I18nT } from 'vue-i18n'; import { I18nT } from 'vue-i18n';
import { usePersonalizedTemplatesV2Store } from '@/experiments/templateRecoV2/stores/templateRecoV2.store';
const becomeTemplateCreatorStore = useBecomeTemplateCreatorStore(); const becomeTemplateCreatorStore = useBecomeTemplateCreatorStore();
const cloudPlanStore = useCloudPlanStore(); const cloudPlanStore = useCloudPlanStore();
@@ -40,6 +47,7 @@ const usersStore = useUsersStore();
const versionsStore = useVersionsStore(); const versionsStore = useVersionsStore();
const workflowsStore = useWorkflowsStore(); const workflowsStore = useWorkflowsStore();
const sourceControlStore = useSourceControlStore(); const sourceControlStore = useSourceControlStore();
const personalizedTemplatesV2Store = usePersonalizedTemplatesV2Store();
const { callDebounced } = useDebounce(); const { callDebounced } = useDebounce();
const externalHooks = useExternalHooks(); const externalHooks = useExternalHooks();
@@ -86,12 +94,23 @@ const mainMenuItems = computed<IMenuItem[]>(() => [
available: settingsStore.isCloudDeployment && hasPermission(['instanceOwner']), available: settingsStore.isCloudDeployment && hasPermission(['instanceOwner']),
}, },
{ {
// Link to in-app templates, available if custom templates are enabled // Link to templateRecoV2 modal, available when experiment is enabled
id: 'templates', id: 'templates',
icon: 'package-open', icon: 'package-open',
label: i18n.baseText('mainSidebar.templates'), label: i18n.baseText('mainSidebar.templates'),
position: 'bottom', position: 'bottom',
available: settingsStore.isTemplatesEnabled && templatesStore.hasCustomTemplatesHost, available: settingsStore.isTemplatesEnabled && personalizedTemplatesV2Store.isFeatureEnabled(),
},
{
// Link to in-app templates, available if custom templates are enabled and experiment is disabled
id: 'templates',
icon: 'package-open',
label: i18n.baseText('mainSidebar.templates'),
position: 'bottom',
available:
settingsStore.isTemplatesEnabled &&
templatesStore.hasCustomTemplatesHost &&
!personalizedTemplatesV2Store.isFeatureEnabled(),
route: { to: { name: VIEWS.TEMPLATES } }, route: { to: { name: VIEWS.TEMPLATES } },
}, },
{ {
@@ -100,7 +119,10 @@ const mainMenuItems = computed<IMenuItem[]>(() => [
icon: 'package-open', icon: 'package-open',
label: i18n.baseText('mainSidebar.templates'), label: i18n.baseText('mainSidebar.templates'),
position: 'bottom', position: 'bottom',
available: settingsStore.isTemplatesEnabled && !templatesStore.hasCustomTemplatesHost, available:
settingsStore.isTemplatesEnabled &&
!templatesStore.hasCustomTemplatesHost &&
!personalizedTemplatesV2Store.isFeatureEnabled(),
link: { link: {
href: templatesStore.websiteTemplateRepositoryURL, href: templatesStore.websiteTemplateRepositoryURL,
target: '_blank', target: '_blank',
@@ -289,7 +311,13 @@ const toggleCollapse = () => {
const handleSelect = (key: string) => { const handleSelect = (key: string) => {
switch (key) { switch (key) {
case 'templates': case 'templates':
if (settingsStore.isTemplatesEnabled && !templatesStore.hasCustomTemplatesHost) { if (personalizedTemplatesV2Store.isFeatureEnabled()) {
uiStore.openModalWithData({
name: EXPERIMENT_TEMPLATE_RECO_V2_KEY,
data: {},
});
trackTemplatesClick(TemplateClickSource.sidebarButton);
} else if (settingsStore.isTemplatesEnabled && !templatesStore.hasCustomTemplatesHost) {
trackTemplatesClick(TemplateClickSource.sidebarButton); trackTemplatesClick(TemplateClickSource.sidebarButton);
} }
break; break;