From e4f2bd914bcf8f63ab108165613ac52cc68f1790 Mon Sep 17 00:00:00 2001 From: Drew Tate Date: Mon, 23 Oct 2023 13:50:57 -0600 Subject: [PATCH] better typing --- src/plugins/chart_expressions/common/index.ts | 8 ++++++- src/plugins/chart_expressions/common/types.ts | 24 +++++++++++++++++++ .../public/components/metric_vis.tsx | 9 +++---- .../workspace_panel/workspace_panel.tsx | 6 ++--- .../workspace_panel_wrapper.tsx | 4 ++-- x-pack/plugins/lens/public/types.ts | 17 ++----------- 6 files changed, 43 insertions(+), 25 deletions(-) diff --git a/src/plugins/chart_expressions/common/index.ts b/src/plugins/chart_expressions/common/index.ts index acc3b4d8c88cd..7207bc823d8a4 100644 --- a/src/plugins/chart_expressions/common/index.ts +++ b/src/plugins/chart_expressions/common/index.ts @@ -12,5 +12,11 @@ export { getOverridesFor, isOnAggBasedEditor, } from './utils'; -export type { Simplify, MakeOverridesSerializable } from './types'; +export type { + Simplify, + MakeOverridesSerializable, + ChartDimensionOptions, + DimensionsEvent, +} from './types'; +export { isDimensionsEvent } from './types'; export { getColorCategories } from './color_categories'; diff --git a/src/plugins/chart_expressions/common/types.ts b/src/plugins/chart_expressions/common/types.ts index acdd5909f1aec..37109d589c081 100644 --- a/src/plugins/chart_expressions/common/types.ts +++ b/src/plugins/chart_expressions/common/types.ts @@ -6,6 +6,7 @@ * Side Public License, v 1. */ +import type { ExpressionRendererEvent } from '@kbn/expressions-plugin/public'; import React from 'react'; export type Simplify = { [KeyType in keyof T]: T[KeyType] } & {}; @@ -26,3 +27,26 @@ export type MakeOverridesSerializable = { ? MakeOverridesSerializable : NonNullable; }; + +export interface DimensionsEvent extends ExpressionRendererEvent { + name: 'dimensions'; + data: ChartDimensionOptions; +} + +export type ChartDimensionOptions = + | { + // if maxDimensions are provided, the aspect ratio will be computed from them + maxDimensionsPX?: { + x: number; + y: number; + }; + aspectRatio?: never; + } + | { + aspectRatio?: { x: number; y: number }; + maxDimensionsPX?: never; + }; + +export function isDimensionsEvent(event: ExpressionRendererEvent): event is DimensionsEvent { + return event.name === 'dimensions'; +} diff --git a/src/plugins/chart_expressions/expression_metric/public/components/metric_vis.tsx b/src/plugins/chart_expressions/expression_metric/public/components/metric_vis.tsx index 9e849c1e63336..1df91c9718e8c 100644 --- a/src/plugins/chart_expressions/expression_metric/public/components/metric_vis.tsx +++ b/src/plugins/chart_expressions/expression_metric/public/components/metric_vis.tsx @@ -39,7 +39,7 @@ import { css } from '@emotion/react'; import { euiThemeVars } from '@kbn/ui-theme'; import { useResizeObserver, useEuiScrollBar, EuiIcon } from '@elastic/eui'; import { AllowedChartOverrides, AllowedSettingsOverrides } from '@kbn/charts-plugin/common'; -import { getOverridesFor } from '@kbn/chart-expressions-common'; +import { DimensionsEvent, getOverridesFor } from '@kbn/chart-expressions-common'; import { DEFAULT_TRENDLINE_NAME } from '../../common/constants'; import { VisParams } from '../../common'; import { getPaletteService, getThemeService, getFormatService } from '../services'; @@ -145,15 +145,16 @@ export const MetricVis = ({ const onWillRender = useCallback(() => { const maxTileSideLength = grid.current.length * grid.current[0].length > 1 ? 200 : 300; - fireEvent({ - name: 'setDimensions', + const event: DimensionsEvent = { + name: 'dimensions', data: { maxDimensionsPX: { y: grid.current.length * maxTileSideLength, x: grid.current[0]?.length * maxTileSideLength, }, }, - }); + }; + fireEvent(event); }, [fireEvent, grid]); const [scrollChildHeight, setScrollChildHeight] = useState('100%'); diff --git a/x-pack/plugins/lens/public/editor_frame_service/editor_frame/workspace_panel/workspace_panel.tsx b/x-pack/plugins/lens/public/editor_frame_service/editor_frame/workspace_panel/workspace_panel.tsx index 6c2277437e0f1..b61d6fd429d2b 100644 --- a/x-pack/plugins/lens/public/editor_frame_service/editor_frame/workspace_panel/workspace_panel.tsx +++ b/x-pack/plugins/lens/public/editor_frame_service/editor_frame/workspace_panel/workspace_panel.tsx @@ -36,6 +36,7 @@ import type { Datatable } from '@kbn/expressions-plugin/public'; import { DropIllustration } from '@kbn/chart-icons'; import { DragDrop, useDragDropContext, DragDropIdentifier } from '@kbn/dom-drag-drop'; import { reportPerformanceMetricEvent } from '@kbn/ebt-tools'; +import { ChartDimensionOptions, isDimensionsEvent } from '@kbn/chart-expressions-common'; import { trackUiCounterEvents } from '../../../lens_ui_telemetry'; import { getSearchWarningMessages } from '../../../utils'; import { @@ -52,7 +53,6 @@ import { UserMessagesGetter, AddUserMessages, isMessageRemovable, - VisualizationDisplayOptions, } from '../../../types'; import { switchToSuggestion } from '../suggestion_helpers'; import { buildExpression } from '../expression_helpers'; @@ -421,7 +421,7 @@ export const InnerWorkspacePanel = React.memo(function InnerWorkspacePanel({ }, [expressionExists, localState.expressionToRender]); const [dimensionDisplayOptions, setDimensionOptions] = useState< - VisualizationDisplayOptions | undefined + ChartDimensionOptions | undefined >(); const onEvent = useCallback( @@ -455,7 +455,7 @@ export const InnerWorkspacePanel = React.memo(function InnerWorkspacePanel({ ); } - if (event.name === 'setDimensions') { + if (isDimensionsEvent(event)) { setDimensionOptions(event.data); } }, diff --git a/x-pack/plugins/lens/public/editor_frame_service/editor_frame/workspace_panel/workspace_panel_wrapper.tsx b/x-pack/plugins/lens/public/editor_frame_service/editor_frame/workspace_panel/workspace_panel_wrapper.tsx index 3e1b83b224b81..57553780a6a5e 100644 --- a/x-pack/plugins/lens/public/editor_frame_service/editor_frame/workspace_panel/workspace_panel_wrapper.tsx +++ b/x-pack/plugins/lens/public/editor_frame_service/editor_frame/workspace_panel/workspace_panel_wrapper.tsx @@ -11,13 +11,13 @@ import React, { useCallback } from 'react'; import { EuiPageTemplate, EuiFlexGroup, EuiFlexItem, EuiButton } from '@elastic/eui'; import classNames from 'classnames'; import { FormattedMessage } from '@kbn/i18n-react'; +import { ChartDimensionOptions } from '@kbn/chart-expressions-common'; import { DatasourceMap, FramePublicAPI, UserMessagesGetter, VisualizationMap, Visualization, - VisualizationDisplayOptions, } from '../../../types'; import { DONT_CLOSE_DIMENSION_CONTAINER_ON_CLICK_CLASS } from '../../../utils'; import { ChartSwitch } from './chart_switch'; @@ -47,7 +47,7 @@ export interface WorkspacePanelWrapperProps { isFullscreen: boolean; lensInspector: LensInspector; getUserMessages: UserMessagesGetter; - displayOptions: VisualizationDisplayOptions | undefined; + displayOptions: ChartDimensionOptions | undefined; } export function VisualizationToolbar(props: { diff --git a/x-pack/plugins/lens/public/types.ts b/x-pack/plugins/lens/public/types.ts index b6dde219b5601..0995209fabfff 100644 --- a/x-pack/plugins/lens/public/types.ts +++ b/x-pack/plugins/lens/public/types.ts @@ -975,23 +975,10 @@ export interface VisualizationType { showExperimentalBadge?: boolean; } -export type VisualizationDisplayOptions = { +export interface VisualizationDisplayOptions { noPanelTitle?: boolean; noPadding?: boolean; -} & ( - | { - // if maxDimensions are provided, the aspect ratio will be computed from them - maxDimensionsPX?: { - x: number; - y: number; - }; - aspectRatio?: never; - } - | { - aspectRatio?: { x: number; y: number }; - maxDimensionsPX?: never; - } -); +} interface VisualizationStateFromContextChangeProps { suggestions: Suggestion[];