From 328f6040741644a36300396941716a7826003092 Mon Sep 17 00:00:00 2001 From: "J.C. Zhong" Date: Tue, 24 Sep 2024 20:13:48 +0000 Subject: [PATCH 1/2] chore: add context logging for chart cell --- .../components/DataDocChartCell/DataDocChartCell.tsx | 10 +++++++++- .../DataDocChartCell/DataDocChartComposer.tsx | 10 +++++++++- querybook/webapp/const/analytics.ts | 5 +++++ 3 files changed, 23 insertions(+), 2 deletions(-) diff --git a/querybook/webapp/components/DataDocChartCell/DataDocChartCell.tsx b/querybook/webapp/components/DataDocChartCell/DataDocChartCell.tsx index ae455047b..c8753b85d 100644 --- a/querybook/webapp/components/DataDocChartCell/DataDocChartCell.tsx +++ b/querybook/webapp/components/DataDocChartCell/DataDocChartCell.tsx @@ -3,8 +3,10 @@ import React from 'react'; import { QueryExecutionPicker } from 'components/ExecutionPicker/QueryExecutionPicker'; import { StatementExecutionPicker } from 'components/ExecutionPicker/StatementExecutionPicker'; +import { ComponentType, ElementType } from 'const/analytics'; import { IDataChartCellMeta } from 'const/datadoc'; import { useChartSource } from 'hooks/chart/useChartSource'; +import { trackClick } from 'lib/analytics'; import { transformData } from 'lib/chart/chart-data-transformation'; import { getDataTransformationOptions } from 'lib/chart/chart-meta-processing'; import { QueryExecutionResource } from 'resource/queryExecution'; @@ -228,7 +230,13 @@ export const DataDocChartCell = React.memo(
setShowChartComposer(true)} + onClick={() => { + trackClick({ + component: ComponentType.DATADOC_CHART_CELL, + element: ElementType.CHART_CONFIG_BUTTON, + }); + setShowChartComposer(true); + }} size="small" className="mr8" /> diff --git a/querybook/webapp/components/DataDocChartCell/DataDocChartComposer.tsx b/querybook/webapp/components/DataDocChartCell/DataDocChartComposer.tsx index 726c90f5f..1cabd1090 100644 --- a/querybook/webapp/components/DataDocChartCell/DataDocChartComposer.tsx +++ b/querybook/webapp/components/DataDocChartCell/DataDocChartComposer.tsx @@ -8,6 +8,7 @@ import Select from 'react-select'; import { QueryExecutionPicker } from 'components/ExecutionPicker/QueryExecutionPicker'; import { StatementExecutionPicker } from 'components/ExecutionPicker/StatementExecutionPicker'; import { StatementResultTable } from 'components/StatementResultTable/StatementResultTable'; +import { ComponentType, ElementType } from 'const/analytics'; import { ColorPalette } from 'const/chartColors'; import { IDataChartCellMeta } from 'const/datadoc'; import { @@ -29,6 +30,7 @@ import { } from 'const/dataDocChart'; import { StatementExecutionResultSizes } from 'const/queryResultLimit'; import { useChartSource } from 'hooks/chart/useChartSource'; +import { trackClick } from 'lib/analytics'; import { transformData } from 'lib/chart/chart-data-transformation'; import { mapMetaToFormVals } from 'lib/chart/chart-meta-processing'; import { @@ -1046,7 +1048,13 @@ const DataDocChartComposerComponent: React.FunctionComponent< {isEditable ? (
handleSubmit()} + onClick={() => { + trackClick({ + component: ComponentType.DATADOC_CHART_CELL, + element: ElementType.CHART_SAVE_BUTTON, + }); + handleSubmit(); + }} title="Save" fullWidth pushable={false} diff --git a/querybook/webapp/const/analytics.ts b/querybook/webapp/const/analytics.ts index 8389b074e..42604d366 100644 --- a/querybook/webapp/const/analytics.ts +++ b/querybook/webapp/const/analytics.ts @@ -16,6 +16,7 @@ export enum ComponentType { DATADOC_PAGE = 'DATADOC_PAGE', ADHOC_QUERY = 'ADHOC_QUERY', DATADOC_QUERY_CELL = 'DATADOC_QUERY_CELL', + DATADOC_CHART_CELL = 'DATADOC_CHART_CELL', RIGHT_SIDEBAR = 'RIGHT_SIDEBAR', TABLE_DETAIL_VIEW = 'TABLE_DETAIL_VIEW', TABLE_NAVIGATOR_SEARCH = 'TABLE_NAVIGATOR_SEARCH', @@ -88,6 +89,10 @@ export enum ElementType { RESULT_EXPORT_BUTTON = 'RESULT_EXPORT_BUTTON', INSERT_SNIPPET_BUTTON = 'INSERT_SNIPPET_BUTTON', + // Chart Cell + CHART_CONFIG_BUTTON = 'CHART_CONFIG_BUTTON', + CHART_SAVE_BUTTON = 'CHART_SAVE_BUTTON', + // Table detail view OVERVIEW_TABLE_TAB = 'OVERVIEW_TABLE_TAB', COLUMNS_TABLE_TAB = 'COLUMNS_TABLE_TAB', From 6922e591dbe633ee29b610eeccf185eee4bda3f5 Mon Sep 17 00:00:00 2001 From: "J.C. Zhong" Date: Wed, 25 Sep 2024 21:16:32 +0000 Subject: [PATCH 2/2] add list page view --- querybook/webapp/components/Board/BoardWrapper.tsx | 3 +++ querybook/webapp/const/analytics.ts | 1 + 2 files changed, 4 insertions(+) diff --git a/querybook/webapp/components/Board/BoardWrapper.tsx b/querybook/webapp/components/Board/BoardWrapper.tsx index 6481a335c..90fd3ac45 100644 --- a/querybook/webapp/components/Board/BoardWrapper.tsx +++ b/querybook/webapp/components/Board/BoardWrapper.tsx @@ -1,10 +1,13 @@ import React from 'react'; +import { ComponentType } from 'const/analytics'; import { useBoardPath } from 'hooks/ui/useBoardPath'; +import { useTrackView } from 'hooks/useTrackView'; import { Board } from './Board'; export const BoardWrapper: React.FunctionComponent = () => { + useTrackView(ComponentType.LIST_PAGE); const boardPath = useBoardPath(); const boardId = boardPath[boardPath.length - 1]; diff --git a/querybook/webapp/const/analytics.ts b/querybook/webapp/const/analytics.ts index 42604d366..7d923b14a 100644 --- a/querybook/webapp/const/analytics.ts +++ b/querybook/webapp/const/analytics.ts @@ -22,6 +22,7 @@ export enum ComponentType { TABLE_NAVIGATOR_SEARCH = 'TABLE_NAVIGATOR_SEARCH', AI_ASSISTANT = 'AI_ASSISTANT', SURVEY = 'SURVEY', + LIST_PAGE = 'LIST_PAGE', } export enum ElementType {