From ef8059bf567f8edf8f472eb203c2be6618049e61 Mon Sep 17 00:00:00 2001
From: Joshua Hsueh <joshua12696@gmail.com>
Date: Sun, 31 Jan 2021 11:53:34 -0500
Subject: [PATCH] working buy function and portfolio
---
frontend/src/components/Browse.js | 25 ++++++++++++++++++++++--
frontend/src/components/Portfolio.js | 29 ++++------------------------
2 files changed, 27 insertions(+), 27 deletions(-)
diff --git a/frontend/src/components/Browse.js b/frontend/src/components/Browse.js
index 1c9d8af..a73b7b5 100644
--- a/frontend/src/components/Browse.js
+++ b/frontend/src/components/Browse.js
@@ -1,4 +1,5 @@
import React, { useState, useEffect } from "react";
+import { useHistory } from "react-router-dom";
import "./assets/Browse.css";
import Plotly from "plotly.js";
import createPlotlyComponent from "react-plotly.js/factory";
@@ -8,6 +9,8 @@ const Browse = (props) => {
const [stockChartYValues, setStockChartYValues] = useState([]);
const [days, setDays] = useState(30);
const [stock, setStock] = useState("INTC");
+ const [quantity, setQuantity] = useState(0);
+ const history = useHistory();
let stockChartXValuesList = [];
let stockChartYValuesList = [];
@@ -36,6 +39,23 @@ const Browse = (props) => {
fetchStock();
}, [stock]);
+ const onSubmit = (e) => {
+ e.preventDefault();
+ const requestOptions = {
+ method: "POST",
+ headers: {
+ "Content-Type": "application/json",
+ Authorization: `Bearer ${localStorage.getItem("token")}`,
+ },
+ body: JSON.stringify({ ticker: stock, quantity: quantity }),
+ };
+ fetch(`${process.env.REACT_APP_API_ENDPOINT}/stock/create`, requestOptions)
+ .then((response) => response.json())
+ .then((data) => {
+ console.log(data);
+ });
+ };
+
return (
<div className="portfolio container">
<h1 className="d-flex justify-content-center m-2 p-4">Browse</h1>
@@ -91,14 +111,15 @@ const Browse = (props) => {
</div>
<div>
<br></br>
- <form method="POST" action="/browse/">
+ <form onSubmit={onSubmit}>
<div id="form-group">
<label className="h4">Amount:</label>
<input
className="form-control"
name="username"
type="number"
- step="0.01"
+ value={quantity}
+ onChange={(e) => setQuantity(e.target.value)}
/>
</div>
<br />
diff --git a/frontend/src/components/Portfolio.js b/frontend/src/components/Portfolio.js
index 98e8683..3570227 100644
--- a/frontend/src/components/Portfolio.js
+++ b/frontend/src/components/Portfolio.js
@@ -67,7 +67,10 @@ const Portfolio = (props) => {
</h4>
{stocks.map((stock) => {
return (
- <div className="m-1 d-inline-block text-dark text-wrap bg-white rounded p-3">
+ <div
+ key={stock.uuid}
+ className="m-1 d-inline-block text-dark text-wrap bg-white rounded p-3"
+ >
<h3>Stock: {stock.ticker}</h3>
<p>Quantity: {stock.quantity}</p>
<p>Buy Price: ${stock.price}</p>
@@ -77,30 +80,6 @@ const Portfolio = (props) => {
</div>
);
})}
- <div className="m-1 d-inline-block text-dark text-wrap bg-white rounded p-3">
- <h3>Stock: AMZN</h3>
- <p>Quantity: 5</p>
- <p>Buy Price: $3206.20</p>
- <form method="POST" action="/delete/">
- <input type="submit" value="Sell" class="btn btn-danger" />
- </form>
- </div>
- <div className="d-inline-block m-1 text-wrap bg-white text-dark rounded p-3">
- <h3>Stock: INTC</h3>
- <p>Quantity: 10</p>
- <p>Buy Price: $55.51</p>
- <form method="POST" action="/delete/">
- <input type="submit" value="Sell" class="btn btn-danger" />
- </form>
- </div>
- <div className="m-1 d-inline-block text-dark text-wrap bg-white rounded p-3">
- <h3>Stock: MSFT</h3>
- <p>Quantity: 5</p>
- <p>Buy Price: $231.96</p>
- <form method="POST" action="/delete/">
- <input type="submit" value="Sell" class="btn btn-danger" />
- </form>
- </div>
</div>
</div>
</div>