diff --git a/x-pack/plugins/lens/public/editor_frame_service/editor_frame/config_panel/layer_panel.test.tsx b/x-pack/plugins/lens/public/editor_frame_service/editor_frame/config_panel/layer_panel.test.tsx index 08fb71bc59790..119e5216488f2 100644 --- a/x-pack/plugins/lens/public/editor_frame_service/editor_frame/config_panel/layer_panel.test.tsx +++ b/x-pack/plugins/lens/public/editor_frame_service/editor_frame/config_panel/layer_panel.test.tsx @@ -241,6 +241,38 @@ describe('LayerPanel', () => { expect(screen.getByText('Requires field')).toBeInTheDocument(); }); + it('should not render the required warning when the chart is empty', async () => { + mockVisualization.getConfiguration.mockReturnValue({ + groups: [ + { + ...defaultGroup, + groupLabel: 'B', + groupId: 'b', + requiredMinDimensionCount: 1, + }, + ], + }); + + renderLayerPanel(); + expect(screen.queryByText('Requires field')).not.toBeInTheDocument(); + }); + + it('should render the required warning when the chart is empty but isInlineEditing', async () => { + mockVisualization.getConfiguration.mockReturnValue({ + groups: [ + { + ...defaultGroup, + groupLabel: 'B', + groupId: 'b', + requiredMinDimensionCount: 1, + }, + ], + }); + + renderLayerPanel({ setIsInlineFlyoutVisible: jest.fn() }); + expect(screen.queryByText('Requires field')).toBeInTheDocument(); + }); + it('should tell the user to remove the correct number of dimensions', async () => { mockVisualization.getConfiguration.mockReturnValue({ groups: [ diff --git a/x-pack/plugins/lens/public/editor_frame_service/editor_frame/config_panel/layer_panel.tsx b/x-pack/plugins/lens/public/editor_frame_service/editor_frame/config_panel/layer_panel.tsx index 3c203cacff3ba..6ed48175ef224 100644 --- a/x-pack/plugins/lens/public/editor_frame_service/editor_frame/config_panel/layer_panel.tsx +++ b/x-pack/plugins/lens/public/editor_frame_service/editor_frame/config_panel/layer_panel.tsx @@ -76,6 +76,8 @@ export function LayerPanel(props: LayerPanelProps) { shouldDisplayChartSwitch, } = props; + const isInlineEditing = Boolean(props?.setIsInlineFlyoutVisible); + const isSaveable = useLensSelector((state) => state.lens.isSaveable); const datasourceStates = useLensSelector(selectDatasourceStates); @@ -434,7 +436,7 @@ export function LayerPanel(props: LayerPanelProps) { .map((group, groupIndex) => { let errorText: string = ''; - if (!isEmptyLayer) { + if (!isEmptyLayer || isInlineEditing) { if ( group.requiredMinDimensionCount && group.requiredMinDimensionCount > group.accessors.length @@ -659,7 +661,7 @@ export function LayerPanel(props: LayerPanelProps) { handleClose={() => { setPanelSettingsOpen(false); }} - isInlineEditing={Boolean(props?.setIsInlineFlyoutVisible)} + isInlineEditing={isInlineEditing} >
@@ -726,7 +728,7 @@ export function LayerPanel(props: LayerPanelProps) { isOpen={isDimensionPanelOpen} isFullscreen={isFullscreen} label={openColumnGroup?.dimensionEditorGroupLabel ?? (openColumnGroup?.groupLabel || '')} - isInlineEditing={Boolean(props?.setIsInlineFlyoutVisible)} + isInlineEditing={isInlineEditing} handleClose={closeDimensionEditor} panel={ <> @@ -786,7 +788,7 @@ export function LayerPanel(props: LayerPanelProps) { addLayer: props.addLayer, removeLayer: props.onRemoveLayer, panelRef, - isInlineEditing: Boolean(props?.setIsInlineFlyoutVisible), + isInlineEditing, }} />