mirror of
https://github.com/apache/superset.git
synced 2024-09-18 19:49:37 -04:00
fix(dashboard): Page crashing when cross filter applied on adhoc column (#23215)
This commit is contained in:
parent
dcd3e00f39
commit
ad5ee1ce38
@ -20,10 +20,14 @@ import userEvent from '@testing-library/user-event';
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { render, screen } from 'spec/helpers/testing-library';
|
import { render, screen } from 'spec/helpers/testing-library';
|
||||||
import { FilterBarOrientation } from 'src/dashboard/types';
|
import { FilterBarOrientation } from 'src/dashboard/types';
|
||||||
import { IndicatorStatus } from '../../selectors';
|
import { CrossFilterIndicator, IndicatorStatus } from '../../selectors';
|
||||||
import CrossFilterTag from './CrossFilterTag';
|
import CrossFilterTag from './CrossFilterTag';
|
||||||
|
|
||||||
const mockedProps = {
|
const mockedProps: {
|
||||||
|
filter: CrossFilterIndicator;
|
||||||
|
orientation: FilterBarOrientation;
|
||||||
|
removeCrossFilter: (filterId: number) => void;
|
||||||
|
} = {
|
||||||
filter: {
|
filter: {
|
||||||
name: 'test',
|
name: 'test',
|
||||||
emitterId: 1,
|
emitterId: 1,
|
||||||
@ -46,6 +50,25 @@ test('CrossFilterTag should render', () => {
|
|||||||
expect(container).toBeInTheDocument();
|
expect(container).toBeInTheDocument();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
test('CrossFilterTag with adhoc column should render', () => {
|
||||||
|
const props = {
|
||||||
|
...mockedProps,
|
||||||
|
filter: {
|
||||||
|
...mockedProps.filter,
|
||||||
|
column: {
|
||||||
|
label: 'My column',
|
||||||
|
sqlExpression: 'country_name',
|
||||||
|
expressionType: 'SQL' as const,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
const { container } = setup(props);
|
||||||
|
expect(container).toBeInTheDocument();
|
||||||
|
expect(screen.getByText('My column')).toBeInTheDocument();
|
||||||
|
expect(screen.getByText('Italy')).toBeInTheDocument();
|
||||||
|
});
|
||||||
|
|
||||||
test('Column and value should be visible', () => {
|
test('Column and value should be visible', () => {
|
||||||
setup(mockedProps);
|
setup(mockedProps);
|
||||||
expect(screen.getByText('country_name')).toBeInTheDocument();
|
expect(screen.getByText('country_name')).toBeInTheDocument();
|
||||||
|
@ -18,7 +18,7 @@
|
|||||||
*/
|
*/
|
||||||
|
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { styled, css, useTheme } from '@superset-ui/core';
|
import { styled, css, useTheme, getColumnLabel } from '@superset-ui/core';
|
||||||
import { CrossFilterIndicator } from 'src/dashboard/components/nativeFilters/selectors';
|
import { CrossFilterIndicator } from 'src/dashboard/components/nativeFilters/selectors';
|
||||||
import { Tag } from 'src/components';
|
import { Tag } from 'src/components';
|
||||||
import { Tooltip } from 'src/components/Tooltip';
|
import { Tooltip } from 'src/components/Tooltip';
|
||||||
@ -62,6 +62,7 @@ const CrossFilterTag = (props: {
|
|||||||
useCSSTextTruncation<HTMLSpanElement>();
|
useCSSTextTruncation<HTMLSpanElement>();
|
||||||
const [valueRef, valueIsTruncated] = useCSSTextTruncation<HTMLSpanElement>();
|
const [valueRef, valueIsTruncated] = useCSSTextTruncation<HTMLSpanElement>();
|
||||||
|
|
||||||
|
const columnLabel = getColumnLabel(filter.column ?? '');
|
||||||
return (
|
return (
|
||||||
<StyledTag
|
<StyledTag
|
||||||
css={css`
|
css={css`
|
||||||
@ -76,9 +77,9 @@ const CrossFilterTag = (props: {
|
|||||||
closable
|
closable
|
||||||
onClose={() => removeCrossFilter(filter.emitterId)}
|
onClose={() => removeCrossFilter(filter.emitterId)}
|
||||||
>
|
>
|
||||||
<Tooltip title={columnIsTruncated ? filter.column : null}>
|
<Tooltip title={columnIsTruncated ? columnLabel : null}>
|
||||||
<StyledCrossFilterColumn ref={columnRef}>
|
<StyledCrossFilterColumn ref={columnRef}>
|
||||||
{filter.column}
|
{columnLabel}
|
||||||
</StyledCrossFilterColumn>
|
</StyledCrossFilterColumn>
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
<Tooltip title={valueIsTruncated ? filter.value : null}>
|
<Tooltip title={valueIsTruncated ? filter.value : null}>
|
||||||
|
@ -26,6 +26,7 @@ import {
|
|||||||
isFeatureEnabled,
|
isFeatureEnabled,
|
||||||
NativeFilterType,
|
NativeFilterType,
|
||||||
NO_TIME_RANGE,
|
NO_TIME_RANGE,
|
||||||
|
QueryFormColumn,
|
||||||
} from '@superset-ui/core';
|
} from '@superset-ui/core';
|
||||||
import { TIME_FILTER_MAP } from 'src/explore/constants';
|
import { TIME_FILTER_MAP } from 'src/explore/constants';
|
||||||
import { getChartIdsInFilterBoxScope } from 'src/dashboard/util/activeDashboardFilters';
|
import { getChartIdsInFilterBoxScope } from 'src/dashboard/util/activeDashboardFilters';
|
||||||
@ -151,7 +152,7 @@ const getRejectedColumns = (chart: any): Set<string> =>
|
|||||||
);
|
);
|
||||||
|
|
||||||
export type Indicator = {
|
export type Indicator = {
|
||||||
column?: string;
|
column?: QueryFormColumn;
|
||||||
name: string;
|
name: string;
|
||||||
value?: any;
|
value?: any;
|
||||||
status?: IndicatorStatus;
|
status?: IndicatorStatus;
|
||||||
|
Loading…
Reference in New Issue
Block a user