promise wrangling

client/src/components/User/LoginForm.tsx

@@ -1,6 +1,8 @@
 import { useState, useReducer } from "react";
 import { reducer, initialState } from "../../store/store";
-import { handleLogin } from "../../util/apiUtils";
+import { ActionType, undefinedUser } from "../../store/store_types";
+import { userInfo, LoginHeaders } from "../../types/main";
+import { handleLogin, getOneUser } from "../../util/apiUtils";
 import Page from "../../util/Page";
 
 enum PassVisible {
@@ -13,15 +15,26 @@ function LoginForm() {
 
     const [username, setUsername] = useState('');
     const [password, setPassword] = useState('');
-    const [showPass, setShowPass] = useState<PassVisible>(PassVisible.hide);
+    const [showPass, setShowPass] = useState(PassVisible.hide);
 
     const displaySession = async () => {
         if (username === '' || password === '') return;
         
-        const headers = handleLogin(username, password)
-        .then(res => res?.json());
+        const response = await handleLogin(username, password);
+        const json = await response?.json();
 
-        if (headers) console.log(headers);
+        if (json) {
+            console.log(json);
+            console.log(json.user);
+
+            let thisUser: userInfo = {
+                email: json.user.email,
+                password: json.user.password,
+                headers: json
+            }
+
+            dispatch({ type: ActionType.UPDATEONE, payload: thisUser });
+        }
     }
 
     return (

client/src/store/store.ts

@@ -1,5 +1,5 @@
 import { createContext } from "react";
-import { ActionType,userAction, appState, undefinedUser, emptyCart } from './store_types';
+import { ActionType, userAction, appState, undefinedUser, emptyCart } from './store_types';
 
 export const initialState: appState = {
     searchTerm: '',
@@ -23,6 +23,11 @@ export const reducer = (state: appState, action: userAction) => {
                 ...state,
                 searchTerm: payload
             }
+        case ActionType.USERLOGIN:
+            return {
+                ...state,
+                user: payload
+            }
         default:
             return state;
     }

client/src/store/store_types.ts

@@ -7,6 +7,7 @@ export enum ActionType {
     REGISTERNEW,
     UPDATEONE,
     SEARCH,
+    USERLOGIN
 }
 
 export interface userAction {

client/src/types/main.d.ts

@@ -1,11 +1,18 @@
+// user details and metadata
 export type userInfo = {
     email: string;
     id?: number;
-    name: string;
+    name?: string;
     password: string;
     headers: object
 }
 
+export type LoginHeaders = {
+    email: string,
+    password: string
+}
+
+// product info
 export type Product = {
     productID?: number,
     name: string,
@@ -22,6 +29,7 @@ export type Category = {
     longDescription?: string
 }
 
+// user-specific cart and order details
 export type Cart = {
     cartID: number,
     userInfo: userInfo,

client/src/util/apiUtils.ts

@@ -7,6 +7,13 @@ export const getAllUsers = async () => {
     return serverCall;
 }
 
+export const getOneUser = async (email: string) => {
+    let serverCall = await fetch(`http://localhost:8088/users?email=${email}`)
+    .then(res => res.json());
+
+    return serverCall;
+}
+
 export const registerNewUser = async (user: userInfo) => {
     let serverCall = await fetch('http://localhost:8088/register', {
         method: "POST",