[Discover][SavedSearch] Fix default rowsPerPage for Dashboard panels (#189717)

- Follow up for https://github.com/elastic/kibana/pull/180536

## Summary

This PR fixes an issue with `rowsPerPage` Advanced Setting: after the
refactoring it was ignored.

To test: 
Change `rowsPerPage` on Advanced Setting page, navigate to Dashboard and
add a saved search panel. It should use the configured value by default.
The default value can be overwritten by custom panel settings or saved
search own settings.


### Checklist

- [x] [Unit or functional
tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)
were updated or added to match the most common scenarios

src/plugins/discover/public/embeddable/components/saved_search_grid.tsx

@@ -9,7 +9,7 @@ import React, { useCallback, useMemo, useState } from 'react';
 import type { DataTableRecord } from '@kbn/discover-utils/types';
 import { AggregateQuery, Query } from '@kbn/es-query';
 import type { SearchResponseWarning } from '@kbn/search-response-warnings';
-import { MAX_DOC_FIELDS_DISPLAYED, ROW_HEIGHT_OPTION, SHOW_MULTIFIELDS } from '@kbn/discover-utils';
+import { MAX_DOC_FIELDS_DISPLAYED, SHOW_MULTIFIELDS } from '@kbn/discover-utils';
 import {
   type UnifiedDataTableProps,
   type DataTableColumnsMeta,
@@ -108,7 +108,6 @@ export function DiscoverGridEmbeddable(props: DiscoverGridEmbeddableProps) {
         totalHits={props.totalHitCount}
         setExpandedDoc={setExpandedDoc}
         expandedDoc={expandedDoc}
-        configRowHeight={props.services.uiSettings.get(ROW_HEIGHT_OPTION)}
         showMultiFields={props.services.uiSettings.get(SHOW_MULTIFIELDS)}
         maxDocFieldsDisplayed={props.services.uiSettings.get(MAX_DOC_FIELDS_DISPLAYED)}
         renderDocumentView={renderDocumentView}
@@ -116,7 +115,6 @@ export function DiscoverGridEmbeddable(props: DiscoverGridEmbeddableProps) {
         externalCustomRenderers={cellRenderers}
         enableComparisonMode
         showColumnTokens
-        configHeaderRowHeight={3}
         showFullScreenButton={false}
         className="unifiedDataTable"
       />

src/plugins/discover/public/embeddable/components/search_embeddable_grid_component.tsx

@@ -12,8 +12,8 @@ import { BehaviorSubject } from 'rxjs';
 import type { DataView } from '@kbn/data-views-plugin/common';
 import {
   DOC_HIDE_TIME_COLUMN_SETTING,
-  isLegacyTableEnabled,
   SEARCH_FIELDS_FROM_SOURCE,
+  isLegacyTableEnabled,
 } from '@kbn/discover-utils';
 import { Filter } from '@kbn/es-query';
 import {
@@ -33,6 +33,7 @@ import { SEARCH_EMBEDDABLE_CELL_ACTIONS_TRIGGER_ID } from '../constants';
 import { isEsqlMode } from '../initialize_fetch';
 import type { SearchEmbeddableApi, SearchEmbeddableStateManager } from '../types';
 import { DiscoverGridEmbeddable } from './saved_search_grid';
+import { getSearchEmbeddableDefaults } from '../get_search_embeddable_defaults';
 
 interface SavedSearchEmbeddableComponentProps {
   api: SearchEmbeddableApi & { fetchWarnings$: BehaviorSubject<SearchResponseIncompleteWarning[]> };
@@ -144,13 +145,15 @@ export function SearchEmbeddableGridComponent({
     return getAllowedSampleSize(savedSearch.sampleSize, discoverServices.uiSettings);
   }, [savedSearch.sampleSize, discoverServices]);
 
+  const defaults = getSearchEmbeddableDefaults(discoverServices.uiSettings);
+
   const sharedProps = {
     columns: savedSearch.columns ?? [],
     dataView,
     interceptedWarnings,
     onFilter: onAddFilter,
     rows,
-    rowsPerPageState: savedSearch.rowsPerPage,
+    rowsPerPageState: savedSearch.rowsPerPage ?? defaults.rowsPerPage,
     sampleSizeState: fetchedSampleSize,
     searchDescription: panelDescription || savedSearchDescription,
     sort,
@@ -179,12 +182,14 @@ export function SearchEmbeddableGridComponent({
       ariaLabelledBy={'documentsAriaLabel'}
       cellActionsTriggerId={SEARCH_EMBEDDABLE_CELL_ACTIONS_TRIGGER_ID}
       columnsMeta={columnsMeta}
+      configHeaderRowHeight={defaults.headerRowHeight}
+      configRowHeight={defaults.rowHeight}
       headerRowHeightState={savedSearch.headerRowHeight}
+      rowHeightState={savedSearch.rowHeight}
       isPlainRecord={isEsql}
       loadingState={Boolean(loading) ? DataLoadingState.loading : DataLoadingState.loaded}
       maxAllowedSampleSize={getMaxAllowedSampleSize(discoverServices.uiSettings)}
       query={savedSearch.searchSource.getField('query')}
-      rowHeightState={savedSearch.rowHeight}
       savedSearchId={savedSearchId}
       searchTitle={panelTitle || savedSearchTitle}
       services={discoverServices}

src/plugins/discover/public/embeddable/get_search_embeddable_defaults.ts

@@ -0,0 +1,30 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import type { IUiSettingsClient } from '@kbn/core/public';
+import { ROW_HEIGHT_OPTION, SAMPLE_SIZE_SETTING } from '@kbn/discover-utils';
+import { getDefaultRowsPerPage } from '../../common/constants';
+import { DEFAULT_HEADER_ROW_HEIGHT_LINES } from './constants';
+
+export interface SearchEmbeddableDefaults {
+  rowHeight: number | undefined;
+  headerRowHeight: number | undefined;
+  rowsPerPage: number | undefined;
+  sampleSize: number | undefined;
+}
+
+export const getSearchEmbeddableDefaults = (
+  uiSettings: IUiSettingsClient
+): SearchEmbeddableDefaults => {
+  return {
+    rowHeight: uiSettings.get(ROW_HEIGHT_OPTION),
+    headerRowHeight: DEFAULT_HEADER_ROW_HEIGHT_LINES,
+    rowsPerPage: getDefaultRowsPerPage(uiSettings),
+    sampleSize: uiSettings.get(SAMPLE_SIZE_SETTING),
+  };
+};

src/plugins/discover/public/embeddable/initialize_search_embeddable_api.tsx

@@ -12,7 +12,6 @@ import { BehaviorSubject, combineLatest, map, Observable, skip } from 'rxjs';
 
 import { ISearchSource, SerializedSearchSourceFields } from '@kbn/data-plugin/common';
 import { DataView } from '@kbn/data-views-plugin/common';
-import { ROW_HEIGHT_OPTION, SAMPLE_SIZE_SETTING } from '@kbn/discover-utils';
 import { DataTableRecord } from '@kbn/discover-utils/types';
 import type {
   PublishesDataViews,
@@ -24,9 +23,9 @@ import { SortOrder, VIEW_MODE } from '@kbn/saved-search-plugin/public';
 import { DataTableColumnsMeta } from '@kbn/unified-data-table';
 
 import { AggregateQuery, Filter, Query } from '@kbn/es-query';
-import { getDefaultRowsPerPage } from '../../common/constants';
 import { DiscoverServices } from '../build_services';
-import { DEFAULT_HEADER_ROW_HEIGHT_LINES, EDITABLE_SAVED_SEARCH_KEYS } from './constants';
+import { EDITABLE_SAVED_SEARCH_KEYS } from './constants';
+import { getSearchEmbeddableDefaults } from './get_search_embeddable_defaults';
 import {
   PublishesSavedSearch,
   SearchEmbeddableRuntimeState,
@@ -85,14 +84,16 @@ export const initializeSearchEmbeddableApi = async (
   const searchSource$ = new BehaviorSubject<ISearchSource>(searchSource);
   const dataViews = new BehaviorSubject<DataView[] | undefined>(dataView ? [dataView] : undefined);
 
+  const defaults = getSearchEmbeddableDefaults(discoverServices.uiSettings);
+
   /** This is the state that can be initialized from the saved initial state */
   const columns$ = new BehaviorSubject<string[] | undefined>(initialState.columns);
   const grid$ = new BehaviorSubject<DiscoverGridSettings | undefined>(initialState.grid);
+  const headerRowHeight$ = new BehaviorSubject<number | undefined>(initialState.headerRowHeight);
   const rowHeight$ = new BehaviorSubject<number | undefined>(initialState.rowHeight);
   const rowsPerPage$ = new BehaviorSubject<number | undefined>(initialState.rowsPerPage);
-  const headerRowHeight$ = new BehaviorSubject<number | undefined>(initialState.headerRowHeight);
-  const sort$ = new BehaviorSubject<SortOrder[] | undefined>(initialState.sort);
   const sampleSize$ = new BehaviorSubject<number | undefined>(initialState.sampleSize);
+  const sort$ = new BehaviorSubject<SortOrder[] | undefined>(initialState.sort);
   const savedSearchViewMode$ = new BehaviorSubject<VIEW_MODE | undefined>(initialState.viewMode);
 
   /**
@@ -112,10 +113,6 @@ export const initializeSearchEmbeddableApi = async (
   const columnsMeta$ = new BehaviorSubject<DataTableColumnsMeta | undefined>(undefined);
   const totalHitCount$ = new BehaviorSubject<number | undefined>(undefined);
 
-  const defaultRowHeight = discoverServices.uiSettings.get(ROW_HEIGHT_OPTION);
-  const defaultRowsPerPage = getDefaultRowsPerPage(discoverServices.uiSettings);
-  const defaultSampleSize = discoverServices.uiSettings.get(SAMPLE_SIZE_SETTING);
-
   /**
    * The state manager is used to modify the state of the saved search - this should never be
    * treated as the source of truth
@@ -175,22 +172,22 @@ export const initializeSearchEmbeddableApi = async (
       sampleSize: [
         sampleSize$,
         (value) => sampleSize$.next(value),
-        (a, b) => (a ?? defaultSampleSize) === (b ?? defaultSampleSize),
+        (a, b) => (a ?? defaults.sampleSize) === (b ?? defaults.sampleSize),
       ],
       rowsPerPage: [
         rowsPerPage$,
         (value) => rowsPerPage$.next(value),
-        (a, b) => (a ?? defaultRowsPerPage) === (b ?? defaultRowsPerPage),
+        (a, b) => (a ?? defaults.rowsPerPage) === (b ?? defaults.rowsPerPage),
       ],
       rowHeight: [
         rowHeight$,
         (value) => rowHeight$.next(value),
-        (a, b) => (a ?? defaultRowHeight) === (b ?? defaultRowHeight),
+        (a, b) => (a ?? defaults.rowHeight) === (b ?? defaults.rowHeight),
       ],
       headerRowHeight: [
         headerRowHeight$,
         (value) => headerRowHeight$.next(value),
-        (a, b) => (a ?? DEFAULT_HEADER_ROW_HEIGHT_LINES) === (b ?? DEFAULT_HEADER_ROW_HEIGHT_LINES),
+        (a, b) => (a ?? defaults.headerRowHeight) === (b ?? defaults.headerRowHeight),
       ],
 
       /** The following can't currently be changed from the dashboard */

test/functional/apps/discover/group2_data_grid3/_data_grid_pagination.ts

@@ -30,6 +30,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
   const retry = getService('retry');
   const security = getService('security');
   const dashboardAddPanel = getService('dashboardAddPanel');
+  const dashboardPanelActions = getService('dashboardPanelActions');
 
   describe('discover data grid pagination', function describeIndexTests() {
     before(async () => {
@@ -126,6 +127,23 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
       await PageObjects.discover.waitUntilSearchingHasFinished();
       expect((await dataGrid.getDocTableRows()).length).to.be(10); // as in the saved search
       await dataGrid.checkCurrentRowsPerPageToBe(10);
+
+      // should use "rowsPerPage" form the saved search on dashboard
+      await PageObjects.common.navigateToApp('dashboard');
+      await PageObjects.dashboard.clickNewDashboard();
+      await PageObjects.timePicker.setDefaultAbsoluteRange();
+      await dashboardAddPanel.clickOpenAddPanel();
+      await dashboardAddPanel.addSavedSearch(savedSearchTitle);
+      await PageObjects.header.waitUntilLoadingHasFinished();
+      expect((await dataGrid.getDocTableRows()).length).to.be(10); // as in the saved search
+      await dataGrid.checkCurrentRowsPerPageToBe(10);
+
+      // should use "rowsPerPage" form settings by default on dashboard
+      await dashboardPanelActions.removePanelByTitle(savedSearchTitle);
+      await dashboardAddPanel.addSavedSearch('A Saved Search');
+      await PageObjects.header.waitUntilLoadingHasFinished();
+      expect((await dataGrid.getDocTableRows()).length).to.be(6); // as in settings
+      await dataGrid.checkCurrentRowsPerPageToBe(6);
     });
 
     it('should not split ES|QL results into pages', async () => {