Merge pull request #18 from cs0320-2021/invester-info

investor info display

1 files changed, 26 insertions, 2 deletions

diff --git a/react-frontend/src/components/InvestorInfo.js b/react-frontend/src/components/InvestorInfo.js
index 703c4c6..562b912 100644
--- a/react-frontend/src/components/InvestorInfo.js
+++ b/react-frontend/src/components/InvestorInfo.js
@@ -3,6 +3,7 @@ import { useEffect, useState } from "react";
 
 // CSS import
 import "../css/UserCheckin.css";
+import "../css/InvesterInfo.css";
 
 /**
  * Componenet for checkins. Has a toggle to show more info.
@@ -20,7 +21,7 @@ function InvestorInfo(props) {
       end: toEpochMilli(props.dates.end),
     });
 
-    if (props.name === "Mathews Krista Jean") {
+    if (props.name === "") {
       return;
     }
 
@@ -54,11 +55,34 @@ function InvestorInfo(props) {
     </li>
   );*/
 
+  const stockTable = () => {
+    return (
+      <div id="stockTable">
+        <div className="tableHeader">
+          <div className="symbol-row">Symbol</div>
+          <div className="gain-row">Realized gain</div>
+          <div className="gain-row">Unrealized gain</div>
+        </div>
+      </div>
+    );
+  };
+
   useEffect(() => getInfo(), [props.name, props.isSelected, props.personId]);
 
   return (
     <div className="Chosen-user" hidden={false}>
-      hi
+      <h2 id="investerName">{"CRUTCHFIELD BRADFORD"}</h2>
+      <div id="top-bar">
+        <div id="gain-number">
+          <p className="bigNumber">{583}$</p> gain
+        </div>
+
+        <div>
+          <p className="bigNumber">{2.8}%</p>
+          compared to {1.2}% on SP500
+        </div>
+      </div>
+      {stockTable()}
     </div>
   );
 }