From bf8979a7bf5b5a8badade6d447b9924c05950199 Mon Sep 17 00:00:00 2001 From: Yaelle Chaudy <42030685+yaelleC@users.noreply.github.com> Date: Fri, 22 Aug 2025 14:28:27 +0200 Subject: [PATCH] Dynamic Dashboards: Added dynamic dashboard feature toggle info as prop to dashboards events (#110024) * Added dynamic dashboard feature toggle info as prop to dashboards events * splitting out sharing interactions from dashboards one and fixing tests --- .../dashboard-scene/utils/interactions.ts | 55 +++++++++++-------- .../AddPanelButton/AddPanelMenu.test.tsx | 15 ++++- .../dashgrid/DashboardEmpty.test.tsx | 15 ++++- .../features/dashboard/utils/tracking.test.ts | 1 + 4 files changed, 58 insertions(+), 28 deletions(-) diff --git a/public/app/features/dashboard-scene/utils/interactions.ts b/public/app/features/dashboard-scene/utils/interactions.ts index 8713caa4112..b3ad35c4523 100644 --- a/public/app/features/dashboard-scene/utils/interactions.ts +++ b/public/app/features/dashboard-scene/utils/interactions.ts @@ -1,4 +1,4 @@ -import { reportInteraction } from '@grafana/runtime'; +import { config, reportInteraction } from '@grafana/runtime'; let isScenesContextSet = false; @@ -37,67 +37,67 @@ export const DashboardInteractions = { // Sharing interactions: sharingCategoryClicked: (properties?: Record) => { - reportDashboardInteraction('sharing_category_clicked', properties); + reportSharingInteraction('sharing_category_clicked', properties); }, shareLinkCopied: (properties?: Record) => { - reportDashboardInteraction('sharing_link_copy_clicked', properties); + reportSharingInteraction('sharing_link_copy_clicked', properties); }, embedSnippetCopy: (properties?: Record) => { - reportDashboardInteraction('sharing_embed_copy_clicked', properties); + reportSharingInteraction('sharing_embed_copy_clicked', properties); }, generatePanelImageClicked: (properties?: Record) => { - reportDashboardInteraction('sharing_link_generate_image_clicked', properties); + reportSharingInteraction('sharing_link_generate_image_clicked', properties); }, downloadPanelImageClicked: (properties?: Record) => { - reportDashboardInteraction('sharing_link_download_image_clicked', properties); + reportSharingInteraction('sharing_link_download_image_clicked', properties); }, publishSnapshotClicked: (properties?: Record) => { - reportDashboardInteraction('sharing_snapshot_publish_clicked', properties); + reportSharingInteraction('sharing_snapshot_publish_clicked', properties); }, publishSnapshotLocalClicked: (properties?: Record) => { - reportDashboardInteraction('sharing_snapshot_local_clicked', properties); + reportSharingInteraction('sharing_snapshot_local_clicked', properties); }, exportDownloadJsonClicked: (properties?: Record) => { - reportDashboardInteraction('sharing_export_download_json_clicked', properties); + reportSharingInteraction('sharing_export_download_json_clicked', properties); }, exportCopyJsonClicked: (properties?: Record) => { - reportDashboardInteraction('sharing_export_copy_json_clicked', properties); + reportSharingInteraction('sharing_export_copy_json_clicked', properties); }, exportSaveJsonClicked: (properties?: Record) => { - reportDashboardInteraction('sharing_export_save_json_clicked', properties); + reportSharingInteraction('sharing_export_save_json_clicked', properties); }, exportViewJsonClicked: (properties?: Record) => { - reportDashboardInteraction('sharing_export_view_json_clicked', properties); + reportSharingInteraction('sharing_export_view_json_clicked', properties); }, generatePublicDashboardUrlClicked: (properties?: Record) => { - reportDashboardInteraction('sharing_public_generate_url_clicked', properties); + reportSharingInteraction('sharing_public_generate_url_clicked', properties); }, revokePublicDashboardEmailClicked: (properties?: Record) => { - reportDashboardInteraction('sharing_public_email_revoke_clicked', properties); + reportSharingInteraction('sharing_public_email_revoke_clicked', properties); }, resendPublicDashboardEmailClicked: (properties?: Record) => { - reportDashboardInteraction('sharing_public_email_resend_clicked', properties); + reportSharingInteraction('sharing_public_email_resend_clicked', properties); }, publicDashboardEmailInviteClicked: (properties?: Record) => { - reportDashboardInteraction('sharing_public_email_invite_clicked', properties); + reportSharingInteraction('sharing_public_email_invite_clicked', properties); }, publicDashboardShareTypeChange: (properties?: Record) => { - reportDashboardInteraction('sharing_public_can_view_clicked', properties); + reportSharingInteraction('sharing_public_can_view_clicked', properties); }, publicDashboardTimeSelectionChanged: (properties?: Record) => { - reportDashboardInteraction('sharing_public_time_picker_clicked', properties); + reportSharingInteraction('sharing_public_time_picker_clicked', properties); }, publicDashboardAnnotationsSelectionChanged: (properties?: Record) => { - reportDashboardInteraction('sharing_public_annotations_clicked', properties); + reportSharingInteraction('sharing_public_annotations_clicked', properties); }, publicDashboardUrlCopied: (properties?: Record) => { - reportDashboardInteraction('sharing_public_copy_url_clicked', properties); + reportSharingInteraction('sharing_public_copy_url_clicked', properties); }, publicDashboardPauseSharingClicked: (properties?: Record) => { - reportDashboardInteraction('sharing_public_pause_clicked', properties); + reportSharingInteraction('sharing_public_pause_clicked', properties); }, revokePublicDashboardClicked: (properties?: Record) => { - reportDashboardInteraction('sharing_public_revoke_clicked', properties); + reportSharingInteraction('sharing_public_revoke_clicked', properties); }, // Empty dashboard state interactions: @@ -136,6 +136,17 @@ export const DashboardInteractions = { const reportDashboardInteraction: typeof reportInteraction = (name, properties) => { const meta = isScenesContextSet ? { scenesView: true } : {}; + const isDynamicDashboard = config.featureToggles?.dashboardNewLayouts ?? false; + + if (properties) { + reportInteraction(`dashboards_${name}`, { ...properties, ...meta, isDynamicDashboard }); + } else { + reportInteraction(`dashboards_${name}`, { isDynamicDashboard }); + } +}; + +const reportSharingInteraction: typeof reportInteraction = (name, properties) => { + const meta = isScenesContextSet ? { scenesView: true } : {}; if (properties) { reportInteraction(`dashboards_${name}`, { ...properties, ...meta }); diff --git a/public/app/features/dashboard/components/AddPanelButton/AddPanelMenu.test.tsx b/public/app/features/dashboard/components/AddPanelButton/AddPanelMenu.test.tsx index 75cedae0807..a8a152f420b 100644 --- a/public/app/features/dashboard/components/AddPanelButton/AddPanelMenu.test.tsx +++ b/public/app/features/dashboard/components/AddPanelButton/AddPanelMenu.test.tsx @@ -106,7 +106,10 @@ it('creates new visualization when clicked on menu item Visualization', () => { fireEvent.click(screen.getByRole('menuitem', { name: 'Visualization' })); }); - expect(reportInteraction).toHaveBeenCalledWith('dashboards_toolbar_add_clicked', { item: 'add_visualization' }); + expect(reportInteraction).toHaveBeenCalledWith('dashboards_toolbar_add_clicked', { + item: 'add_visualization', + isDynamicDashboard: false, + }); expect(locationService.partial).toHaveBeenCalled(); expect(onCreateNewPanel).toHaveBeenCalled(); }); @@ -118,7 +121,10 @@ it('creates new row when clicked on menu item Row', () => { fireEvent.click(screen.getByRole('menuitem', { name: 'Row' })); }); - expect(reportInteraction).toHaveBeenCalledWith('dashboards_toolbar_add_clicked', { item: 'add_row' }); + expect(reportInteraction).toHaveBeenCalledWith('dashboards_toolbar_add_clicked', { + item: 'add_row', + isDynamicDashboard: false, + }); expect(locationService.partial).not.toHaveBeenCalled(); expect(onCreateNewRow).toHaveBeenCalled(); }); @@ -130,7 +136,10 @@ it('adds a library panel when clicked on menu item Import from library', () => { fireEvent.click(screen.getByRole('menuitem', { name: 'Import from library' })); }); - expect(reportInteraction).toHaveBeenCalledWith('dashboards_toolbar_add_clicked', { item: 'import_from_library' }); + expect(reportInteraction).toHaveBeenCalledWith('dashboards_toolbar_add_clicked', { + item: 'import_from_library', + isDynamicDashboard: false, + }); expect(locationService.partial).not.toHaveBeenCalled(); expect(onAddLibraryPanel).toHaveBeenCalled(); }); diff --git a/public/app/features/dashboard/dashgrid/DashboardEmpty.test.tsx b/public/app/features/dashboard/dashgrid/DashboardEmpty.test.tsx index 09370002336..7dd3f6c4165 100644 --- a/public/app/features/dashboard/dashgrid/DashboardEmpty.test.tsx +++ b/public/app/features/dashboard/dashgrid/DashboardEmpty.test.tsx @@ -71,7 +71,10 @@ it('creates new visualization when clicked Add visualization', () => { fireEvent.click(screen.getByRole('button', { name: 'Add visualization' })); }); - expect(reportInteraction).toHaveBeenCalledWith('dashboards_emptydashboard_clicked', { item: 'add_visualization' }); + expect(reportInteraction).toHaveBeenCalledWith('dashboards_emptydashboard_clicked', { + item: 'add_visualization', + isDynamicDashboard: false, + }); expect(locationService.partial).toHaveBeenCalled(); expect(locationService.partial).toHaveBeenCalledWith({ editPanel: undefined, firstPanel: true }); expect(onCreateNewPanel).toHaveBeenCalled(); @@ -84,7 +87,10 @@ it('open import dashboard when clicked Import dashboard', () => { fireEvent.click(screen.getByRole('button', { name: 'Import dashboard' })); }); - expect(reportInteraction).toHaveBeenCalledWith('dashboards_emptydashboard_clicked', { item: 'import_dashboard' }); + expect(reportInteraction).toHaveBeenCalledWith('dashboards_emptydashboard_clicked', { + item: 'import_dashboard', + isDynamicDashboard: false, + }); expect(onImportDashboard).toHaveBeenCalled(); }); @@ -95,7 +101,10 @@ it('adds a library panel when clicked Add library panel', () => { fireEvent.click(screen.getByRole('button', { name: 'Add library panel' })); }); - expect(reportInteraction).toHaveBeenCalledWith('dashboards_emptydashboard_clicked', { item: 'import_from_library' }); + expect(reportInteraction).toHaveBeenCalledWith('dashboards_emptydashboard_clicked', { + item: 'import_from_library', + isDynamicDashboard: false, + }); expect(locationService.partial).not.toHaveBeenCalled(); expect(onAddLibraryPanel).toHaveBeenCalled(); }); diff --git a/public/app/features/dashboard/utils/tracking.test.ts b/public/app/features/dashboard/utils/tracking.test.ts index 4021965dce2..a8e9fb1ec8a 100644 --- a/public/app/features/dashboard/utils/tracking.test.ts +++ b/public/app/features/dashboard/utils/tracking.test.ts @@ -38,6 +38,7 @@ describe('trackDashboardLoaded', () => { expect(reportInteractionSpy).toHaveBeenCalledWith('dashboards_init_dashboard_completed', { duration: 200, isScene: false, + isDynamicDashboard: false, uid: 'dashboard-123', title: 'Test Dashboard', schemaVersion: model.schemaVersion, // This value is based on public/app/features/dashboard/state/DashboardMigrator.ts#L81