diff --git a/packages/upset/src/components/Root.tsx b/packages/upset/src/components/Root.tsx index 49efdd3c..e3433772 100644 --- a/packages/upset/src/components/Root.tsx +++ b/packages/upset/src/components/Root.tsx @@ -11,10 +11,9 @@ import { columnsAtom } from '../atoms/columnAtom'; import { itemsAtom } from '../atoms/itemsAtoms'; import { setsAtom } from '../atoms/setsAtoms'; import { dataAtom } from '../atoms/dataAtom'; -import { columnHoverAtom, columnSelectAtom } from '../atoms/highlightAtom'; +import { columnHoverAtom } from '../atoms/highlightAtom'; import { contextMenuAtom } from '../atoms/contextMenuAtom'; import { upsetConfigAtom } from '../atoms/config/upsetConfigAtoms'; -import { currentIntersectionAtom } from '../atoms/config/currentIntersectionAtom'; import { getActions, initializeProvenanceTracking, UpsetActions, UpsetProvenance, } from '../provenance'; @@ -66,12 +65,10 @@ export const Root: FC = ({ const [sets, setSets] = useRecoilState(setsAtom); const [items, setItems] = useRecoilState(itemsAtom); + const [columnHover, setColumnHover] = useRecoilState(columnHoverAtom); const setAttributeColumns = useSetRecoilState(attributeAtom); const setAllColumns = useSetRecoilState(columnsAtom); const setData = useSetRecoilState(dataAtom); - const setCurrentIntersection = useSetRecoilState(currentIntersectionAtom); - const setColumnHover = useSetRecoilState(columnHoverAtom); - const setColumnSelect = useSetRecoilState(columnSelectAtom); const setContextMenu = useSetRecoilState(contextMenuAtom); useEffect(() => { @@ -106,11 +103,11 @@ export const Root: FC = ({ setData(data); }, [data]); - // remove all current selections and highlight states - const removeSelections = () => { - setCurrentIntersection(null); - setColumnSelect([]); - setColumnHover([]); + // remove column hover state + const removeHover = () => { + if (columnHover.length > 0) { + setColumnHover([]); + } }; // close all open context menus @@ -119,11 +116,11 @@ export const Root: FC = ({ }; useEffect(() => { - document.addEventListener('click', removeSelections, false); document.addEventListener('contextmenu', removeContextMenu, false); + document.addEventListener('mousemove', removeHover, false); return function removeListeners() { - document.removeEventListener('click', removeSelections, false); + document.removeEventListener('mousemove', removeHover, false); document.removeEventListener('contextmenu', removeContextMenu, false); }; }, []); diff --git a/packages/upset/src/components/Rows/AggregateRow.tsx b/packages/upset/src/components/Rows/AggregateRow.tsx index 128c1843..fc2ee91e 100644 --- a/packages/upset/src/components/Rows/AggregateRow.tsx +++ b/packages/upset/src/components/Rows/AggregateRow.tsx @@ -65,6 +65,7 @@ export const AggregateRow: FC = ({ aggregateRow }) => { return ( e.stopPropagation()} onClick={() => aggregateRow && (setCurrentIntersectionAtom(aggregateRow))} css={mousePointer} > diff --git a/packages/upset/src/components/Rows/SubsetRow.tsx b/packages/upset/src/components/Rows/SubsetRow.tsx index 54945f52..3fd31152 100644 --- a/packages/upset/src/components/Rows/SubsetRow.tsx +++ b/packages/upset/src/components/Rows/SubsetRow.tsx @@ -34,6 +34,7 @@ export const SubsetRow: FC = ({ subset }) => { return ( e.stopPropagation()} onClick={ () => { if (currentIntersection !== null && currentIntersection.id === subset.id) { // if the row is already selected, deselect it @@ -53,7 +54,9 @@ export const SubsetRow: FC = ({ subset }) => { setColumnHighlight(getBelongingSetsFromSetMembership(subset.setMembership)); } } - onMouseLeave={() => setHover(null)} + onMouseLeave={() => { + setHover(null); + }} css={mousePointer} >