From 94113f44a584acd345e759d5f19169643a7bd6cc Mon Sep 17 00:00:00 2001 From: Romeo Balta <7095569+romeobalta@users.noreply.github.com> Date: Thu, 14 May 2026 16:28:02 +0100 Subject: [PATCH] fix(editor): Remove resource center tooltip (no-changelog) (#30468) Co-authored-by: Codex --- .../frontend/@n8n/i18n/src/locales/en.json | 1 - .../src/app/components/MainSidebar.vue | 6 - .../components/ResourceCenterTooltip.vue | 203 ------------------ .../__tests__/ResourceCenterTooltip.test.ts | 58 ----- .../__tests__/resourceCenter.store.test.ts | 10 - .../stores/resourceCenter.store.ts | 23 -- 6 files changed, 301 deletions(-) delete mode 100644 packages/frontend/editor-ui/src/experiments/resourceCenter/components/ResourceCenterTooltip.vue delete mode 100644 packages/frontend/editor-ui/src/experiments/resourceCenter/components/__tests__/ResourceCenterTooltip.test.ts diff --git a/packages/frontend/@n8n/i18n/src/locales/en.json b/packages/frontend/@n8n/i18n/src/locales/en.json index 06a9c973420..f8a101dd6bb 100644 --- a/packages/frontend/@n8n/i18n/src/locales/en.json +++ b/packages/frontend/@n8n/i18n/src/locales/en.json @@ -1213,7 +1213,6 @@ "experiments.resourceCenter.sidebar": "Resources", "experiments.resourceCenter.template.setupTime": "{minutes} minute set up", "experiments.resourceCenter.title": "Resources", - "experiments.resourceCenter.tooltip.text": "Get inspired and learn with use cases", "experiments.resourceCenter.video.level": "Level: {level}", "experiments.templatesDataQuality.modalTitle": "Featured templates", "error": "Error", diff --git a/packages/frontend/editor-ui/src/app/components/MainSidebar.vue b/packages/frontend/editor-ui/src/app/components/MainSidebar.vue index 4a9322e5278..5907de8de42 100644 --- a/packages/frontend/editor-ui/src/app/components/MainSidebar.vue +++ b/packages/frontend/editor-ui/src/app/components/MainSidebar.vue @@ -24,7 +24,6 @@ import MainSidebarHeader from '@/app/components/MainSidebarHeader.vue'; import BottomMenu from '@/app/components/BottomMenu.vue'; import MainSidebarSourceControl from '@/app/components/MainSidebarSourceControl.vue'; import ProjectNavigation from '@/features/collaboration/projects/components/ProjectNavigation.vue'; -import ResourceCenterTooltip from '@/experiments/resourceCenter/components/ResourceCenterTooltip.vue'; import { useResourceCenterStore } from '@/experiments/resourceCenter/stores/resourceCenter.store'; import { LOCAL_STORAGE_SIDEBAR_WIDTH } from '@/app/constants'; import { useSidebarExpandedExperiment } from '@/experiments/sidebarExpanded'; @@ -285,10 +284,6 @@ function openCommandBar(event: MouseEvent) { const handleSelect = (key: string) => { switch (key) { - case 'resource-center': { - resourceCenterStore.markResourceCenterTooltipDismissed(); - break; - } case 'about': { trackHelpItemClick('about'); uiStore.openModal(ABOUT_MODAL_KEY); @@ -384,7 +379,6 @@ useKeybindings({ @select="handleSelect" /> - diff --git a/packages/frontend/editor-ui/src/experiments/resourceCenter/components/ResourceCenterTooltip.vue b/packages/frontend/editor-ui/src/experiments/resourceCenter/components/ResourceCenterTooltip.vue deleted file mode 100644 index 1c3d43403c6..00000000000 --- a/packages/frontend/editor-ui/src/experiments/resourceCenter/components/ResourceCenterTooltip.vue +++ /dev/null @@ -1,203 +0,0 @@ - - - - - diff --git a/packages/frontend/editor-ui/src/experiments/resourceCenter/components/__tests__/ResourceCenterTooltip.test.ts b/packages/frontend/editor-ui/src/experiments/resourceCenter/components/__tests__/ResourceCenterTooltip.test.ts deleted file mode 100644 index 22fab9f420b..00000000000 --- a/packages/frontend/editor-ui/src/experiments/resourceCenter/components/__tests__/ResourceCenterTooltip.test.ts +++ /dev/null @@ -1,58 +0,0 @@ -import { createComponentRenderer } from '@/__tests__/render'; -import { screen, waitFor } from '@testing-library/vue'; -import userEvent from '@testing-library/user-event'; -import ResourceCenterTooltip from '../ResourceCenterTooltip.vue'; - -const mocks = vi.hoisted(() => ({ - trackView: vi.fn(), - trackDismiss: vi.fn(), - markDismissed: vi.fn(), -})); - -vi.mock('../../stores/resourceCenter.store', () => ({ - useResourceCenterStore: () => ({ - shouldShowResourceCenterTooltip: true, - trackResourceCenterTooltipView: mocks.trackView, - trackResourceCenterTooltipDismiss: mocks.trackDismiss, - markResourceCenterTooltipDismissed: mocks.markDismissed, - }), -})); - -vi.mock('@/app/composables/useSidebarLayout', () => ({ - useSidebarLayout: () => ({ - isCollapsed: false, - }), -})); - -const renderComponent = createComponentRenderer(ResourceCenterTooltip, { - global: { - stubs: { - N8nTooltip: { - template: '
', - }, - N8nIcon: true, - }, - }, -}); - -describe('ResourceCenterTooltip', () => { - beforeEach(() => { - vi.clearAllMocks(); - }); - - it('tracks a tooltip view when it becomes visible', async () => { - renderComponent(); - - await waitFor(() => expect(mocks.trackView).toHaveBeenCalledTimes(1)); - expect(screen.getByText('Get inspired and learn with use cases')).toBeInTheDocument(); - }); - - it('tracks dismissal and persists the dismissed state', async () => { - renderComponent(); - - await userEvent.click(await screen.findByRole('button', { name: 'Dismiss tooltip' })); - - expect(mocks.trackDismiss).toHaveBeenCalledTimes(1); - expect(mocks.markDismissed).toHaveBeenCalledTimes(1); - }); -}); diff --git a/packages/frontend/editor-ui/src/experiments/resourceCenter/stores/__tests__/resourceCenter.store.test.ts b/packages/frontend/editor-ui/src/experiments/resourceCenter/stores/__tests__/resourceCenter.store.test.ts index e6481f89b33..e3746358b00 100644 --- a/packages/frontend/editor-ui/src/experiments/resourceCenter/stores/__tests__/resourceCenter.store.test.ts +++ b/packages/frontend/editor-ui/src/experiments/resourceCenter/stores/__tests__/resourceCenter.store.test.ts @@ -75,16 +75,6 @@ describe('resourceCenter.store', () => { ); }); - describe('tooltip persistence (GRO-284 fix)', () => { - it('reads dismissed state from localStorage on init', () => { - localStorage.setItem('n8n-resourceCenter-tooltipDismissed', 'true'); - setActivePinia(createPinia()); - const store = useResourceCenterStore(); - // shouldShowResourceCenterTooltip should be false since tooltip was dismissed - expect(store.shouldShowResourceCenterTooltip).toBe(false); - }); - }); - describe('sidebar auto-expand', () => { it('stops auto-expanding after the sidebar is marked as expanded', () => { mocks.getVariant.mockReturnValue('variant'); diff --git a/packages/frontend/editor-ui/src/experiments/resourceCenter/stores/resourceCenter.store.ts b/packages/frontend/editor-ui/src/experiments/resourceCenter/stores/resourceCenter.store.ts index faf2e4778ab..ff80a70e215 100644 --- a/packages/frontend/editor-ui/src/experiments/resourceCenter/stores/resourceCenter.store.ts +++ b/packages/frontend/editor-ui/src/experiments/resourceCenter/stores/resourceCenter.store.ts @@ -14,7 +14,6 @@ import { OPEN_AI_API_CREDENTIAL_TYPE, deepCopy } from 'n8n-workflow'; import { quickStartWorkflows } from '../data/quickStartWorkflows'; const LOCAL_STORAGE_CREDENTIAL_KEY = 'N8N_READY_TO_RUN_OPENAI_CREDENTIAL_ID'; -const TOOLTIP_STORAGE_KEY = 'n8n-resourceCenter-tooltipDismissed'; const SIDEBAR_AUTO_EXPANDED_KEY = 'n8n-resourceCenter-sidebarAutoExpanded'; export const useResourceCenterStore = defineStore('resourceCenter', () => { @@ -26,7 +25,6 @@ export const useResourceCenterStore = defineStore('resourceCenter', () => { const router = useRouter(); const isLoadingTemplates = ref(false); - const hasTooltipBeenDismissed = ref(localStorage.getItem(TOOLTIP_STORAGE_KEY) === 'true'); const hasSidebarBeenAutoExpanded = ref( localStorage.getItem(SIDEBAR_AUTO_EXPANDED_KEY) === 'true', ); @@ -37,23 +35,6 @@ export const useResourceCenterStore = defineStore('resourceCenter', () => { RESOURCE_CENTER_EXPERIMENT.variant, ); - const shouldShowResourceCenterTooltip = computed(() => { - return isFeatureEnabled() && !hasTooltipBeenDismissed.value; - }); - - function markResourceCenterTooltipDismissed() { - hasTooltipBeenDismissed.value = true; - localStorage.setItem(TOOLTIP_STORAGE_KEY, 'true'); - } - - function trackResourceCenterTooltipView() { - telemetry.track('User viewed resource center tooltip'); - } - - function trackResourceCenterTooltipDismiss() { - telemetry.track('User dismissed resource center tooltip'); - } - async function fetchTemplateById(templateId: number): Promise { try { return await templatesStore.fetchTemplateById(templateId.toString()); @@ -142,17 +123,13 @@ export const useResourceCenterStore = defineStore('resourceCenter', () => { return { isFeatureEnabled, isLoadingTemplates, - shouldShowResourceCenterTooltip, shouldAutoExpandSidebar, fetchTemplateById, loadTemplates, getTemplateRoute, createAndOpenQuickStartWorkflow, - markResourceCenterTooltipDismissed, markSidebarAutoExpanded, trackResourceCenterView, - trackResourceCenterTooltipView, - trackResourceCenterTooltipDismiss, trackTileClick, }; });