fix(native-filters): avoid double load on initialization (#15012)

superset-frontend/src/filters/components/Select/SelectFilterPlugin.test.tsx

@@ -30,7 +30,7 @@ const selectMultipleProps = {
     enableEmptyFilter: true,
     defaultToFirstItem: false,
     inverseSelection: false,
-    searchAllOptions: true,
+    searchAllOptions: false,
     datasource: '3__table',
     groupby: ['gender'],
     adhocFilters: [],
@@ -48,7 +48,7 @@ const selectMultipleProps = {
   },
   height: 20,
   hooks: {},
-  ownState: { coltypeMap: { gender: 1 }, search: null },
+  ownState: {},
   filterState: { value: ['boy'] },
   queriesData: [
     {
@@ -92,11 +92,6 @@ describe('SelectFilterPlugin', () => {
       filterState: {
         value: ['boy'],
       },
-      ownState: {
-        coltypeMap: {
-          gender: 1,
-        },
-      },
     });
     expect(setDataMask).toHaveBeenCalledWith({
       __cache: {
@@ -115,11 +110,6 @@ describe('SelectFilterPlugin', () => {
         label: 'boy',
         value: ['boy'],
       },
-      ownState: {
-        coltypeMap: {
-          gender: 1,
-        },
-      },
     });
     userEvent.click(screen.getByRole('combobox'));
     userEvent.click(screen.getByTitle('girl'));
@@ -140,12 +130,6 @@ describe('SelectFilterPlugin', () => {
         label: 'boy, girl',
         value: ['boy', 'girl'],
       },
-      ownState: {
-        coltypeMap: {
-          gender: 1,
-        },
-        search: null,
-      },
     });
   });
 
@@ -169,11 +153,6 @@ describe('SelectFilterPlugin', () => {
         label: '',
         value: null,
       },
-      ownState: {
-        coltypeMap: {
-          gender: 1,
-        },
-      },
     });
   });
 
@@ -189,11 +168,6 @@ describe('SelectFilterPlugin', () => {
         label: '',
         value: null,
       },
-      ownState: {
-        coltypeMap: {
-          gender: 1,
-        },
-      },
     });
   });
 
@@ -218,6 +192,27 @@ describe('SelectFilterPlugin', () => {
         label: 'girl (excluded)',
         value: ['girl'],
       },
+    });
+  });
+
+  it('Add ownState with column types when search all options', () => {
+    getWrapper({ searchAllOptions: true, multiSelect: false });
+    userEvent.click(screen.getByRole('combobox'));
+    userEvent.click(screen.getByTitle('girl'));
+    expect(setDataMask).toHaveBeenCalledWith({
+      extraFormData: {
+        filters: [
+          {
+            col: 'gender',
+            op: 'IN',
+            val: ['girl'],
+          },
+        ],
+      },
+      filterState: {
+        label: 'girl',
+        value: ['girl'],
+      },
       ownState: {
         coltypeMap: {
           gender: 1,

superset-frontend/src/filters/components/Select/SelectFilterPlugin.tsx

@@ -97,6 +97,7 @@ export default function PluginFilterSelect(props: PluginFilterSelectProps) {
   } = formData;
   const groupby = ensureIsArray<string>(formData.groupby);
   const [col] = groupby;
+  const [initialColtypeMap] = useState(coltypeMap);
   const [selectedValues, setSelectedValues] = useState<SelectValue>(
     filterState.value,
   );
@@ -118,9 +119,6 @@ export default function PluginFilterSelect(props: PluginFilterSelectProps) {
   const [dataMask, dispatchDataMask] = useImmerReducer(reducer, {
     extraFormData: {},
     filterState,
-    ownState: {
-      coltypeMap,
-    },
   });
   const updateDataMask = useCallback(
     (values: SelectValue) => {
@@ -174,6 +172,7 @@ export default function PluginFilterSelect(props: PluginFilterSelectProps) {
       dispatchDataMask({
         type: 'ownState',
         ownState: {
+          coltypeMap: initialColtypeMap,
           search: val,
         },
       });
@@ -194,6 +193,7 @@ export default function PluginFilterSelect(props: PluginFilterSelectProps) {
       dispatchDataMask({
         type: 'ownState',
         ownState: {
+          coltypeMap: initialColtypeMap,
           search: null,
         },
       });