initial commit

src/views/GraphEventsController.tsx

@@ -0,0 +1,35 @@
+import { useRegisterEvents, useSigma } from "react-sigma-v2";
+import { FC, useEffect } from "react";
+
+function getMouseLayer() {
+  return document.querySelector(".sigma-mouse");
+}
+
+const GraphEventsController: FC<{ setHoveredNode: (node: string | null) => void }> = ({ setHoveredNode, children }) => {
+  const registerEvents = useRegisterEvents();
+
+  /**
+   * Initialize here settings that require to know the graph and/or the sigma
+   * instance:
+   */
+  useEffect(() => {
+    registerEvents({
+      enterNode({ node }) {
+        setHoveredNode(node);
+        // TODO: Find a better way to get the DOM mouse layer:
+        const mouseLayer = getMouseLayer();
+        if (mouseLayer) mouseLayer.classList.add("mouse-pointer");
+      },
+      leaveNode() {
+        setHoveredNode(null);
+        // TODO: Find a better way to get the DOM mouse layer:
+        const mouseLayer = getMouseLayer();
+        if (mouseLayer) mouseLayer.classList.remove("mouse-pointer");
+      },
+    });
+  }, []);
+
+  return <>{children}</>;
+};
+
+export default GraphEventsController;