github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-24 17:59:23 -04:00
Code Issues Projects Releases Packages Wiki Activity

Workaround for sorting

Browse source
This commit is contained in:
Quynh Nguyen 2021-09-14 16:50:08 -05:00
parent 006aeadbcb
commit ae2c0c340f
4 changed files with 35 additions and 39 deletions
Download patch file Download diff file Expand all files Collapse all files

12
x-pack/plugins/data_visualizer/public/application/common/components/stats_table/components/field_data_row/distinct_values.tsx
View file

@ -5,15 +5,21 @@
* 2.0.
*/
import { EuiText } from '@elastic/eui';
import { EuiIcon, EuiText } from '@elastic/eui';
import React from 'react';
interface Props {
cardinality?: number;
showIcon?: boolean;
}
export const DistinctValues = ({ cardinality }: Props) => {
export const DistinctValues = ({ cardinality, showIcon }: Props) => {
if (cardinality === undefined) return null;
return <EuiText size={'xs'}>{cardinality}</EuiText>;
return (
<>
{showIcon ? <EuiIcon type="database" size={'m'} className={'columnHeaderIcon'} /> : null}
<EuiText size={'xs'}>{cardinality}</EuiText>
</>
);
};

17
x-pack/plugins/data_visualizer/public/application/common/components/stats_table/components/field_data_row/document_stats.tsx
View file

@ -5,14 +5,16 @@
* 2.0.
*/
import { EuiText } from '@elastic/eui';
import { EuiIcon, EuiText } from '@elastic/eui';
import React from 'react';
import type { FieldDataRowProps } from '../../types/field_data_row';
import { roundToDecimalPlace } from '../../../utils';
type Props = FieldDataRowProps;
export const DocumentStat = ({ config }: Props) => {
interface Props extends FieldDataRowProps {
showIcon?: boolean;
}
export const DocumentStat = ({ config, showIcon }: Props) => {
const { stats } = config;
if (stats === undefined) return null;
@ -22,8 +24,11 @@ export const DocumentStat = ({ config }: Props) => {
const docsPercent = roundToDecimalPlace((count / sampleCount) * 100);
return (
<EuiText size={'xs'}>
{count} ({docsPercent}%)
</EuiText>
<>
{showIcon ? <EuiIcon type="document" size={'m'} className={'columnHeaderIcon'} /> : null}
<EuiText size={'xs'}>
{count} ({docsPercent}%)
</EuiText>
</>
);
};

35
x-pack/plugins/data_visualizer/public/application/common/components/stats_table/data_visualizer_stats_table.tsx
View file

@ -194,19 +194,11 @@ export const DataVisualizerTable = <T extends DataVisualizerTableItem>({
},
{
field: 'docCount',
name: (
<div className={'columnHeaderTitle'}>
{dimensions.showIcons ? (
<EuiIcon type="document" className={'columnHeaderIcon'} />
) : null}
{i18n.translate('xpack.dataVisualizer.dataGrid.documentsCountColumnName', {
defaultMessage: 'Documents (%)',
})}
</div>
),
name: i18n.translate('xpack.dataVisualizer.dataGrid.documentsCountColumnName', {
defaultMessage: 'Documents (%)',
}),
render: (value: number | undefined, item: DataVisualizerTableItem) => (
<DocumentStat config={item} />
<DocumentStat config={item} showIcon={dimensions.showIcon} />
),
sortable: (item: DataVisualizerTableItem) => item?.stats?.count,
align: LEFT_ALIGNMENT as HorizontalAlignment,
@ -215,18 +207,11 @@ export const DataVisualizerTable = <T extends DataVisualizerTableItem>({
},
{
field: 'stats.cardinality',
name: (
<div className={'columnHeaderTitle'}>
{dimensions.showIcons ? (
<EuiIcon type="database" className={'columnHeaderIcon'} />
) : null}
{i18n.translate('xpack.dataVisualizer.dataGrid.distinctValuesColumnName', {
defaultMessage: 'Distinct values',
})}
</div>
),
render: (cardinality: number | undefined, item: DataVisualizerTableItem) => (
<DistinctValues cardinality={cardinality} />
name: i18n.translate('xpack.dataVisualizer.dataGrid.distinctValuesColumnName', {
defaultMessage: 'Distinct values',
}),
render: (cardinality: number | undefined) => (
<DistinctValues cardinality={cardinality} showIcon={dimensions.showIcon} />
),
sortable: true,
@ -237,7 +222,7 @@ export const DataVisualizerTable = <T extends DataVisualizerTableItem>({
{
name: (
<div className={'columnHeaderTitle'}>
{dimensions.showIcons ? (
{dimensions.showIcon ? (
<EuiIcon type={'visBarVertical'} className={'columnHeaderIcon'} />
) : null}
{i18n.translate('xpack.dataVisualizer.dataGrid.distributionsColumnName', {

10
x-pack/plugins/data_visualizer/public/application/common/components/stats_table/utils.ts
View file

@ -42,10 +42,10 @@ export const calculateTableColumnsDimensions = (width?: number) => {
const defaultSettings = {
expander: '40px',
type: '75px',
docCount: '200px',
distinctValues: '200px',
docCount: '225px',
distinctValues: '225px',
distributions: '150px',
showIcons: true,
showIcon: true,
breakPoint: 'xl',
};
if (width === undefined) return defaultSettings;
@ -59,7 +59,7 @@ export const calculateTableColumnsDimensions = (width?: number) => {
docCount: 'auto',
distinctValues: 'auto',
distributions: 'auto',
showIcons: false,
showIcon: false,
breakPoint,
};
@ -71,7 +71,7 @@ export const calculateTableColumnsDimensions = (width?: number) => {
docCount: 'auto',
distinctValues: 'auto',
distributions: 'auto',
showIcons: false,
showIcon: false,
breakPoint,
};