feat: move filters from superset-ui to incubator

superset-frontend/spec/javascripts/filters/utils_spec.ts

@@ -0,0 +1,156 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import {
+  getRangeExtraFormData,
+  getSelectExtraFormData,
+} from '../../../src/filters/utils';
+
+describe('Filter utils', () => {
+  describe('getRangeExtraFormData', () => {
+    it('getRangeExtraFormData - col: "testCol", lower: 1, upper: 2', () => {
+      expect(getRangeExtraFormData('testCol', 1, 2)).toEqual({
+        append_form_data: {
+          filters: [
+            {
+              col: 'testCol',
+              op: '>=',
+              val: 1,
+            },
+            {
+              col: 'testCol',
+              op: '<=',
+              val: 2,
+            },
+          ],
+        },
+      });
+    });
+    it('getRangeExtraFormData - col: "testCol", lower: 0, upper: 0', () => {
+      expect(getRangeExtraFormData('testCol', 0, 0)).toEqual({
+        append_form_data: {
+          filters: [
+            {
+              col: 'testCol',
+              op: '>=',
+              val: 0,
+            },
+            {
+              col: 'testCol',
+              op: '<=',
+              val: 0,
+            },
+          ],
+        },
+      });
+    });
+    it('getRangeExtraFormData - col: "testCol", lower: null, upper: 2', () => {
+      expect(getRangeExtraFormData('testCol', null, 2)).toEqual({
+        append_form_data: {
+          filters: [
+            {
+              col: 'testCol',
+              op: '<=',
+              val: 2,
+            },
+          ],
+        },
+      });
+    });
+    it('getRangeExtraFormData - col: "testCol", lower: 1, upper: undefined', () => {
+      expect(getRangeExtraFormData('testCol', 1, undefined)).toEqual({
+        append_form_data: {
+          filters: [
+            {
+              col: 'testCol',
+              op: '>=',
+              val: 1,
+            },
+          ],
+        },
+      });
+    });
+  });
+  describe('getSelectExtraFormData', () => {
+    it('getSelectExtraFormData - col: "testCol", value: ["value"], emptyFilter: false, inverseSelection: false', () => {
+      expect(
+        getSelectExtraFormData('testCol', ['value'], false, false),
+      ).toEqual({
+        append_form_data: {
+          filters: [
+            {
+              col: 'testCol',
+              op: 'IN',
+              val: ['value'],
+            },
+          ],
+        },
+      });
+    });
+    it('getSelectExtraFormData - col: "testCol", value: ["value"], emptyFilter: true, inverseSelection: false', () => {
+      expect(getSelectExtraFormData('testCol', ['value'], true, false)).toEqual(
+        {
+          append_form_data: {
+            extras: {
+              where: '1 = 0',
+            },
+          },
+        },
+      );
+    });
+    it('getSelectExtraFormData - col: "testCol", value: ["value"], emptyFilter: false, inverseSelection: true', () => {
+      expect(getSelectExtraFormData('testCol', ['value'], false, true)).toEqual(
+        {
+          append_form_data: {
+            filters: [
+              {
+                col: 'testCol',
+                op: 'NOT IN',
+                val: ['value'],
+              },
+            ],
+          },
+        },
+      );
+    });
+    it('getSelectExtraFormData - col: "testCol", value: [], emptyFilter: false, inverseSelection: false', () => {
+      expect(getSelectExtraFormData('testCol', [], false, false)).toEqual({
+        append_form_data: {
+          filters: [],
+        },
+      });
+    });
+    it('getSelectExtraFormData - col: "testCol", value: undefined, emptyFilter: false, inverseSelection: false', () => {
+      expect(
+        getSelectExtraFormData('testCol', undefined, false, false),
+      ).toEqual({
+        append_form_data: {
+          filters: [],
+        },
+      });
+    });
+    it('getSelectExtraFormData - col: "testCol", value: null, emptyFilter: false, inverseSelection: false', () => {
+      expect(getSelectExtraFormData('testCol', null, false, false)).toEqual({
+        append_form_data: {
+          filters: [],
+        },
+      });
+    });
+  });
+});

superset-frontend/src/common/components/index.tsx

