working updates

.vscode/launch.json

@@ -9,7 +9,8 @@
             "type": "chrome",
             "request": "launch",
             "url": "http://localhost:6969",
-            "webRoot": "${workspaceRoot}/react-backend/client/src"
+            // "webRoot": "${workspaceRoot}/react-backend/client/src"
+            "port": 9223
         },
         {
             "type": "node",

client/src/components/Accounts.jsx

@@ -1,10 +1,29 @@
-import React from "react";
+import React, { useState, useEffect } from "react";
 import MTable from "./accountTable";
+import axios from "axios";
 
 function Accounts() {
+  const readCookie = async () => {
+    try {
+      const res = await axios.get("/readCookie");
+
+      if (res.data === "No Cookie Set") {
+        document.location = "/"
+        // this.props.history.push('/accounts');
+      }
+    } catch (e) {
+      // setScreen("auth");
+      console.log(e);
+    }
+  };
+
+  useEffect(() => {
+    readCookie();
+  }, []);
+
   return (
     <div style={{ padding: "30px" }}>
-      <MTable/>
+      <MTable />
     </div>
   );
 }

client/src/components/AddAccount.jsx

@@ -42,6 +42,11 @@ class AddAccount extends Component {
       .then((res) => {
         console.log(res);
         console.log(res.data);
+        if (res.data.includes('Added successfully')) {
+          document.location = "/accounts";
+        } else {
+          document.location = "/AddAccount";
+        }
       });
   };
 

client/src/components/Home.jsx

@@ -3,42 +3,17 @@ import ReactDOM from "react-dom";
 
 import axios from "axios";
 
-function View(props) {
+function App() {
-  const { screen, setScreen } = props;
-
-  const [data, setData] = useState();
-
   const deleteCookie = async () => {
     try {
       await axios.get("/readCookie/clear");
-      setScreen("auth");
+    
     } catch (e) {
       console.log(e);
     }
   };
 
-  const getData = async () => {
+  const [username, setUsername] = useState();
-    try {
-      const res = await axios.get("/get-data");
-      console.log(res.data);
-      setData(res.data);
-    } catch (e) {
-      console.log(e);
-    }
-  };
-
-  return (
-    <div>
-      <p>{screen}</p>
-      <p>{data}</p>
-      <button onClick={getData}>Get Data</button>
-      <button onClick={deleteCookie}>Logout</button>
-    </div>
-  );
-}
-
-function App() {
-    const [username, setUsername] = useState();
   const [password, setPassword] = useState();
 
   const auth = async () => {
@@ -46,49 +21,28 @@ function App() {
       const res = await axios.get("/login", {
         auth: { username, password },
       });
-
+      if (res.data.auth === "Success") {
-      if (res.data !== undefined) {
+        document.location = "/accounts";
-        // setScreen('/about');
       }
     } catch (e) {
       console.log(e);
     }
   };
 
-  const readCookie = async () => {
-    try {
-      const res = await axios.get("/readCookie");
-
-      if (res.data !== "No Cookie Set") {
-        // document.location = "/accounts"
-        // this.props.history.push('/accounts');
-      }
-    } catch (e) {
-      // setScreen("auth");
-      console.log(e);
-    }
-  };
-
-  useEffect(() => {
-    readCookie();
-  }, []);
-
   return (
     <div className="App">
-        <div>
+      <div>
-          <label>Username: </label>
+        <label>Username: </label>
-          <br />
+        <br />
-          <input type="text" onChange={(e) => setUsername(e.target.value)} />
+        <input type="text" onChange={(e) => setUsername(e.target.value)} />
-          <br />
+        <br />
-          <label>Password: </label>
+        <label>Password: </label>
-          <br />
+        <br />
-          <input
+        <input type="password" onChange={(e) => setPassword(e.target.value)} />
-            type="password"
+        <br />
-            onChange={(e) => setPassword(e.target.value)}
+        <button onClick={auth}>Login</button> - 
-          />
+        <button onClick={deleteCookie}>Logout</button>
-          <br />
+      </div>
-          <button onClick={auth}>Login</button>
-        </div>
     </div>
   );
 }

client/src/data.js

@@ -1,44 +0,0 @@
-export const data = [
-    {
-        id: 1,
-        title: 'The Hunger Games',
-        authors: 'Suzanne Collins',
-        num_pages: 374,
-        rating: 4.33
-    },
-    {
-        id: 2,
-        title: 'Harry Potter and the Order of the Phoenix',
-        authors: 'J.K. Rowling',
-        num_pages: 870,
-        rating: 4.48
-    },
-    {
-        id: 3,
-        title: 'To Kill a Mockingbird',
-        authors: 'Harper Lee',
-        num_pages: 324,
-        rating: 4.27
-    },
-    {
-        id: 4,
-        title: 'Pride and Prejudice',
-        authors: 'Jane Austen',
-        num_pages: 279,
-        rating: 4.25
-    },
-    {
-        id: 5,
-        title: 'Twilight',
-        authors: 'Stephenie Meyer',
-        num_pages: 498,
-        rating: 3.58
-    },
-    {
-        id: 6,
-        title: 'The Book Thief',
-        authors: 'Markus Zusak',
-        num_pages: 552,
-        rating: 4.36
-    }
-];

routes/login.js

@@ -18,9 +18,9 @@ router.get('/', function (req, res, next) {
       res.cookie('user', 3, options)
     }
   } catch (error) {
-    res.render('index', { title: 'No Auth' });
+    res.send({ auth: 'Fail' });
   }
-  res.render('index', { title: 'Express' });
+  res.send({ auth: 'Success' });
 });
 
 module.exports = router;