Skip to content

Commit

Permalink
Show total hit count and pass services in embeddable
Browse files Browse the repository at this point in the history
Signed-off-by: Ashwin P Chandran <[email protected]>
  • Loading branch information
ashwin-pc committed Feb 2, 2024
1 parent f0ff842 commit c5ff6ca
Show file tree
Hide file tree
Showing 8 changed files with 56 additions and 43 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -21,8 +21,6 @@ import { SAMPLE_SIZE_SETTING } from '../../../../common';
import { LegacyDiscoverTable } from '../default_discover_table/default_discover_table';
import { toolbarVisibility } from './constants';
import { getDataGridTableSetting } from '../utils/local_storage';
import { Storage } from '../../../../../opensearch_dashboards_utils/public';

export interface DataGridTableProps {
columns: string[];
indexPattern: IndexPattern;
Expand All @@ -31,6 +29,7 @@ export interface DataGridTableProps {
onRemoveColumn: (column: string) => void;
onReorderColumn: (col: string, source: number, destination: number) => void;
onSort: (sort: SortOrder[]) => void;
hits?: number;
rows: OpenSearchSearchHit[];
onSetColumns: (columns: string[]) => void;
sort: SortOrder[];
Expand All @@ -40,7 +39,6 @@ export interface DataGridTableProps {
isToolbarVisible?: boolean;
isContextView?: boolean;
isLoading?: boolean;
storage: Storage;
showPagination?: boolean;
}

Expand All @@ -54,14 +52,14 @@ export const DataGridTable = ({
onSetColumns,
onSort,
sort,
hits,
rows,
displayTimeColumn,
title = '',
description = '',
isToolbarVisible = true,
isContextView = false,
isLoading = false,
storage,
showPagination,
}: DataGridTableProps) => {
const { services } = useOpenSearchDashboards<DiscoverServices>();
Expand Down Expand Up @@ -146,13 +144,14 @@ export const DataGridTable = ({
];
}, []);

const datagridActive = getDataGridTableSetting(storage);
const datagridActive = getDataGridTableSetting(services.storage);

const legacyDiscoverTable = useMemo(
() => (
<LegacyDiscoverTable
displayedTableColumns={displayedTableColumns}
columns={adjustedColumns}
hits={hits}
rows={rows}
indexPattern={indexPattern}
sortOrder={sortingColumns}
Expand All @@ -169,6 +168,7 @@ export const DataGridTable = ({
[
displayedTableColumns,
adjustedColumns,
hits,
rows,
indexPattern,
sortingColumns,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,7 @@ import { Pagination } from './pagination';
export interface DefaultDiscoverTableProps {
displayedTableColumns: EuiDataGridColumn[];
columns: string[];
hits?: number;
rows: OpenSearchSearchHit[];
indexPattern: IndexPattern;
sortOrder: Array<{
Expand All @@ -42,6 +43,7 @@ export interface DefaultDiscoverTableProps {
export const LegacyDiscoverTable = ({
displayedTableColumns,
columns,
hits,
rows,
indexPattern,
sortOrder,
Expand Down Expand Up @@ -117,7 +119,8 @@ export const LegacyDiscoverTable = ({
goToPage={goToPage}
startItem={currentRowCounts.startRow + 1}
endItem={currentRowCounts.endRow}
totalItems={rows.length}
totalItems={hits}
sampleSize={sampleSize}
/>
) : null}
<table data-test-subj="docTable" className="osd-table table">
Expand Down Expand Up @@ -180,7 +183,8 @@ export const LegacyDiscoverTable = ({
goToPage={goToPage}
startItem={currentRowCounts.startRow + 1}
endItem={currentRowCounts.endRow}
totalItems={rows.length}
totalItems={hits}
sampleSize={sampleSize}
/>
) : null}
</div>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
* SPDX-License-Identifier: Apache-2.0
*/

import { EuiFlexGroup, EuiFlexItem, EuiPagination } from '@elastic/eui';
import { EuiFlexGroup, EuiFlexItem, EuiPagination, EuiTextColor } from '@elastic/eui';
import React from 'react';
import { FormattedMessage } from '@osd/i18n/react';
import './_pagination.scss';
Expand All @@ -14,7 +14,8 @@ interface Props {
goToPage: (page: number) => void;
startItem: number;
endItem: number;
totalItems: number;
totalItems?: number;
sampleSize: number;
}

export const Pagination = ({
Expand All @@ -23,10 +24,22 @@ export const Pagination = ({
goToPage,
startItem,
endItem,
totalItems,
totalItems = 0,
sampleSize,
}: Props) => {
return (
<EuiFlexGroup className="osdDocTable_pagination" alignItems="center" justifyContent="flexEnd">
{endItem >= sampleSize && (
<EuiFlexItem grow={false}>
<EuiTextColor color="subdued">
<FormattedMessage
id="discover.docTable.limitedSearchResultLabel"
defaultMessage="Limited to {sampleSize} results. Refine your search."
values={{ sampleSize }}
/>
</EuiTextColor>
</EuiFlexItem>
)}
<EuiFlexItem grow={false}>
<FormattedMessage
id="discover.docTable.pagerControl.pagesCountLabel"
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,7 @@ export function ContextApp({
appState,
}: Props) {
const { services } = useOpenSearchDashboards<DiscoverViewServices>();
const { uiSettings, storage } = services;
const { uiSettings } = services;
const defaultStepSize = useMemo(() => parseInt(uiSettings.get(CONTEXT_STEP_SETTING), 10), [
uiSettings,
]);
Expand Down Expand Up @@ -110,7 +110,6 @@ export function ContextApp({
displayTimeColumn={displayTimeColumn}
isToolbarVisible={false}
isContextView={true}
storage={storage}
/>
</div>
<ActionBar
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
* SPDX-License-Identifier: Apache-2.0
*/

import React, { useCallback, useMemo, useState, useEffect } from 'react';
import React, { useCallback, useMemo } from 'react';
import { DiscoverViewServices } from '../../../build_services';
import { useOpenSearchDashboards } from '../../../../../opensearch_dashboards_react/public';
import { DataGridTable } from '../../components/data_grid/data_grid_table';
Expand Down Expand Up @@ -37,7 +37,6 @@ export const DiscoverTable = ({ rows }: Props) => {
},
capabilities,
indexPatterns,
storage,
} = services;

const { refetch$, indexPattern, savedSearch } = useDiscoverContext();
Expand Down Expand Up @@ -115,7 +114,6 @@ export const DiscoverTable = ({ rows }: Props) => {
displayTimeColumn={displayTimeColumn}
title={savedSearch?.id ? savedSearch.title : ''}
description={savedSearch?.id ? savedSearch.description : ''}
storage={storage}
/>
);
};
Original file line number Diff line number Diff line change
Expand Up @@ -29,18 +29,17 @@
*/

import { IndexPattern } from '../../../opensearch_dashboards_services';
import { SortOrder } from '../../../saved_searches/types';
// @ts-ignore
import { isSortable } from './get_sort';

export type SortOrder = [string, string];

/**
* use in case the user didn't manually sort.
* the default sort is returned depending of the index pattern
*/
export function getDefaultSort(
indexPattern: IndexPattern,
defaultSortOrder: string = 'desc'
defaultSortOrder: 'asc' | 'desc' = 'desc'
): SortOrder[] {
if (indexPattern.timeFieldName && isSortable(indexPattern.timeFieldName, indexPattern)) {
return [[indexPattern.timeFieldName, defaultSortOrder]];
Expand Down
4 changes: 2 additions & 2 deletions src/plugins/discover/public/embeddable/search_embeddable.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -84,7 +84,7 @@ export interface SearchProps {
onFilter?: (field: IFieldType, value: string[], operator: string) => void;
rows?: any[];
indexPattern?: IndexPattern;
totalHitCount?: number;
hits?: number;
isLoading?: boolean;
displayTimeColumn?: boolean;
services: DiscoverServices;
Expand Down Expand Up @@ -360,7 +360,7 @@ export class SearchEmbeddable
inspectorRequest.stats(getResponseInspectorStats(resp, searchSource)).ok({ json: resp });

this.searchProps!.rows = resp.hits.hits;
this.searchProps!.totalHitCount = resp.hits.total;
this.searchProps!.hits = resp.hits.total;
this.searchProps!.isLoading = false;
} catch (error) {
this.updateOutput({ loading: false, error });
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -14,20 +14,19 @@ import {
import { VisualizationNoResults } from '../../../visualizations/public';
import { getServices } from '../opensearch_dashboards_services';
import './search_embeddable.scss';
import { OpenSearchDashboardsContextProvider } from '../../../opensearch_dashboards_react/public';

interface SearchEmbeddableProps {
searchProps: SearchProps;
}
export interface DiscoverEmbeddableProps extends DataGridTableProps {
totalHitCount: number;
}
export type DiscoverEmbeddableProps = DataGridTableProps;

export const DataGridTableMemoized = React.memo((props: DataGridTableProps) => (
<DataGridTable {...props} />
));

export function SearchEmbeddableComponent({ searchProps }: SearchEmbeddableProps) {
const { storage } = getServices();
const services = getServices();
const discoverEmbeddableProps = {
columns: searchProps.columns,
indexPattern: searchProps.indexPattern,
Expand All @@ -41,32 +40,33 @@ export function SearchEmbeddableComponent({ searchProps }: SearchEmbeddableProps
sort: searchProps.sort,
displayTimeColumn: searchProps.displayTimeColumn,
services: searchProps.services,
totalHitCount: searchProps.totalHitCount,
hits: searchProps.hits,
title: searchProps.title,
description: searchProps.description,
storage,
showPagination: true,
} as DiscoverEmbeddableProps;

return (
<I18nProvider>
<EuiFlexGroup
gutterSize="xs"
direction="column"
responsive={false}
data-test-subj="embeddedSavedSearchDocTable"
className="eui-xScrollWithShadows eui-yScrollWithShadows"
>
{discoverEmbeddableProps.totalHitCount !== 0 ? (
<EuiFlexItem style={{ minHeight: 0 }} className="osdDocTable__container">
<DataGridTableMemoized {...discoverEmbeddableProps} />
</EuiFlexItem>
) : (
<EuiFlexItem>
<VisualizationNoResults />
</EuiFlexItem>
)}
</EuiFlexGroup>
<OpenSearchDashboardsContextProvider services={services}>
<EuiFlexGroup
gutterSize="xs"
direction="column"
responsive={false}
data-test-subj="embeddedSavedSearchDocTable"
className="eui-xScrollWithShadows eui-yScrollWithShadows"
>
{discoverEmbeddableProps.hits !== 0 ? (
<EuiFlexItem style={{ minHeight: 0 }} className="osdDocTable__container">
<DataGridTableMemoized {...discoverEmbeddableProps} />
</EuiFlexItem>
) : (
<EuiFlexItem>
<VisualizationNoResults />
</EuiFlexItem>
)}
</EuiFlexGroup>
</OpenSearchDashboardsContextProvider>
</I18nProvider>
);
}

0 comments on commit c5ff6ca

Please sign in to comment.