@@ -44,6 +44,7 @@ export {
   Typography,
   Tree,
   Popover,
+  Slider,
   Radio,
   Row,
   Select,

superset-frontend/src/dashboard/components/nativeFilters/FilterBar.tsx

@@ -222,7 +222,7 @@ const FilterValue: React.FC<FilterProps> = ({
   } = filter;
   const cascadingFilters = useCascadingFilters(id);
   const [loading, setLoading] = useState<boolean>(true);
-  const [state, setState] = useState({ data: undefined });
+  const [state, setState] = useState([]);
   const [formData, setFormData] = useState<Partial<QueryFormData>>({});
   const [target] = targets;
   const { datasetId = 18, column } = target;
@@ -256,7 +256,7 @@ const FilterValue: React.FC<FilterProps> = ({
         force: false,
         requestParams: { dashboardId: 0 },
       }).then(response => {
-        setState({ data: response.result[0].data });
+        setState(response.result);
         setLoading(false);
       });
     }

superset-frontend/src/filters/components/Range/AntdRangeFilter.tsx

@@ -0,0 +1,56 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import { styled } from '@superset-ui/core';
+import React from 'react';
+import { Slider } from 'src/common/components';
+import { AntdPluginFilterRangeProps } from './types';
+import { AntdPluginFilterStylesProps } from '../types';
+import { getRangeExtraFormData } from '../../utils';
+
+const Styles = styled.div<AntdPluginFilterStylesProps>`
+  height: ${({ height }) => height};
+  width: ${({ width }) => width};
+`;
+
+export default function AntdRangeFilter(props: AntdPluginFilterRangeProps) {
+  const { data, formData, height, width, setExtraFormData } = props;
+  const [row] = data;
+  // @ts-ignore
+  const { min, max }: { min: number; max: number } = row;
+  const { groupby } = formData;
+  const [col] = groupby || [];
+
+  const handleChange = (value: [number, number]) => {
+    const [lower, upper] = value;
+
+    setExtraFormData(getRangeExtraFormData(col, lower, upper));
+  };
+
+  return (
+    <Styles height={height} width={width}>
+      <Slider
+        range
+        min={min}
+        max={max}
+        defaultValue={[min, max]}
+        onChange={handleChange}
+      />
+    </Styles>
+  );
+}

superset-frontend/src/filters/components/Range/buildQuery.ts

@@ -0,0 +1,74 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import {
+  buildQueryContext,
+  ColumnType,
+  QueryFormData,
+} from '@superset-ui/core';
+
+/**
+ * The buildQuery function is used to create an instance of QueryContext that's
+ * sent to the chart data endpoint. In addition to containing information of which
+ * datasource to use, it specifies the type (e.g. full payload, samples, query) and
+ * format (e.g. CSV or JSON) of the result and whether or not to force refresh the data from
+ * the datasource as opposed to using a cached copy of the data, if available.
+ *
+ * More importantly though, QueryContext contains a property `queries`, which is an array of
+ * QueryObjects specifying individual data requests to be made. A QueryObject specifies which
+ * columns, metrics and filters, among others, to use during the query. Usually it will be enough
+ * to specify just one query based on the baseQueryObject, but for some more advanced use cases
+ * it is possible to define post processing operations in the QueryObject, or multiple queries
+ * if a viz needs multiple different result sets.
+ */
+export default function buildQuery(formData: QueryFormData) {
+  const { groupby } = formData;
+  const [column] = groupby || [];
+  return buildQueryContext(formData, baseQueryObject => {
+    return [
+      {
+        ...baseQueryObject,
+        groupby: [],
+        metrics: [
+          {
+            aggregate: 'MIN',
+            column: {
+              columnName: column,
+              id: 1,
+              type: ColumnType.FLOAT,
+            },
+            expressionType: 'SIMPLE',
+            hasCustomLabel: true,
+            label: 'min',
+          },
+          {
+            aggregate: 'MAX',
+            column: {
+              columnName: column,
+              id: 2,
+              type: ColumnType.FLOAT,
+            },
+            expressionType: 'SIMPLE',
+            hasCustomLabel: true,
+            label: 'max',
+          },
+        ],
+      },
+    ];
+  });
+}

superset-frontend/src/filters/components/Range/controlPanel.ts

@@ -0,0 +1,44 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import { t, validateNonEmpty } from '@superset-ui/core';
+import { ControlPanelConfig, sections } from '@superset-ui/chart-controls';
+
+const config: ControlPanelConfig = {
+  // For control input types, see: superset-frontend/src/explore/components/controls/index.js
+  controlPanelSections: [
+    // @ts-ignore
+    sections.legacyRegularTime,
+    {
+      label: t('Query'),
+      expanded: true,
+      controlSetRows: [['groupby'], ['adhoc_filters']],
+    },
+  ],
+  controlOverrides: {
+    groupby: {
+      validators: [validateNonEmpty],
+      clearable: false,
+    },
+    row_limit: {
+      default: 100,
+    },
+  },
+};
+
+export default config;