fix(dnd): make clicked dnd metrics unique (#16632)
diff --git a/superset-frontend/src/explore/components/DatasourcePanel/types.ts b/superset-frontend/src/explore/components/DatasourcePanel/types.ts
index 2dcc517..2290477 100644
--- a/superset-frontend/src/explore/components/DatasourcePanel/types.ts
+++ b/superset-frontend/src/explore/components/DatasourcePanel/types.ts
@@ -25,3 +25,9 @@
value: DndItemValue;
type: DndItemType;
}
+
+export function isDatasourcePanelDndItem(
+ item: any,
+): item is DatasourcePanelDndItem {
+ return item?.value && item?.type;
+}
diff --git a/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndMetricSelect.tsx b/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndMetricSelect.tsx
index 2fcf53f..a200768 100644
--- a/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndMetricSelect.tsx
+++ b/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndMetricSelect.tsx
@@ -34,7 +34,10 @@
import AdhocMetric from 'src/explore/components/controls/MetricControl/AdhocMetric';
import AdhocMetricPopoverTrigger from 'src/explore/components/controls/MetricControl/AdhocMetricPopoverTrigger';
import MetricDefinitionValue from 'src/explore/components/controls/MetricControl/MetricDefinitionValue';
-import { DatasourcePanelDndItem } from 'src/explore/components/DatasourcePanel/types';
+import {
+ DatasourcePanelDndItem,
+ isDatasourcePanelDndItem,
+} from 'src/explore/components/DatasourcePanel/types';
import { DndItemType } from 'src/explore/components/DndItemType';
import DndSelectLabel from 'src/explore/components/controls/DndColumnSelectControl/DndSelectLabel';
import { savedMetricType } from 'src/explore/components/controls/MetricControl/types';
@@ -143,9 +146,9 @@
const [value, setValue] = useState<ValueType[]>(
coerceAdhocMetrics(props.value),
);
- const [droppedItem, setDroppedItem] = useState<DatasourcePanelDndItem | null>(
- null,
- );
+ const [droppedItem, setDroppedItem] = useState<
+ DatasourcePanelDndItem | typeof EMPTY_OBJECT
+ >({});
const [newMetricPopoverVisible, setNewMetricPopoverVisible] = useState(false);
const prevColumns = usePrevious(columns);
const prevSavedMetrics = usePrevious(savedMetrics);
@@ -323,13 +326,16 @@
);
const handleClickGhostButton = useCallback(() => {
- setDroppedItem(null);
+ setDroppedItem({});
togglePopover(true);
}, [togglePopover]);
const adhocMetric = useMemo(() => {
- if (droppedItem?.type === DndItemType.Column) {
- const itemValue = droppedItem?.value as ColumnMeta;
+ if (
+ isDatasourcePanelDndItem(droppedItem) &&
+ droppedItem.type === DndItemType.Column
+ ) {
+ const itemValue = droppedItem.value as ColumnMeta;
const config: Partial<AdhocMetric> = {
column: { column_name: itemValue?.column_name },
};
