mirror of https://github.com/apache/superset.git
feat(native-filters): improve inverse selection indicators (#14873)
This commit is contained in:
parent
acbbced20b
commit
b72e5e0aae
|
@ -226,7 +226,10 @@ export const selectNativeIndicatorsForChart = (
|
|||
)
|
||||
.map(nativeFilter => {
|
||||
const column = nativeFilter.targets[0]?.column?.name;
|
||||
let value = dataMask[nativeFilter.id]?.filterState?.value ?? null;
|
||||
let value =
|
||||
dataMask[nativeFilter.id]?.filterState?.label ??
|
||||
dataMask[nativeFilter.id]?.filterState?.value ??
|
||||
null;
|
||||
if (!Array.isArray(value) && value !== null) {
|
||||
value = [value];
|
||||
}
|
||||
|
@ -252,7 +255,10 @@ export const selectNativeIndicatorsForChart = (
|
|||
),
|
||||
)
|
||||
.map(chartConfig => {
|
||||
let value = dataMask[chartConfig.id]?.filterState?.value ?? null;
|
||||
let value =
|
||||
dataMask[chartConfig.id]?.filterState?.label ??
|
||||
dataMask[chartConfig.id]?.filterState?.value ??
|
||||
null;
|
||||
if (!Array.isArray(value) && value !== null) {
|
||||
value = [value];
|
||||
}
|
||||
|
|
|
@ -38,6 +38,7 @@ import React, {
|
|||
import { Select } from 'src/common/components';
|
||||
import debounce from 'lodash/debounce';
|
||||
import { SLOW_DEBOUNCE } from 'src/constants';
|
||||
import { CheckOutlined, StopOutlined } from '@ant-design/icons';
|
||||
import { PluginFilterSelectProps, SelectValue } from './types';
|
||||
import { StyledSelect, Styles } from '../common';
|
||||
import { getDataRecordFormatter, getSelectExtraFormData } from '../../utils';
|
||||
|
@ -49,7 +50,7 @@ type DataMaskAction =
|
|||
| {
|
||||
type: 'filterState';
|
||||
extraFormData: ExtraFormData;
|
||||
filterState: { value: SelectValue };
|
||||
filterState: { value: SelectValue; label?: string };
|
||||
};
|
||||
|
||||
function reducer(state: DataMask, action: DataMaskAction): DataMask {
|
||||
|
@ -135,6 +136,8 @@ export default function PluginFilterSelect(props: PluginFilterSelectProps) {
|
|||
const updateDataMask = (values: SelectValue) => {
|
||||
const emptyFilter =
|
||||
enableEmptyFilter && !inverseSelection && !values?.length;
|
||||
const suffix =
|
||||
inverseSelection && values?.length ? ` (${t('excluded')})` : '';
|
||||
|
||||
dispatchDataMask({
|
||||
type: 'filterState',
|
||||
|
@ -146,6 +149,7 @@ export default function PluginFilterSelect(props: PluginFilterSelectProps) {
|
|||
),
|
||||
filterState: {
|
||||
value: values,
|
||||
label: `${(values || []).join(', ')}${suffix}`,
|
||||
},
|
||||
});
|
||||
};
|
||||
|
@ -260,6 +264,9 @@ export default function PluginFilterSelect(props: PluginFilterSelectProps) {
|
|||
ref={inputRef}
|
||||
loading={isRefreshing}
|
||||
maxTagCount={5}
|
||||
menuItemSelectedIcon={
|
||||
inverseSelection ? <StopOutlined /> : <CheckOutlined />
|
||||
}
|
||||
>
|
||||
{sortedData.map(row => {
|
||||
const [value] = groupby.map(col => row[col]);
|
||||
|
|
Loading…
Reference in New Issue