pt/superset
1
0
Fork 0
mirror of https://github.com/apache/superset.git synced 2024-09-12 00:29:39 -04:00
Code Issues Packages Projects Releases Wiki Activity

feat(native-filters): sort selected values on blur (#14842)

Browse Source 
* feat(native-filters): sort selected values on blur

* remove new icons
This commit is contained in:
Ville Brofeldt 2021-05-27 09:36:33 +03:00 committed by GitHub
parent 9f54231af1
commit 2b4e0ec9e0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 34 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
superset-frontend/src/filters/components/Select/SelectFilterPlugin.tsx
View File

@ -19,6 +19,7 @@
import {
AppSection,
DataMask,
DataRecord,
ensureIsArray,
ExtraFormData,
GenericDataType,
@ -27,7 +28,13 @@ import {
t,
tn,
} from '@superset-ui/core';
import React, { useCallback, useEffect, useReducer, useState } from 'react';
import React, {
useCallback,
useEffect,
useMemo,
useReducer,
useState,
} from 'react';
import { Select } from 'src/common/components';
import debounce from 'lodash/debounce';
import { SLOW_DEBOUNCE } from 'src/constants';
@ -101,6 +108,23 @@ export default function PluginFilterSelect(props: PluginFilterSelectProps) {
} = formData;
const groupby = ensureIsArray<string>(formData.groupby);
const [col] = groupby;
const [selectedValues, setSelectedValues] = useState<SelectValue>(
filterState.value,
);
const sortedData = useMemo(() => {
const firstData: DataRecord[] = [];
const restData: DataRecord[] = [];
data.forEach(row => {
// @ts-ignore
if (selectedValues?.includes(row[col])) {
firstData.push(row);
} else {
restData.push(row);
}
});
return [...firstData, ...restData];
}, [col, selectedValues, data]);
const [isDropdownVisible, setIsDropdownVisible] = useState(false);
const [currentSuggestionSearch, setCurrentSuggestionSearch] = useState('');
const [dataMask, dispatchDataMask] = useReducer<DataMaskReducer>(reducer, {
filterState,
@ -126,6 +150,12 @@ export default function PluginFilterSelect(props: PluginFilterSelectProps) {
});
};
useEffect(() => {
if (!isDropdownVisible) {
setSelectedValues(filterState.value);
}
}, [JSON.stringify(filterState.value)]);
const isDisabled =
appSection === AppSection.FILTER_CONFIG_MODAL && defaultToFirstItem;
@ -163,6 +193,7 @@ export default function PluginFilterSelect(props: PluginFilterSelectProps) {
const handleBlur = () => {
clearSuggestionSearch();
unsetFocusedFilter();
setSelectedValues(filterState.value);
};
const datatype: GenericDataType = coltypeMap[col];
@ -222,6 +253,7 @@ export default function PluginFilterSelect(props: PluginFilterSelectProps) {
onSearch={searchWrapper}
onSelect={clearSuggestionSearch}
onBlur={handleBlur}
onDropdownVisibleChange={setIsDropdownVisible}
onFocus={setFocusedFilter}
// @ts-ignore
onChange={handleChange}
@ -229,7 +261,7 @@ export default function PluginFilterSelect(props: PluginFilterSelectProps) {
loading={isRefreshing}
maxTagCount={5}
>
{data.map(row => {
{sortedData.map(row => {
const [value] = groupby.map(col => row[col]);
return (
// @ts-ignore