1 files changed, 46 insertions, 3 deletions
diff --git a/react-frontend/src/components/Visualization.js b/react-frontend/src/components/Visualization.js
index 96b2027..01093dc 100644
--- a/react-frontend/src/components/Visualization.js
+++ b/react-frontend/src/components/Visualization.js
@@ -4,14 +4,27 @@ import Graph from 'vis-react';
 
 // CSS imports
 import '../css/Canvas.css';
+import EdgeInfo from "./EdgeInfo";
 
 
 /**
- * This function renders and mantains thhe canvas.
+ * This function renders and mantains the canvas.
  * @param {Object} props The props for the canvas.
  * @returns {import("react").HtmlHTMLAttributes} The canvas to be retured.
  */
 function Visualization(props) {
+
+  /*let stocks = {};
+  let hideEdgeInfo = true;
+
+  const setStocks = (newStocks) => {
+    stocks = newStocks;
+  }
+
+  const setHideEdgeInfo = (val) => {
+    hideEdgeInfo = val;
+  }*/
+
   const [key, setKey] = useState(0);
 
   const [graphState, setGraphState] = useState({
@@ -32,6 +45,27 @@ function Visualization(props) {
     }
   }
 
+
+  /*const getEdgeInfo = (fromID, toID) => {
+      fetch("http://localhost:4567/edge-data", {
+        method: "POST",
+        body: JSON.stringify({
+          followerID: fromID,
+          leaderID:  toID,
+        }),
+        headers: {
+          "Content-Type": "application/json",
+        },
+        credentials: "same-origin"
+      })
+          .then(res  => res.json())
+          .then(data => {
+            console.log(data);
+            setStocks(data);
+            setHideEdgeInfo(false);
+          })
+          .catch(err => console.log(err));
+    }*/
   const getNodes = () => {
     let nodes = [];
     const maxScore = props.data[0].suspicionScore;
@@ -87,19 +121,28 @@ function Visualization(props) {
           color:{
             opacity: 0.7,
             highlight:'#fdca40',
-          }
+          },
+          /*chosen: {
+            edge: () => getEdgeInfo(follower.id, hub.id)
+          }*/
         });
       });
     });
     return edges;
   }
+  /*
+  * <EdgeInfo
+          stockList={stocks}
+          setHideInfo={setHideEdgeInfo}
+          hidden={hideEdgeInfo}>
+      </EdgeInfo>*/
 
   // Hooks to update graph state when data changes
   useMemo(() => {
     setKey(key => key + 1);
     setGraphState({nodes: getNodes(), edges: getEdges()})
   }, [JSON.stringify(props.data)]);
-  
+
 
   return (
     <div className="Map-canvas">