Skip to content

Commit

Permalink
[Discover] Make footer visible under Document Explorer if sample size…
Browse files Browse the repository at this point in the history
… is less than hits number (#134231)

* [Discover] Make footer visible under Document Explorer if sample size is less than hits number

* [Discover] Simplify changes diff

* [Discover] Update copy

* [Discover] Update copy id

* [Discover] Remove other translations

* [Discover] Add link to Advanced settings and tests

Co-authored-by: Kibana Machine <[email protected]>
  • Loading branch information
jughosta and kibanamachine authored Jun 17, 2022
1 parent 2aac7f9 commit 28915d2
Show file tree
Hide file tree
Showing 7 changed files with 132 additions and 38 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,21 @@
font-size: $euiFontSizeS;
}

.dscDiscoverGrid__inner {
display: flex;
flex-direction: column;
flex-wrap: nowrap;
height: 100%;
}

.dscDiscoverGrid__table {
flex-grow: 1;
flex-shrink: 1;
min-height: 0;
}

.dscDiscoverGrid__footer {
flex-shrink: 0;
background-color: $euiColorLightShade;
padding: $euiSize / 2 $euiSize;
margin-top: $euiSize / 4;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@
*/

import React, { useCallback, useMemo, useState, useRef } from 'react';
import classnames from 'classnames';
import { FormattedMessage } from '@kbn/i18n-react';
import './discover_grid.scss';
import {
Expand All @@ -19,6 +20,7 @@ import {
EuiLoadingSpinner,
EuiIcon,
EuiDataGridRefProps,
EuiLink,
} from '@elastic/eui';
import type { DataView } from '@kbn/data-views-plugin/public';
import { flattenHit } from '@kbn/data-plugin/public';
Expand All @@ -42,6 +44,7 @@ import {
import { getDisplayedColumns } from '../../utils/columns';
import {
DOC_HIDE_TIME_COLUMN_SETTING,
SAMPLE_SIZE_SETTING,
MAX_DOC_FIELDS_DISPLAYED,
SHOW_MULTIFIELDS,
} from '../../../common';
Expand Down Expand Up @@ -484,44 +487,57 @@ export const DiscoverGrid = ({
valueToStringConverter,
}}
>
<span
data-test-subj="discoverDocTable"
data-render-complete={!isLoading}
data-shared-item=""
data-title={searchTitle}
data-description={searchDescription}
data-document-number={displayedRows.length}
className={className}
>
<EuiDataGridMemoized
aria-describedby={randomId}
aria-labelledby={ariaLabelledBy}
columns={euiGridColumns}
columnVisibility={columnsVisibility}
data-test-subj="docTable"
leadingControlColumns={lead}
onColumnResize={onResize}
pagination={paginationObj}
renderCellValue={renderCellValue}
ref={dataGridRef}
rowCount={rowCount}
schemaDetectors={schemaDetectors}
sorting={sorting as EuiDataGridSorting}
toolbarVisibility={toolbarVisibility}
rowHeightsOptions={rowHeightsOptions}
gridStyle={GRID_STYLE}
/>

<span className="dscDiscoverGrid__inner">
<div
data-test-subj="discoverDocTable"
data-render-complete={!isLoading}
data-shared-item=""
data-title={searchTitle}
data-description={searchDescription}
data-document-number={displayedRows.length}
className={classnames(className, 'dscDiscoverGrid__table')}
>
<EuiDataGridMemoized
aria-describedby={randomId}
aria-labelledby={ariaLabelledBy}
columns={euiGridColumns}
columnVisibility={columnsVisibility}
data-test-subj="docTable"
leadingControlColumns={lead}
onColumnResize={onResize}
pagination={paginationObj}
renderCellValue={renderCellValue}
ref={dataGridRef}
rowCount={rowCount}
schemaDetectors={schemaDetectors}
sorting={sorting as EuiDataGridSorting}
toolbarVisibility={toolbarVisibility}
rowHeightsOptions={rowHeightsOptions}
gridStyle={GRID_STYLE}
/>
</div>
{showDisclaimer && (
<p className="dscDiscoverGrid__footer">
<p className="dscDiscoverGrid__footer" data-test-subj="discoverTableFooter">
<FormattedMessage
id="discover.howToSeeOtherMatchingDocumentsDescriptionGrid"
defaultMessage="These are the first {sampleSize} documents matching your search, refine your search to see others."
values={{ sampleSize }}
id="discover.gridSampleSize.description"
defaultMessage="You're viewing the first {sampleSize} documents that match your search. To change this value, go to {advancedSettingsLink}."
values={{
sampleSize,
advancedSettingsLink: (
<EuiLink
href={services.addBasePath(
`/app/management/kibana/settings?query=${SAMPLE_SIZE_SETTING}`
)}
data-test-subj="discoverTableSampleSizeSettingsLink"
>
<FormattedMessage
id="discover.gridSampleSize.advancedSettingsLinkLabel"
defaultMessage="Advanced Settings"
/>
</EuiLink>
),
}}
/>
<a href={`#${ariaLabelledBy}`}>
<FormattedMessage id="discover.backToTopLinkText" defaultMessage="Back to top." />
</a>
</p>
)}
{searchTitle && (
Expand Down
66 changes: 66 additions & 0 deletions test/functional/apps/discover/_data_grid_pagination.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,66 @@
/*
* 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 expect from '@kbn/expect';
import { FtrProviderContext } from '../../ftr_provider_context';

export default function ({ getService, getPageObjects }: FtrProviderContext) {
const esArchiver = getService('esArchiver');
const kibanaServer = getService('kibanaServer');
const dataGrid = getService('dataGrid');
const PageObjects = getPageObjects(['settings', 'common', 'discover', 'header', 'timePicker']);
const defaultSettings = { defaultIndex: 'logstash-*', 'doc_table:legacy': false };
const testSubjects = getService('testSubjects');
const retry = getService('retry');

describe('discover data grid pagination', function describeIndexTests() {
before(async () => {
await esArchiver.loadIfNeeded('test/functional/fixtures/es_archiver/logstash_functional');
await kibanaServer.importExport.load('test/functional/fixtures/kbn_archiver/discover');
});

after(async () => {
await kibanaServer.importExport.unload('test/functional/fixtures/kbn_archiver/discover');
await kibanaServer.uiSettings.replace({});
});

beforeEach(async function () {
await PageObjects.timePicker.setDefaultAbsoluteRangeViaUiSettings();
await kibanaServer.uiSettings.update(defaultSettings);
await PageObjects.common.navigateToApp('discover');
await PageObjects.discover.waitUntilSearchingHasFinished();
});

it('should show pagination', async () => {
const rows = await dataGrid.getDocTableRows();
expect(rows.length).to.be.above(0);
// pagination is present
await testSubjects.existOrFail('pagination-button-0'); // first page
await testSubjects.existOrFail('pagination-button-4'); // last page
await testSubjects.missingOrFail('pagination-button-5');
});

it('should show footer only for the last page', async () => {
// footer is not shown
await testSubjects.missingOrFail('discoverTableFooter');
// go to next page
await testSubjects.click('pagination-button-next');
// footer is not shown yet
await retry.try(async function () {
await testSubjects.missingOrFail('discoverTableFooter');
});
// go to the last page
await testSubjects.click('pagination-button-4');
// footer is shown now
await retry.try(async function () {
await testSubjects.existOrFail('discoverTableFooter');
await testSubjects.existOrFail('discoverTableSampleSizeSettingsLink');
});
});
});
}
1 change: 1 addition & 0 deletions test/functional/apps/discover/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -53,6 +53,7 @@ export default function ({ getService, loadTestFile }: FtrProviderContext) {
loadTestFile(require.resolve('./_data_grid_row_navigation'));
loadTestFile(require.resolve('./_data_grid_doc_table'));
loadTestFile(require.resolve('./_data_grid_copy_to_clipboard'));
loadTestFile(require.resolve('./_data_grid_pagination'));
loadTestFile(require.resolve('./_indexpattern_with_unmapped_fields'));
loadTestFile(require.resolve('./_runtime_fields_editor'));
loadTestFile(require.resolve('./_huge_fields'));
Expand Down
1 change: 0 additions & 1 deletion x-pack/plugins/translations/translations/fr-FR.json
Original file line number Diff line number Diff line change
Expand Up @@ -2952,7 +2952,6 @@
"discover.hitCountSpinnerAriaLabel": "Nombre final de résultats toujours en chargement",
"discover.hitsPluralTitle": "{formattedHits} {hits, plural, one {résultat} other {résultats}}",
"discover.howToSeeOtherMatchingDocumentsDescription": "Voici les {sampleSize} premiers documents correspondant à votre recherche. Veuillez affiner celle-ci pour en voir plus.",
"discover.howToSeeOtherMatchingDocumentsDescriptionGrid": "Voici les {sampleSize} premiers documents correspondant à votre recherche. Veuillez affiner celle-ci pour en voir plus.",
"discover.inspectorRequestDataTitleChart": "Données du graphique",
"discover.inspectorRequestDataTitleDocuments": "Documents",
"discover.inspectorRequestDataTitleTotalHits": "Nombre total de résultats",
Expand Down
1 change: 0 additions & 1 deletion x-pack/plugins/translations/translations/ja-JP.json
Original file line number Diff line number Diff line change
Expand Up @@ -3046,7 +3046,6 @@
"discover.hitCountSpinnerAriaLabel": "読み込み中の最終一致件数",
"discover.hitsPluralTitle": "{formattedHits} {hits, plural, other {一致}}",
"discover.howToSeeOtherMatchingDocumentsDescription": "これらは検索条件に一致した初めの {sampleSize} 件のドキュメントです。他の結果を表示するには検索条件を絞ってください。",
"discover.howToSeeOtherMatchingDocumentsDescriptionGrid": "これらは検索条件に一致した初めの {sampleSize} 件のドキュメントです。他の結果を表示するには検索条件を絞ってください。",
"discover.inspectorRequestDataTitleChart": "グラフデータ",
"discover.inspectorRequestDataTitleDocuments": "ドキュメント",
"discover.inspectorRequestDataTitleTotalHits": "総ヒット数",
Expand Down
1 change: 0 additions & 1 deletion x-pack/plugins/translations/translations/zh-CN.json
Original file line number Diff line number Diff line change
Expand Up @@ -3056,7 +3056,6 @@
"discover.hitCountSpinnerAriaLabel": "最终命中计数仍在加载",
"discover.hitsPluralTitle": "{formattedHits} 个{hits, plural, other {命中}}",
"discover.howToSeeOtherMatchingDocumentsDescription": "下面是与您的搜索匹配的前 {sampleSize} 个文档,请优化您的搜索以查看其他文档。",
"discover.howToSeeOtherMatchingDocumentsDescriptionGrid": "下面是与您的搜索匹配的前 {sampleSize} 个文档,请优化您的搜索以查看其他文档。",
"discover.inspectorRequestDataTitleChart": "图表数据",
"discover.inspectorRequestDataTitleDocuments": "文档",
"discover.inspectorRequestDataTitleTotalHits": "总命中数",
Expand Down

0 comments on commit 28915d2

Please sign in to comment.