Merge Spring changes to tom

client/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "team-6",
+  "name": "TaskBlaster",
   "version": "0.1.0",
   "private": true,
   "dependencies": {
@@ -10,7 +10,6 @@
     "@testing-library/jest-dom": "^4.2.4",
     "@testing-library/react": "^9.5.0",
     "@testing-library/user-event": "^7.2.1",
-    "axios": "^0.19.2",
     "date-fns": "^2.12.0",
     "react": "^16.13.1",
     "react-dom": "^16.13.1",

client/public/manifest.json

@@ -1,6 +1,6 @@
 {
-  "short_name": "React App",
-  "name": "Create React App Sample",
+  "short_name": "TaskBlaster",
+  "name": "TaskBlaster Project Management Tool",
   "icons": [
     {
       "src": "favicon.ico",

client/src/api/TaskAPI.js

@@ -9,8 +9,11 @@ const HEADERS =  {
 
 class TaskAPI {
 
-    async getAllTasks(removeTask) {
-        const responseJson = await (await fetch(`${API_URL}/tasks`)).json();
+    async getAllTasks(removeTask) {        
+        const response = await fetch(`${API_URL}/tasks`);
+        console.log(`GET: ${response.status}`);
+        const responseJson = await response.json();
+
         var taskComponents = [];
         for (let [key, taskData] of Object.entries(responseJson)) {
             taskComponents[key] = 

client/src/components/Appbar.js

@@ -15,6 +15,8 @@ import Grid from '@material-ui/core/Grid';
 import { makeStyles, useTheme } from '@material-ui/core/styles';
 import { MenuList, MenuItem } from '@material-ui/core';
 import { Link } from 'react-router-dom';
+import * as logo from '../images/logo_no_bg.png';
+import { withRouter } from "react-router-dom"
 
 const drawerWidth = 240;
 
@@ -60,24 +62,45 @@ const useStyles = makeStyles((theme) => ({
   },
   button: {
     color: "white",
+  },
+  logo: {
+    height: "auto",
+    width: "auto",
+    maxHeight: "64px",
+    maxWidth: "250px",
+    paddingTop: "8px"
   }
 }));
 
-export default function Appbar() {
+function Appbar(props) {
   const classes = useStyles();
   const theme = useTheme();
   const [open, setOpen] = React.useState(false);
 
+  const changeTitle = () => {
+    switch(window.location.pathname) {
+      case '/':
+        return 'Home';
+      case '/tasks':
+        return 'My Tasks';
+      case '/login':
+        return 'Login';
+      case '/signup':
+        return 'Sign Up';
+      default:
+        return 'Home';
+    }
+  }
+
   const handleDrawerOpen = () => {
     setOpen(true);
   };
 
   const handleDrawerClose = () => {
     setOpen(false);
   };
-
-  // TODO:
-  // Return different appbars for unauthenticated and authenticated
+
+  let title = changeTitle();
   return (
     <div className={classes.root}>
       <CssBaseline />
@@ -101,9 +124,10 @@ export default function Appbar() {
               </IconButton>
             </Grid>
             <Grid item>
-              <Typography type="title" variant="h6" noWrap>
-                TaskBlaster
-              </Typography>
+              <img src={logo} className={classes.logo} alt="logo" />
+            </Grid>
+            <Grid item>
+              <Typography type="title" variant="h6" noWrap> {title} </Typography>
             </Grid>
             {/* Pad out the middle of the appbar */}
             <Grid item xs />
@@ -141,3 +165,4 @@ export default function Appbar() {
   );
 }
 
+export default withRouter(Appbar);

client/src/components/Home.js

@@ -3,10 +3,11 @@ import logo from '../images/logo.svg';
 import './Home.css';
 
 export default function Home() {
+    document.title = "Home | TaskBlaster"
+
     return (
         <div className="Home">
             <img src={logo} className="App-logo" alt="logo" />
-            Home
         </div>
     )
 }

client/src/components/Login.js

@@ -6,7 +6,7 @@ import Button from '@material-ui/core/Button';
 import TextField from '@material-ui/core/TextField';
 import FormControlLabel from '@material-ui/core/FormControlLabel';
 import Checkbox from '@material-ui/core/Checkbox';
-import { CssBaseline, Container } from '@material-ui/core';
+import { CssBaseline } from '@material-ui/core';
 
 const useStyles = makeStyles(theme => ({
     content: {
@@ -46,13 +46,13 @@ const changeHandler = () => {
 }
 
 function Login() {
+    document.title = "Login | TaskBlaster"
+
     const classes = useStyles();
     return (
         <Box className={classes.content}>
             <CssBaseline />
-            <Typography className={classes.typography} component="h1" variant="h5">
-                Sign in
-            </Typography>
+            <Typography className={classes.typography} component="h1" variant="h5"> {document.title.split("|")[0]} </Typography>
             <form onSubmit={doLogin} noValidate>
                 <TextField
                     className={classes.field}

client/src/components/SignUp.js

@@ -47,13 +47,13 @@ const changeHandler = () => {
 }
 
 function SignUp() {
+    document.title = "Sign Up | TaskBlaster"
+
     const classes = useStyles();
     return (
         <Box className={classes.content}>
             <CssBaseline />
-            <Typography className={classes.typography} component="h1" variant="h5">
-                Sign up
-            </Typography>
+            <Typography className={classes.typography} component="h1" variant="h5"> {document.title.split("|")[0]} </Typography>
             <form onSubmit={doSignUp} noValidate>
                 <Grid container spacing={2}>
                     <Grid item xs={12} sm={6}>

client/src/components/Tasks.js

@@ -45,7 +45,7 @@ class Tasks extends React.Component {
             showDialog: false
         }
         this.removeTask = this.removeTask.bind(this);
-
+        document.title = "My Tasks | TaskBlaster";
     }
 
     componentDidMount() {

client/src/components/App.test.js → client/src/test/App.test.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { render } from '@testing-library/react';
-import App from './App';
+import App from '../components/App';
 
 // test('renders learn react link', () => {
 //   const { getByText } = render(<App />);