Merge branch 'main' of https://github.com/jacobmveber-01839764/BudgetBuddy

src/components/ExpenseTotal.js

@@ -1,19 +1,31 @@
-import React, { useContext } from 'react';
-import { AppContext } from '../context/AppContext';
+import React, { useState, useEffect } from 'react';
+import { getSessionKey } from "../utils/utils";
 import logo from './widget_logos/expenses_logo.png';
 import './css/ExpenseTotal.css'
 
 const ExpenseTotal = () => {
-	const { expenses } = useContext(AppContext);
+	const [expense, setExpense] = useState(0.0);
 
-	const total = expenses.reduce((total, item) => {
-		return (total += item.cost);
-	}, 0);
+	useEffect(() => {
+		fetch('https://api.bb.gabefarrell.com/w/expenses/month', {
+			method: 'GET',
+			headers: {
+			  'x-session-key': getSessionKey(),
+			},
+		})
+		.then(data => data.json())
+		.then((data) => {
+			let monthExpense = data.whole
+			monthExpense += (data.decimal / 100)
+			setExpense(monthExpense)
+		})
+		.catch(console.log)
+	}, [])
 
 	return (
 		<div className='widget p-4'>
-			<img src={logo}></img>
-			<span>This Month's Expenses: ${total}</span>
+			<img src={logo} className='expenseTotalIcon'></img>
+			<span className='widgetText'>This Month's Expenses: ${expense}</span>
 		</div>
 	);
 };

src/components/css/ExpenseTotal.css

@@ -0,0 +1,4 @@
+.widgetText {
+    padding-left: 1em;
+    color: #333;
+}

src/pages/Login.jsx

@@ -84,9 +84,9 @@ export default function Login() {
                     <p className="forgot-password">
                         Don't have an account? <a href="/signup">sign up</a>
                     </p>
-                    <p className="forgot-password">
+                    {/* <p className="forgot-password">
                     Forgot <a href="#">password?</a>
-                    </p>
+                    </p> */}
                 </form>
             </div>
         </div>

src/utils/utils.js

@@ -1,14 +1,11 @@
 export function checkLogin() {
-  var cookies = document.cookie.split(';');
-  for (var i = 0; i < cookies.length; i++) {
-    var cookie = cookies[i].trim();
-    if (cookie.indexOf('session=') === 0) {
+    if (getSessionKey() !== null) {
       // The "session" cookie exists
-      return true;
+      return true
+   } else {
+    // The "session" cookie doesn't exist
+    return false;
    }
-  }
-  // The "session" cookie doesn't exist
-  return false;
 }
 
 export function getSessionKey() {