From b2aff968f92e8f8b571cb29fcf080cf2d0468301 Mon Sep 17 00:00:00 2001 From: Milton Hultgren Date: Fri, 3 Sep 2021 11:28:55 +0200 Subject: [PATCH 1/4] [Observability] [Timelines] Add page size option to standalone t_grid (#110748) --- .../observability/public/pages/alerts/alerts_table_t_grid.tsx | 3 ++- .../timelines/public/components/t_grid/standalone/index.tsx | 4 +++- 2 files changed, 5 insertions(+), 2 deletions(-) diff --git a/x-pack/plugins/observability/public/pages/alerts/alerts_table_t_grid.tsx b/x-pack/plugins/observability/public/pages/alerts/alerts_table_t_grid.tsx index 2d325b6f3f7c4..99cf088600ad6 100644 --- a/x-pack/plugins/observability/public/pages/alerts/alerts_table_t_grid.tsx +++ b/x-pack/plugins/observability/public/pages/alerts/alerts_table_t_grid.tsx @@ -370,7 +370,8 @@ export function AlertsTableTGrid(props: AlertsTableTGridProps) { filters: [], hasAlertsCrudPermissions, indexNames, - itemsPerPageOptions: [10, 25, 50], + itemsPerPage: 10, + itemsPerPageOptions: [], loadingText: i18n.translate('xpack.observability.alertsTable.loadingTextLabel', { defaultMessage: 'loading alerts', }), diff --git a/x-pack/plugins/timelines/public/components/t_grid/standalone/index.tsx b/x-pack/plugins/timelines/public/components/t_grid/standalone/index.tsx index ee9b7be48df63..bca21c86f6cc0 100644 --- a/x-pack/plugins/timelines/public/components/t_grid/standalone/index.tsx +++ b/x-pack/plugins/timelines/public/components/t_grid/standalone/index.tsx @@ -103,6 +103,7 @@ export interface TGridStandaloneProps { }) => boolean; height?: number; indexNames: string[]; + itemsPerPage: number; itemsPerPageOptions: number[]; query: Query; onRuleChange?: () => void; @@ -134,6 +135,7 @@ const TGridStandaloneComponent: React.FC = ({ filterStatus, hasAlertsCrudPermissions, indexNames, + itemsPerPage, itemsPerPageOptions, onRuleChange, query, @@ -310,7 +312,7 @@ const TGridStandaloneComponent: React.FC = ({ end, }, indexNames, - itemsPerPage: itemsPerPageStore, + itemsPerPage, itemsPerPageOptions, showCheckboxes: true, }) From 1ceb8a170c78bed6ea492a828665c1e9d3e8366e Mon Sep 17 00:00:00 2001 From: Milton Hultgren Date: Fri, 3 Sep 2021 11:33:47 +0200 Subject: [PATCH 2/4] [Observabilty] [Timelines] Export t_grid component props helper (#110758) --- .../public/pages/alerts/alerts_table_t_grid.tsx | 9 +++++++-- x-pack/plugins/timelines/public/index.ts | 2 +- 2 files changed, 8 insertions(+), 3 deletions(-) diff --git a/x-pack/plugins/observability/public/pages/alerts/alerts_table_t_grid.tsx b/x-pack/plugins/observability/public/pages/alerts/alerts_table_t_grid.tsx index 99cf088600ad6..89adc1291ce09 100644 --- a/x-pack/plugins/observability/public/pages/alerts/alerts_table_t_grid.tsx +++ b/x-pack/plugins/observability/public/pages/alerts/alerts_table_t_grid.tsx @@ -46,7 +46,12 @@ import { getAlertsPermissions, useGetUserAlertsPermissions, } from '../../hooks/use_alert_permission'; -import type { TimelinesUIStart, TGridType, SortDirection } from '../../../../timelines/public'; +import type { + TimelinesUIStart, + GetTGridProps, + TGridType, + SortDirection, +} from '../../../../timelines/public'; import { useStatusBulkActionItems } from '../../../../timelines/public'; import type { TopAlert } from './'; import { useKibana } from '../../../../../../src/plugins/kibana_react/public'; @@ -401,7 +406,7 @@ export function AlertsTableTGrid(props: AlertsTableTGridProps) { values: { totalAlerts }, defaultMessage: '{totalAlerts, plural, =1 {alert} other {alerts}}', }), - }; + } as GetTGridProps; }, [ casePermissions, addToQuery, diff --git a/x-pack/plugins/timelines/public/index.ts b/x-pack/plugins/timelines/public/index.ts index 2096415867682..19c2ef023510a 100644 --- a/x-pack/plugins/timelines/public/index.ts +++ b/x-pack/plugins/timelines/public/index.ts @@ -28,7 +28,7 @@ export type { export { Direction } from '../common/search_strategy/common'; export { tGridReducer } from './store/t_grid/reducer'; export type { TGridModelForTimeline, TimelineState, TimelinesUIStart } from './types'; -export { TGridType, SortDirection } from './types'; +export { TGridType, GetTGridProps, SortDirection } from './types'; export { ARIA_COLINDEX_ATTRIBUTE, ARIA_ROWINDEX_ATTRIBUTE, From 003150b32fc01810cc0399ebf49c6877bfdc0744 Mon Sep 17 00:00:00 2001 From: Milton Hultgren Date: Fri, 3 Sep 2021 12:47:31 +0200 Subject: [PATCH 3/4] [Observability] [Timelines] Fix tests and types (#110758) --- x-pack/test/functional/apps/observability/alerts/index.ts | 2 +- .../timelines_test/public/applications/timelines_test/index.tsx | 1 + 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/x-pack/test/functional/apps/observability/alerts/index.ts b/x-pack/test/functional/apps/observability/alerts/index.ts index ae60eff1859ba..85c47d48c6cd6 100644 --- a/x-pack/test/functional/apps/observability/alerts/index.ts +++ b/x-pack/test/functional/apps/observability/alerts/index.ts @@ -46,7 +46,7 @@ export default ({ getPageObjects, getService }: FtrProviderContext) => { it('Renders the correct number of cells', async () => { // NOTE: This isn't ideal, but EuiDataGrid doesn't really have the concept of "rows" const cells = await testSubjects.findAll('dataGridRowCell'); - expect(cells.length).to.be(54); + expect(cells.length).to.be(10); }); }); }); diff --git a/x-pack/test/plugin_functional/plugins/timelines_test/public/applications/timelines_test/index.tsx b/x-pack/test/plugin_functional/plugins/timelines_test/public/applications/timelines_test/index.tsx index adc10ae0a4161..39cb89c886ac1 100644 --- a/x-pack/test/plugin_functional/plugins/timelines_test/public/applications/timelines_test/index.tsx +++ b/x-pack/test/plugin_functional/plugins/timelines_test/public/applications/timelines_test/index.tsx @@ -76,6 +76,7 @@ const AppRoot = React.memo( footerText: 'Events', filters: [], hasAlertsCrudPermissions, + itemsPerPage: 50, itemsPerPageOptions: [1, 2, 3], loadingText: 'Loading events', renderCellValue: () =>
test
, From 37a3a5e7d81d51127a06167773e93d1330b8aa66 Mon Sep 17 00:00:00 2001 From: Milton Hultgren Date: Tue, 7 Sep 2021 14:38:11 +0200 Subject: [PATCH 4/4] [Observability] Add comment about alerts table page size limit (#110758) --- .../observability/public/pages/alerts/alerts_table_t_grid.tsx | 2 ++ 1 file changed, 2 insertions(+) diff --git a/x-pack/plugins/observability/public/pages/alerts/alerts_table_t_grid.tsx b/x-pack/plugins/observability/public/pages/alerts/alerts_table_t_grid.tsx index 89adc1291ce09..9a7536ec403f3 100644 --- a/x-pack/plugins/observability/public/pages/alerts/alerts_table_t_grid.tsx +++ b/x-pack/plugins/observability/public/pages/alerts/alerts_table_t_grid.tsx @@ -375,6 +375,8 @@ export function AlertsTableTGrid(props: AlertsTableTGridProps) { filters: [], hasAlertsCrudPermissions, indexNames, + // Limited to 10 to work around performance issues as described in + // https://github.com/elastic/kibana/issues/110758 itemsPerPage: 10, itemsPerPageOptions: [], loadingText: i18n.translate('xpack.observability.alertsTable.loadingTextLabel', {