diff --git a/src/plugins/discover/public/application/components/data_grid/data_grid_table.tsx b/src/plugins/discover/public/application/components/data_grid/data_grid_table.tsx index 253ff88720cb..cebbb5b77513 100644 --- a/src/plugins/discover/public/application/components/data_grid/data_grid_table.tsx +++ b/src/plugins/discover/public/application/components/data_grid/data_grid_table.tsx @@ -160,19 +160,21 @@ export const DataGridTable = ({ onAddColumn={onAddColumn} onFilter={onFilter} onClose={() => setInspectedHit(undefined)} + sampleSize={pageSizeLimit} /> ), [ displayedTableColumns, adjustedColumns, + rows, indexPattern, - onAddColumn, + sortingColumns, onColumnSort, - onFilter, onRemoveColumn, onReorderColumn, - rows, - sortingColumns, + onAddColumn, + onFilter, + pageSizeLimit, ] ); diff --git a/src/plugins/discover/public/application/components/default_discover_table/default_discover_table.tsx b/src/plugins/discover/public/application/components/default_discover_table/default_discover_table.tsx index 13dedc01e5da..05fe7f5cdb33 100644 --- a/src/plugins/discover/public/application/components/default_discover_table/default_discover_table.tsx +++ b/src/plugins/discover/public/application/components/default_discover_table/default_discover_table.tsx @@ -6,7 +6,14 @@ import './_doc_table.scss'; import React, { useEffect, useRef, useState } from 'react'; -import { EuiDataGridColumn, EuiDataGridSorting } from '@elastic/eui'; +import { + EuiButtonEmpty, + EuiCallOut, + EuiDataGridColumn, + EuiDataGridSorting, + EuiProgress, +} from '@elastic/eui'; +import { FormattedMessage } from '@osd/i18n/react'; import { TableHeader } from './table_header'; import { DocViewFilterFn, OpenSearchSearchHit } from '../../doc_views/doc_views_types'; import { TableRow } from './table_rows'; @@ -27,6 +34,7 @@ export interface DefaultDiscoverTableProps { onAddColumn: (column: string) => void; onFilter: DocViewFilterFn; onClose: () => void; + sampleSize: number; } export const LegacyDiscoverTable = ({ @@ -41,6 +49,7 @@ export const LegacyDiscoverTable = ({ onAddColumn, onFilter, onClose, + sampleSize, }: DefaultDiscoverTableProps) => { const [renderedRowCount, setRenderedRowCount] = useState(50); // Start with 50 rows const observerRef = useRef(null); @@ -74,39 +83,59 @@ export const LegacyDiscoverTable = ({ return ( indexPattern && ( - - - - - - {rows.slice(0, renderedRowCount).map((row: OpenSearchSearchHit, index: number) => { - return ( - column.id)} - columns={columns} - indexPattern={indexPattern} - onRemoveColumn={onRemoveColumn} - onAddColumn={onAddColumn} - onFilter={onFilter} - onClose={onClose} - /> - ); - })} - {renderedRowCount < rows.length &&
} -
-
+ <> + + + + + + {rows.slice(0, renderedRowCount).map((row: OpenSearchSearchHit, index: number) => { + return ( + column.id)} + columns={columns} + indexPattern={indexPattern} + onRemoveColumn={onRemoveColumn} + onAddColumn={onAddColumn} + onFilter={onFilter} + onClose={onClose} + /> + ); + })} + +
+ {renderedRowCount < rows.length && ( +
+ +
+ )} + {rows.length === sampleSize && ( + + + + window.scrollTo(0, 0)}> + + + + )} + ) ); };