From 83893f8ff2b8b4c8526ea7472d1b4cbf4fc469a7 Mon Sep 17 00:00:00 2001 From: "JUST.in DO IT" Date: Fri, 20 Jan 2023 07:59:50 -0800 Subject: [PATCH] chore(dashboard): Log events for download as image (#22793) --- .../HeaderActionsDropdown/HeaderActionsDropdown.test.tsx | 1 + .../components/Header/HeaderActionsDropdown/index.jsx | 3 +++ superset-frontend/src/dashboard/components/Header/index.jsx | 2 ++ .../dashboard/components/SliceHeader/SliceHeader.test.tsx | 1 + .../src/dashboard/components/SliceHeader/index.tsx | 2 ++ .../SliceHeaderControls/SliceHeaderControls.test.tsx | 1 + .../src/dashboard/components/SliceHeaderControls/index.tsx | 5 +++++ .../src/dashboard/components/gridComponents/Chart.jsx | 2 ++ superset-frontend/src/logger/LogUtils.ts | 5 +++++ 9 files changed, 22 insertions(+) diff --git a/superset-frontend/src/dashboard/components/Header/HeaderActionsDropdown/HeaderActionsDropdown.test.tsx b/superset-frontend/src/dashboard/components/Header/HeaderActionsDropdown/HeaderActionsDropdown.test.tsx index 36a3e2cb2c..37ff40c6b7 100644 --- a/superset-frontend/src/dashboard/components/Header/HeaderActionsDropdown/HeaderActionsDropdown.test.tsx +++ b/superset-frontend/src/dashboard/components/Header/HeaderActionsDropdown/HeaderActionsDropdown.test.tsx @@ -68,6 +68,7 @@ const createProps = () => ({ lastModifiedTime: 0, isDropdownVisible: true, dataMask: {}, + logEvent: jest.fn(), }); const editModeOnProps = { ...createProps(), diff --git a/superset-frontend/src/dashboard/components/Header/HeaderActionsDropdown/index.jsx b/superset-frontend/src/dashboard/components/Header/HeaderActionsDropdown/index.jsx index db092f07e7..d4c9a8aadb 100644 --- a/superset-frontend/src/dashboard/components/Header/HeaderActionsDropdown/index.jsx +++ b/superset-frontend/src/dashboard/components/Header/HeaderActionsDropdown/index.jsx @@ -36,6 +36,7 @@ import getDashboardUrl from 'src/dashboard/util/getDashboardUrl'; import { getActiveFilters } from 'src/dashboard/util/activeDashboardFilters'; import { getUrlParam } from 'src/utils/urlUtils'; import { FILTER_BOX_MIGRATION_STATES } from 'src/explore/constants'; +import { LOG_ACTIONS_DASHBOARD_DOWNLOAD_AS_IMAGE } from 'src/logger/LogUtils'; const propTypes = { addSuccessToast: PropTypes.func.isRequired, @@ -65,6 +66,7 @@ const propTypes = { onSave: PropTypes.func.isRequired, showPropertiesModal: PropTypes.func.isRequired, manageEmbedded: PropTypes.func.isRequired, + logEvent: PropTypes.func, refreshLimit: PropTypes.number, refreshWarning: PropTypes.string, lastModifiedTime: PropTypes.number.isRequired, @@ -182,6 +184,7 @@ class HeaderActionsDropdown extends React.PureComponent { )(domEvent).then(() => { menu.style.visibility = 'visible'; }); + this.props.logEvent?.(LOG_ACTIONS_DASHBOARD_DOWNLOAD_AS_IMAGE); break; } case MENU_KEYS.TOGGLE_FULLSCREEN: { diff --git a/superset-frontend/src/dashboard/components/Header/index.jsx b/superset-frontend/src/dashboard/components/Header/index.jsx index ca3566345b..770cc67d70 100644 --- a/superset-frontend/src/dashboard/components/Header/index.jsx +++ b/superset-frontend/src/dashboard/components/Header/index.jsx @@ -464,6 +464,7 @@ class Header extends React.PureComponent { setRefreshFrequency, lastModifiedTime, filterboxMigrationState, + logEvent, } = this.props; const userCanEdit = @@ -679,6 +680,7 @@ class Header extends React.PureComponent { filterboxMigrationState={filterboxMigrationState} isDropdownVisible={this.state.isDropdownVisible} setIsDropdownVisible={this.setIsDropdownVisible} + logEvent={logEvent} /> } showFaveStar={user?.userId && dashboardInfo?.id} diff --git a/superset-frontend/src/dashboard/components/SliceHeader/SliceHeader.test.tsx b/superset-frontend/src/dashboard/components/SliceHeader/SliceHeader.test.tsx index bc4054adc7..f1aacd79e0 100644 --- a/superset-frontend/src/dashboard/components/SliceHeader/SliceHeader.test.tsx +++ b/superset-frontend/src/dashboard/components/SliceHeader/SliceHeader.test.tsx @@ -156,6 +156,7 @@ const createProps = (overrides: any = {}) => ({ toggleExpandSlice: jest.fn(), forceRefresh: jest.fn(), logExploreChart: jest.fn(), + logEvent: jest.fn(), exportCSV: jest.fn(), formData: { slice_id: 1, datasource: '58__table' }, width: 100, diff --git a/superset-frontend/src/dashboard/components/SliceHeader/index.tsx b/superset-frontend/src/dashboard/components/SliceHeader/index.tsx index 8c4bef5c29..2c6e6d84ad 100644 --- a/superset-frontend/src/dashboard/components/SliceHeader/index.tsx +++ b/superset-frontend/src/dashboard/components/SliceHeader/index.tsx @@ -133,6 +133,7 @@ const SliceHeader: FC = ({ updateSliceName = () => ({}), toggleExpandSlice = () => ({}), logExploreChart = () => ({}), + logEvent, exportCSV = () => ({}), editMode = false, annotationQuery = {}, @@ -271,6 +272,7 @@ const SliceHeader: FC = ({ toggleExpandSlice={toggleExpandSlice} forceRefresh={forceRefresh} logExploreChart={logExploreChart} + logEvent={logEvent} exportCSV={exportCSV} exportFullCSV={exportFullCSV} supersetCanExplore={supersetCanExplore} diff --git a/superset-frontend/src/dashboard/components/SliceHeaderControls/SliceHeaderControls.test.tsx b/superset-frontend/src/dashboard/components/SliceHeaderControls/SliceHeaderControls.test.tsx index 28d740fc13..3a1e305640 100644 --- a/superset-frontend/src/dashboard/components/SliceHeaderControls/SliceHeaderControls.test.tsx +++ b/superset-frontend/src/dashboard/components/SliceHeaderControls/SliceHeaderControls.test.tsx @@ -47,6 +47,7 @@ const createProps = (viz_type = 'sunburst') => forceRefresh: jest.fn(), handleToggleFullSize: jest.fn(), toggleExpandSlice: jest.fn(), + logEvent: jest.fn(), slice: { slice_id: 371, slice_url: '/explore/?form_data=%7B%22slice_id%22%3A%20371%7D', diff --git a/superset-frontend/src/dashboard/components/SliceHeaderControls/index.tsx b/superset-frontend/src/dashboard/components/SliceHeaderControls/index.tsx index 00e83799c7..cccab1690a 100644 --- a/superset-frontend/src/dashboard/components/SliceHeaderControls/index.tsx +++ b/superset-frontend/src/dashboard/components/SliceHeaderControls/index.tsx @@ -54,6 +54,7 @@ import ViewQueryModal from 'src/explore/components/controls/ViewQueryModal'; import { ResultsPaneOnDashboard } from 'src/explore/components/DataTablesPane'; import Modal from 'src/components/Modal'; import { DrillDetailMenuItems } from 'src/components/Chart/DrillDetail'; +import { LOG_ACTIONS_CHART_DOWNLOAD_AS_IMAGE } from 'src/logger/LogUtils'; const MENU_KEYS = { CROSS_FILTER_SCOPING: 'cross_filter_scoping', @@ -137,6 +138,7 @@ export interface SliceHeaderControlsProps { forceRefresh: (sliceId: number, dashboardId: number) => void; logExploreChart?: (sliceId: number) => void; + logEvent?: (eventName: string, eventData?: object) => void; toggleExpandSlice?: (sliceId: number) => void; exportCSV?: (sliceId: number) => void; exportFullCSV?: (sliceId: number) => void; @@ -321,6 +323,9 @@ class SliceHeaderControls extends React.PureComponent< )(domEvent).then(() => { menu.style.visibility = 'visible'; }); + this.props.logEvent?.(LOG_ACTIONS_CHART_DOWNLOAD_AS_IMAGE, { + chartId: this.props.slice.slice_id, + }); break; } default: diff --git a/superset-frontend/src/dashboard/components/gridComponents/Chart.jsx b/superset-frontend/src/dashboard/components/gridComponents/Chart.jsx index f16805fba7..082088f111 100644 --- a/superset-frontend/src/dashboard/components/gridComponents/Chart.jsx +++ b/superset-frontend/src/dashboard/components/gridComponents/Chart.jsx @@ -408,6 +408,7 @@ class Chart extends React.Component { postTransformProps, datasetsStatus, isInView, + logEvent, } = this.props; const { width } = this.state; @@ -457,6 +458,7 @@ class Chart extends React.Component { editMode={editMode} annotationQuery={chart.annotationQuery} logExploreChart={this.logExploreChart} + logEvent={logEvent} onExploreChart={this.onExploreChart} exportCSV={this.exportCSV} exportFullCSV={this.exportFullCSV} diff --git a/superset-frontend/src/logger/LogUtils.ts b/superset-frontend/src/logger/LogUtils.ts index 60f0fe1833..c6b3545c37 100644 --- a/superset-frontend/src/logger/LogUtils.ts +++ b/superset-frontend/src/logger/LogUtils.ts @@ -47,6 +47,9 @@ export const LOG_ACTIONS_DATASET_CREATION_SUCCESS = 'dataset_creation_success'; export const LOG_ACTIONS_SPA_NAVIGATION = 'spa_navigation'; export const LOG_ACTIONS_CONFIRM_OVERWRITE_DASHBOARD_METADATA = 'confirm_overwrite_dashboard_metadata'; +export const LOG_ACTIONS_DASHBOARD_DOWNLOAD_AS_IMAGE = + 'dashboard_download_as_image'; +export const LOG_ACTIONS_CHART_DOWNLOAD_AS_IMAGE = 'chart_download_as_image'; // Log event types -------------------------------------------------------------- export const LOG_EVENT_TYPE_TIMING = new Set([ @@ -67,6 +70,8 @@ export const LOG_EVENT_TYPE_USER = new Set([ LOG_ACTIONS_PERIODIC_RENDER_DASHBOARD, LOG_ACTIONS_MOUNT_EXPLORER, LOG_ACTIONS_CONFIRM_OVERWRITE_DASHBOARD_METADATA, + LOG_ACTIONS_DASHBOARD_DOWNLOAD_AS_IMAGE, + LOG_ACTIONS_CHART_DOWNLOAD_AS_IMAGE, ]); export const LOG_EVENT_DATASET_TYPE_DATASET_CREATION = [