From 5f01d4efcfbfa8d331f4e79f2b45024148d13cfc Mon Sep 17 00:00:00 2001 From: Van Nguyen Date: Fri, 24 Jan 2025 20:05:24 -0500 Subject: [PATCH 1/2] include obj and properties in gitignore and update MainPage --- .gitignore | 4 ++++ tradingwebapp.client/src/PageMain.tsx | 6 ++++++ 2 files changed, 10 insertions(+) diff --git a/.gitignore b/.gitignore index 8d7e9c5..5b707ec 100644 --- a/.gitignore +++ b/.gitignore @@ -24,3 +24,7 @@ dist-ssr *.sw? .vs/ + +# Ignore the obj and Properties directories +obj/ +Properties/ diff --git a/tradingwebapp.client/src/PageMain.tsx b/tradingwebapp.client/src/PageMain.tsx index cbd3ffd..061b68e 100644 --- a/tradingwebapp.client/src/PageMain.tsx +++ b/tradingwebapp.client/src/PageMain.tsx @@ -3,6 +3,12 @@ import { readUser } from './api-user'; import { readStock, Stock } from './api-stock'; import { lookup } from './api-quote'; +//Hello Van Nguyen +/* +The MainApp page displays a user’s portfolio, showing their cash balance, stock holdings, total stock value, +and overall assets. It fetches data in real-time, calculates key metrics, and organizes stock details +in a table for easy viewing. +*/ const MainApp: React.FC = () => { const [userData, setUserData] = useState<{ username: string; cash: number; } | null>(null); const [stocks, setStocks] = useState([]); From e8558c3f99f0c5243042f0cd9d1a226e1e4c045a Mon Sep 17 00:00:00 2001 From: Van Nguyen Date: Fri, 24 Jan 2025 20:41:56 -0500 Subject: [PATCH 2/2] Update README.md and styles.css according to the issue and reviewer's comment --- README.md | 11 +++++++++++ tradingwebapp.client/src/assets/styles.css | 9 ++++++--- 2 files changed, 17 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index a447182..e215f3b 100644 --- a/README.md +++ b/README.md @@ -40,6 +40,17 @@ I utilize third-party APIs for fetching live stock prices and other indicators f - Utilizes React for state management, including user input validation before sending data to the server - Implements cookie-based authentication to reduce the need for repeated sign-ins +#### BuyPage Component +The BuyPage component allows users to search for stock quotes, view their current portfolio, and purchase stocks. +It provides real-time stock data, calculates total costs, and ensures users have sufficient funds before completing transactions. + +#### PageTransaction Component +The PageTransaction component displays a user's transaction history, including details such as transaction type, stock symbol, shares, +unit price, and total values. It also shows the user's current balance with an option to toggle its visibility. +#### Login Component +The Login component provides a simple user authentication interface, allowing users to enter their username and password to log in. +It displays success or error messages based on the login attempt and redirects the user to the main page upon successful authentication. + # START APPLICATION ### For Client diff --git a/tradingwebapp.client/src/assets/styles.css b/tradingwebapp.client/src/assets/styles.css index 625e8d4..9e51a3e 100644 --- a/tradingwebapp.client/src/assets/styles.css +++ b/tradingwebapp.client/src/assets/styles.css @@ -1,11 +1,13 @@ /* Size for brand */ +/* Ensures the brand name appears prominently */ nav .navbar-brand { - font-size: xxx-large; + font-size: xxx-large; } +/* Makes navigation links visually distinct */ .navbar-nav .nav-item .nav-link { - font-weight: bold; - font-size: x-large; + font-weight: bold; + font-size: x-large; } /* Colors for brand */ @@ -24,6 +26,7 @@ nav .navbar-brand .yellow { nav .navbar-brand .green { color: #2e944b; } +/* Main content styling */ .Main { margin-top: 15px; margin-left: 20px;