Merge pull request #16 from cs0320-2021/search-by-holder_id

can search trades by holder id

2 files changed, 63 insertions, 50 deletions

diff --git a/react-frontend/src/components/HubList.js b/react-frontend/src/components/HubList.js
index c9a5156..8aeb013 100644
--- a/react-frontend/src/components/HubList.js
+++ b/react-frontend/src/components/HubList.js
@@ -4,18 +4,18 @@ import Hub from "./Hub.js";
 import InvestorInfo from "./InvestorInfo.js";
 
 // CSS import
-import '../css/UserCheckin.css';
+import "../css/UserCheckin.css";
 
 /**
  * Component that build the checkin list and displays checkin info.
- * @returns {import('react').HtmlHTMLAttributes} A div with the hubs 
+ * @returns {import('react').HtmlHTMLAttributes} A div with the hubs
  * in a vertical layout.
  */
 function HubList(props) {
   const [hubItems, setHubItems] = useState([]);
   const [isSelected, setIsSelected] = useState(false);
-  const [name, setName] = useState('');
-  
+  const [name, setName] = useState("");
+
   /**
    * Loads new the checkins into the current cache/map of hubs.
    */
@@ -23,41 +23,54 @@ function HubList(props) {
     // sort and create the elemnts
     let hubs = [];
     //const sorted = props.data.sort((a, b) => b.suspicionScore - a.suspicionScore);
-    props.data.forEach(hub => hubs.push(
-      <Hub key={hub.id} id={hub.id} name={hub.name} value={hub.suspicionScore} setSelected={props.setSelected}></Hub>
-    ));
+    props.data.forEach((hub) =>
+      hubs.push(
+        <Hub
+          key={hub.id}
+          id={hub.id}
+          name={hub.name}
+          value={hub.suspicionScore}
+          setSelected={props.setSelected}
+        ></Hub>
+      )
+    );
 
     setHubItems(hubs);
-  }
+  };
 
   const getName = () => {
-    props.data.forEach(hub => {
+    props.data.forEach((hub) => {
       if (hub.id === props.selected) {
         setName(hub.name);
       }
-    })
-    setName('');
-  }
+    });
+    setName("");
+  };
 
-  
   // React hook that updates when the hubs are recalculated
   useEffect(() => updateHubItems(), [props.data]);
 
   //React hook to show data for an investor
   useEffect(() => {
-    setIsSelected(true)
+    setIsSelected(true);
     getName();
+    console.log("DEVLOG");
   }, [props.selected]);
 
   return (
     <div className="User-checkin">
-        <div className="Checkins">
-            <h2>Suspicion Ranks</h2>
-            <ul className='Checkin-list'>{hubItems}</ul>
-        </div>
-        <InvestorInfo personId={props.selected} isSelected={isSelected} name={name} dates={props.dates}></InvestorInfo>
+      <div className="Checkins">
+        <h2>Suspicion Ranks</h2>
+        <ul className="Checkin-list">{hubItems}</ul>
+      </div>
+      <InvestorInfo
+        personId={props.selected}
+        isSelected={isSelected}
+        name={name}
+        dates={props.dates}
+      ></InvestorInfo>
     </div>
   );
 }
 
-export default HubList;
\ No newline at end of file
+export default HubList;
diff --git a/react-frontend/src/components/InvestorInfo.js b/react-frontend/src/components/InvestorInfo.js
index d368984..703c4c6 100644
--- a/react-frontend/src/components/InvestorInfo.js
+++ b/react-frontend/src/components/InvestorInfo.js
@@ -2,7 +2,7 @@
 import { useEffect, useState } from "react";
 
 // CSS import
-import '../css/UserCheckin.css';
+import "../css/UserCheckin.css";
 
 /**
  * Componenet for checkins. Has a toggle to show more info.
@@ -12,40 +12,40 @@ import '../css/UserCheckin.css';
 function InvestorInfo(props) {
   const [info, setInfo] = useState({});
 
-  const toEpochMilli = date => Date.parse(date);
+  const toEpochMilli = (date) => Date.parse(date);
   const getInfo = () => {
-    console.log({ 
+    console.log({
       person: props.name,
-      start:  toEpochMilli(props.dates.start), 
-      end:    toEpochMilli(props.dates.end) 
+      start: toEpochMilli(props.dates.start),
+      end: toEpochMilli(props.dates.end),
     });
 
-    if (props.name === "") {
+    if (props.name === "Mathews Krista Jean") {
       return;
     }
-  
+
     fetch("http://localhost:4567/profit", {
-        method: "POST",
-        body: JSON.stringify({ 
-          person: props.name,
-          start:  toEpochMilli(props.dates.start), 
-          end:    toEpochMilli(props.dates.end) 
-        }),
-        headers: {
-          "Content-Type": "application/json",
-        },
-        credentials: "same-origin"
-    })
-    .then(res  => {
-      console.log(res);
-      res.json();
-    })
-    .then(data => {
-      console.log(data);
-      setInfo(data);
+      method: "POST",
+      body: JSON.stringify({
+        person: props.name,
+        start: toEpochMilli(props.dates.start),
+        end: toEpochMilli(props.dates.end),
+      }),
+      headers: {
+        "Content-Type": "application/json",
+      },
+      credentials: "same-origin",
     })
-    .catch(err => console.log(err));
-  }
+      .then((res) => {
+        console.log(res);
+        res.json();
+      })
+      .then((data) => {
+        console.log(data);
+        setInfo(data);
+      })
+      .catch((err) => console.log(err));
+  };
   /*
 
   const coords = userCoords.map((coord, index) =>
@@ -54,13 +54,13 @@ function InvestorInfo(props) {
     </li>
   );*/
 
-  useEffect(() => getInfo(), [props.name, props.isSelected, props.personId])
+  useEffect(() => getInfo(), [props.name, props.isSelected, props.personId]);
 
   return (
-    <div className="Chosen-user" hidden={props.isSelected}>
+    <div className="Chosen-user" hidden={false}>
       hi
     </div>
   );
 }
 
-export default InvestorInfo;
\ No newline at end of file
+export default InvestorInfo;