mirror of
https://github.com/apache/superset.git
synced 2024-09-18 19:49:37 -04:00
fix: allow to select <NULL> in a native filter single mode (#19076)
* fix: allow to select <NULL> in a native filter single mode * fix lint issue * Update superset-frontend/src/components/Select/utils.ts Co-authored-by: Michael S. Molina <70410625+michael-s-molina@users.noreply.github.com> * fix Co-authored-by: Michael S. Molina <70410625+michael-s-molina@users.noreply.github.com>
This commit is contained in:
parent
d099f5ed4a
commit
19fcd03c89
@ -60,8 +60,10 @@ export function findValue<OptionType extends OptionTypeBase>(
|
|||||||
return (Array.isArray(value) ? value : [value]).map(find);
|
return (Array.isArray(value) ? value : [value]).map(find);
|
||||||
}
|
}
|
||||||
|
|
||||||
export function getValue(option: string | number | { value: string | number }) {
|
export function getValue(
|
||||||
return typeof option === 'object' ? option.value : option;
|
option: string | number | { value: string | number | null } | null,
|
||||||
|
) {
|
||||||
|
return option && typeof option === 'object' ? option.value : option;
|
||||||
}
|
}
|
||||||
|
|
||||||
type LabeledValue<V> = { label?: ReactNode; value?: V };
|
type LabeledValue<V> = { label?: ReactNode; value?: V };
|
||||||
|
@ -20,6 +20,7 @@ import userEvent from '@testing-library/user-event';
|
|||||||
import { AppSection } from '@superset-ui/core';
|
import { AppSection } from '@superset-ui/core';
|
||||||
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 { NULL_STRING } from 'src/utils/common';
|
||||||
import SelectFilterPlugin from './SelectFilterPlugin';
|
import SelectFilterPlugin from './SelectFilterPlugin';
|
||||||
import transformProps from './transformProps';
|
import transformProps from './transformProps';
|
||||||
|
|
||||||
@ -55,7 +56,7 @@ const selectMultipleProps = {
|
|||||||
rowcount: 2,
|
rowcount: 2,
|
||||||
colnames: ['gender'],
|
colnames: ['gender'],
|
||||||
coltypes: [1],
|
coltypes: [1],
|
||||||
data: [{ gender: 'boy' }, { gender: 'girl' }],
|
data: [{ gender: 'boy' }, { gender: 'girl' }, { gender: null }],
|
||||||
applied_filters: [{ column: 'gender' }],
|
applied_filters: [{ column: 'gender' }],
|
||||||
rejected_filters: [],
|
rejected_filters: [],
|
||||||
},
|
},
|
||||||
@ -195,6 +196,30 @@ describe('SelectFilterPlugin', () => {
|
|||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
it('Select single null (empty) value', () => {
|
||||||
|
getWrapper();
|
||||||
|
userEvent.click(screen.getByRole('combobox'));
|
||||||
|
userEvent.click(screen.getByTitle(NULL_STRING));
|
||||||
|
expect(setDataMask).toHaveBeenLastCalledWith({
|
||||||
|
__cache: {
|
||||||
|
value: ['boy'],
|
||||||
|
},
|
||||||
|
extraFormData: {
|
||||||
|
filters: [
|
||||||
|
{
|
||||||
|
col: 'gender',
|
||||||
|
op: 'IN',
|
||||||
|
val: ['boy', null],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
filterState: {
|
||||||
|
label: `boy, ${NULL_STRING}`,
|
||||||
|
value: ['boy', null],
|
||||||
|
},
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
it('Add ownState with column types when search all options', () => {
|
it('Add ownState with column types when search all options', () => {
|
||||||
getWrapper({ searchAllOptions: true, multiSelect: false });
|
getWrapper({ searchAllOptions: true, multiSelect: false });
|
||||||
userEvent.click(screen.getByRole('combobox'));
|
userEvent.click(screen.getByRole('combobox'));
|
||||||
|
@ -209,7 +209,8 @@ export default function PluginFilterSelect(props: PluginFilterSelectProps) {
|
|||||||
|
|
||||||
const handleChange = useCallback(
|
const handleChange = useCallback(
|
||||||
(value?: SelectValue | number | string) => {
|
(value?: SelectValue | number | string) => {
|
||||||
const values = ensureIsArray(value);
|
const values = value === null ? [null] : ensureIsArray(value);
|
||||||
|
|
||||||
if (values.length === 0) {
|
if (values.length === 0) {
|
||||||
updateDataMask(null);
|
updateDataMask(null);
|
||||||
} else {
|
} else {
|
||||||
|
@ -29,7 +29,7 @@ import {
|
|||||||
import { RefObject } from 'react';
|
import { RefObject } from 'react';
|
||||||
import { PluginFilterHooks, PluginFilterStylesProps } from '../types';
|
import { PluginFilterHooks, PluginFilterStylesProps } from '../types';
|
||||||
|
|
||||||
export type SelectValue = (number | string)[] | null | undefined;
|
export type SelectValue = (number | string | null)[] | null | undefined;
|
||||||
|
|
||||||
export interface PluginFilterSelectCustomizeProps {
|
export interface PluginFilterSelectCustomizeProps {
|
||||||
defaultValue?: SelectValue;
|
defaultValue?: SelectValue;
|
||||||
|
Loading…
Reference in New Issue
Block a user