diff --git a/superset-frontend/src/explore/components/DatasourcePanel/types.ts b/superset-frontend/src/explore/components/DatasourcePanel/types.ts index 22904776fa6f3..315eba93473bf 100644 --- a/superset-frontend/src/explore/components/DatasourcePanel/types.ts +++ b/superset-frontend/src/explore/components/DatasourcePanel/types.ts @@ -31,3 +31,7 @@ export function isDatasourcePanelDndItem( ): item is DatasourcePanelDndItem { return item?.value && item?.type; } + +export function isSavedMetric(item: any): item is Metric { + return item?.metric_name; +} diff --git a/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndFilterSelect.tsx b/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndFilterSelect.tsx index f9a142b665d6b..bb59b17b0c5a0 100644 --- a/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndFilterSelect.tsx +++ b/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndFilterSelect.tsx @@ -45,10 +45,12 @@ import AdhocMetric from 'src/explore/components/controls/MetricControl/AdhocMetr import { DatasourcePanelDndItem, DndItemValue, + isSavedMetric, } from 'src/explore/components/DatasourcePanel/types'; import { DndItemType } from 'src/explore/components/DndItemType'; import { ControlComponentProps } from 'src/explore/components/Control'; +const EMPTY_OBJECT = {}; const DND_ACCEPTED_TYPES = [ DndItemType.Column, DndItemType.Metric, @@ -78,7 +80,9 @@ export const DndFilterSelect = (props: DndFilterSelectProps) => { ); const [partitionColumn, setPartitionColumn] = useState(undefined); const [newFilterPopoverVisible, setNewFilterPopoverVisible] = useState(false); - const [droppedItem, setDroppedItem] = useState(null); + const [droppedItem, setDroppedItem] = useState< + DndItemValue | typeof EMPTY_OBJECT + >({}); const optionsForSelect = ( columns: ColumnMeta[], @@ -342,12 +346,12 @@ export const DndFilterSelect = (props: DndFilterSelectProps) => { ); const handleClickGhostButton = useCallback(() => { - setDroppedItem(null); + setDroppedItem({}); togglePopover(true); }, [togglePopover]); const adhocFilter = useMemo(() => { - if (droppedItem?.metric_name) { + if (isSavedMetric(droppedItem)) { return new AdhocFilter({ expressionType: EXPRESSION_TYPES.SQL, clause: CLAUSES.HAVING,