chore: tightens typings on interaction reducers

src/components/Node/Node.tsx

@@ -110,7 +110,7 @@ export const Node = ({ node, iconUrl }: Props) => {
           />
         </Box>
         <LabelContainer
-          labelHeight={(node.labelHeight + iconSize.height) * zoom}
+          labelHeight={node.labelHeight + iconSize.height}
           tileSize={projectedTileSize}
           connectorDotSize={5 * zoom}
         >

src/interaction/reducers/Cursor.ts

@@ -2,6 +2,7 @@ import { SidebarTypeEnum, InteractionReducer } from 'src/types';
 import { CoordsUtils, filterNodesByTile } from 'src/utils';
 
 export const Cursor: InteractionReducer = {
+  type: 'CURSOR',
   mousemove: (draftState) => {
     if (draftState.mode.type !== 'CURSOR') return;
 

src/interaction/reducers/DragItems.ts

@@ -2,6 +2,7 @@ import { CoordsUtils } from 'src/utils';
 import { InteractionReducer } from 'src/types';
 
 export const DragItems: InteractionReducer = {
+  type: 'DRAG_ITEMS',
   mousemove: (draftState) => {
     if (draftState.mode.type !== 'DRAG_ITEMS') return;
 
@@ -24,7 +25,6 @@ export const DragItems: InteractionReducer = {
       });
     }
   },
-  mousedown: () => {},
   mouseup: (draftState) => {
     draftState.mode = { type: 'CURSOR', showCursor: true, mousedown: null };
   }

src/interaction/reducers/Lasso.ts

@@ -2,6 +2,7 @@ import { CoordsUtils, isWithinBounds } from 'src/utils';
 import { InteractionReducer } from 'src/types';
 
 export const Lasso: InteractionReducer = {
+  type: 'LASSO',
   mousemove: (draftState) => {
     if (draftState.mode.type !== 'LASSO') return;
 
@@ -74,6 +75,5 @@ export const Lasso: InteractionReducer = {
       showCursor: true,
       mousedown: null
     };
-  },
-  mouseup: () => {}
+  }
 };

src/interaction/reducers/Pan.ts

@@ -2,6 +2,8 @@ import { CoordsUtils } from 'src/utils';
 import { InteractionReducer } from 'src/types';
 
 export const Pan: InteractionReducer = {
+  type: 'PAN',
+  entry: () => {},
   mousemove: (draftState) => {
     if (draftState.mode.type !== 'PAN') return;
 
@@ -13,7 +15,5 @@ export const Pan: InteractionReducer = {
           )
         : draftState.scroll.position;
     }
-  },
-  mousedown: () => {},
-  mouseup: () => {}
+  }
 };

src/interaction/useInteractionManager.ts

@@ -68,6 +68,9 @@ export const useInteractionManager = () => {
         return;
 
       const reducerAction = reducer[e.type];
+
+      if (!reducerAction) return;
+
       const componentOffset = rendererRef.current?.getBoundingClientRect();
       const offset: Coords = {
         x: componentOffset?.left ?? 0,

src/types/interactions.ts

@@ -20,7 +20,9 @@ export interface State {
 export type InteractionReducerAction = (state: Draft<State>) => void;
 
 export type InteractionReducer = {
-  mousemove: InteractionReducerAction;
-  mousedown: InteractionReducerAction;
-  mouseup: InteractionReducerAction;
+  type: string;
+  entry?: InteractionReducerAction;
+  mousemove?: InteractionReducerAction;
+  mousedown?: InteractionReducerAction;
+  mouseup?: InteractionReducerAction;
 };