fix(RangeFilterPlugin): fixed range filter

apache · Jan 20, 2025 · 4fba41c · 4fba41c
1 parent 386a78c
commit 4fba41c
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 10 deletions.
diff --git a/...board/components/nativeFilters/FiltersConfigModal/FiltersConfigForm/FiltersConfigForm.tsx b/...board/components/nativeFilters/FiltersConfigModal/FiltersConfigForm/FiltersConfigForm.tsx
@@ -1249,7 +1249,6 @@ const FiltersConfigForm = (
                     rules={[
                       {
                         validator: () => {
-                          console.log(formFilter);
                           if (
                             formFilter?.defaultDataMask?.filterState?.value !==
                             undefined

diff --git a/superset-frontend/src/filters/components/Range/RangeFilterPlugin.test.tsx b/superset-frontend/src/filters/components/Range/RangeFilterPlugin.test.tsx
@@ -135,6 +135,8 @@ describe('RangeFilterPlugin', () => {
 
     fireEvent.change(fromInput, { target: { value: 40 } });
 
+    fireEvent.blur(fromInput);
+
     expect(fromInput).toHaveValue('10');
   });
 
@@ -177,7 +179,8 @@ describe('RangeFilterPlugin', () => {
         value: [20, 100],
       },
     });
-    expect(screen.getAllByRole('spinbutton')[0]).toHaveValue('20');
+    const input = screen.getByRole('spinbutton');
+    expect(input).toHaveValue('20');
   });
 
   it('should call setDataMask with correct less than filter', () => {
@@ -200,7 +203,8 @@ describe('RangeFilterPlugin', () => {
         value: [10, 60],
       },
     });
-    expect(screen.getAllByRole('spinbutton')[1]).toHaveValue('60');
+    const input = screen.getByRole('spinbutton');
+    expect(input).toHaveValue('60');
   });
 
   it('should call setDataMask with correct exact filter', () => {

diff --git a/superset-frontend/src/filters/components/Range/RangeFilterPlugin.tsx b/superset-frontend/src/filters/components/Range/RangeFilterPlugin.tsx
@@ -94,7 +94,7 @@ export default function RangeFilterPlugin(props: PluginFilterRangeProps) {
     setFilterActive,
     filterState,
     inputRef,
-    filterBarOrientation,
+    filterBarOrientation = FilterBarOrientation.Vertical,
     isOverflowingFilterBar,
   } = props;
   const [row] = data;
@@ -162,8 +162,13 @@ export default function RangeFilterPlugin(props: PluginFilterRangeProps) {
 
   const handleChange = (newValue: number, index: 0 | 1) => {
     const updatedValue: [number, number] = [...value];
-    console.log(newValue);
-    if (enableSingleExactValue || enableSingleMinValue) {
+
+    if (enableSingleExactValue) {
+      setValue([newValue, newValue]);
+      handleAfterChange([newValue, newValue]);
+      return;
+    }
+    if (enableSingleMinValue) {
       updatedValue[minIndex] = newValue;
       setValue(updatedValue);
       handleAfterChange(updatedValue);
@@ -194,10 +199,8 @@ export default function RangeFilterPlugin(props: PluginFilterRangeProps) {
       return;
     }
     const filterStateValue = filterState.value ?? minMax;
-    if (filterStateValue !== minMax) {
-      setValue(filterStateValue);
-      handleAfterChange(filterStateValue);
-    }
+    setValue(filterStateValue);
+    handleAfterChange(filterStateValue);
   }, [
     enableSingleMaxValue,
     enableSingleMinValue,
@@ -219,18 +222,21 @@ export default function RangeFilterPlugin(props: PluginFilterRangeProps) {
 
   useEffect(() => {
     if (enableSingleMaxValue) {
+      setValue([min, minMax[maxIndex]]);
       handleAfterChange([min, minMax[maxIndex]]);
     }
   }, [enableSingleMaxValue]);
 
   useEffect(() => {
     if (enableSingleMinValue) {
+      setValue([minMax[minIndex], max]);
       handleAfterChange([minMax[minIndex], max]);
     }
   }, [enableSingleMinValue]);
 
   useEffect(() => {
     if (enableSingleExactValue) {
+      setValue([minMax[minIndex], minMax[minIndex]]);
       handleAfterChange([minMax[minIndex], minMax[minIndex]]);
     }
   }, [enableSingleExactValue]);