⚡️ Disable chart tooltip on drag

pehovorka · Apr 16, 2022 · 3861d64 · 3861d64
1 parent 3e91bd7
commit 3861d64
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 2 deletions.
diff --git a/src/components/card/DragAndDropCards.js b/src/components/card/DragAndDropCards.js
@@ -29,7 +29,7 @@ export default function DragAndDropCards({ municipalities }) {
   return (
     <DragDropContext onDragEnd={handleOnDragEnd}>
       <Droppable droppableId="municipalities">
-        {(provided) => (
+        {(provided, snapshot) => (
           <Box {...provided.droppableProps} ref={provided.innerRef} mt={1}>
             {municipalities.map((municipality, index) => (
               <Draggable
@@ -50,6 +50,7 @@ export default function DragAndDropCards({ municipalities }) {
                       index={index}
                       provided={provided}
                       handleDateLimitChange={handleDateLimitChange}
+                      isDraggingOver={snapshot.isDraggingOver}
                     />
                   </Box>
                 )}

diff --git a/src/components/card/MunicipalityCard.js b/src/components/card/MunicipalityCard.js
@@ -46,6 +46,7 @@ export default function MunicipalityCard({
   provided,
   closeButtonHidden,
   handleDateLimitChange,
+  isDraggingOver,
 }) {
   const dispatch = useMunicipalitiesDispatch();
 
@@ -136,7 +137,11 @@ export default function MunicipalityCard({
         }
         title={name}
       />
-      <CardContent>
+      <CardContent
+        style={{
+          ...(isDraggingOver && { pointerEvents: "none" }),
+        }}
+      >
         <MunicipalityCasesStats municipality={municipality} code={code} />
         <Suspense
           fallback={
@@ -177,4 +182,5 @@ MunicipalityCard.propTypes = {
   provided: PropTypes.object,
   closeButtonHidden: PropTypes.bool,
   handleDateLimitChange: PropTypes.func,
+  isDraggingOver: PropTypes.bool,
 };