Merge pull request #7 in NP/ncippe-front-end from demo-prep to master

Squashed commit of the following:

commit 5bf0403106c4f5731cc677d0ebe1f5faebd11d0f
Merge: 2606e64 ac73cb2
Author: alifr <[email protected]>
Date:   Wed Aug 7 16:19:56 2019 -0400

    Merge remote-tracking branch 'origin/master' into demo-prep

commit 2606e647466fcdc7d2f4998eb0401be9b604ea0d
Author: alifr <[email protected]>
Date:   Wed Aug 7 16:09:40 2019 -0400

    Add Breadcrumb component

commit 08fdc793b3f864d42f8dc63caa6f32aa985b00cf
Author: alifr <[email protected]>
Date:   Wed Aug 7 16:08:19 2019 -0400

    add footer styles

commit 401c37957287278b2075354431f30f430225914b
Author: alifr <[email protected]>
Date:   Wed Aug 7 16:08:06 2019 -0400

    update logo text

commit aa512a399130a2467d7a36c48a799f763cc14237
Author: alifr <[email protected]>
Date:   Wed Aug 7 16:06:07 2019 -0400

    add transitionGroup CSS effects

commit 96b4fd984ce24567a1e8ddf4f375191612c5808f
Author: alifr <[email protected]>
Date:   Wed Aug 7 16:05:39 2019 -0400

    fetch user data and pass it to children components

    switch router

commit a3715dc40863b51ac38ac857a43c1c443098a846
Author: alifr <[email protected]>
Date:   Wed Aug 7 16:04:51 2019 -0400

    switch router. implement context reducer

commit ed6fcb513fcc54f965b6747c8e59531030d845d0
Author: alifr <[email protected]>
Date:   Wed Aug 7 16:03:56 2019 -0400

    Update router Link component

commit 63798d76997a49206e6b57d7f35c56f3123540fc
Author: alifr <[email protected]>
Date:   Wed Aug 7 16:03:07 2019 -0400

    remove withRouter. Fetch user data if necessry

    Add user profile data for Providers

commit a1bcf9e19a44aae92c0db1d783140b60b000cf72
Author: alifr <[email protected]>
Date:   Wed Aug 7 16:00:15 2019 -0400

    Switch router Link component. Add Link to cards

commit bf99eaa761a4bba3e01844ab8b7dc24cea95c829
Author: alifr <[email protected]>
Date:   Wed Aug 7 15:59:18 2019 -0400

    remove fetch calls and extra state handling

    Data is now coming from the parent component

commit f35c0c475ac2e93e8229bbd394e71ebb3ebaf86c
Author: alifr <[email protected]>
Date:   Wed Aug 7 15:55:07 2019 -0400

    update api's and mock data to reflect PROD

    Also improving error handling

commit 3f4fb699f97072bc1f3406453e42c50749d39c77
Author: alifr <[email protected]>
Date:   Wed Aug 7 15:53:46 2019 -0400

    update context to use reducer pattern

commit d743964601bb4e03f07af5e1836096a351cc6975
Author: alifr <[email protected]>
Date:   Wed Aug 7 15:53:02 2019 -0400

    Update routes component

commit 9ead2b12e0e6c071043cdd474a878e5c1ae8c206
Author: alifr <[email protected]>
Date:   Wed Aug 7 15:52:08 2019 -0400

    update test server routes

commit 6b2ff994d7722c68345a73ac3ea0b063eadfe0d8
Author: alifr <[email protected]>
Date:   Wed Aug 7 15:51:45 2019 -0400

    switch router and add transition group

commit 4a498a1f9466855609025ec1d2de03e29ec3ff9a
Author: alifr <[email protected]>
Date:   Mon Aug 5 15:35:04 2019 -0400

    update prod api calls

commit 5efa0e4f8e45658b896ab7c75f50e0159c9a5e92
Author: alifr <[email protected]>
Date:   Mon Aug 5 15:34:40 2019 -0400

    add router to testResults view

commit 13d1ddf7f16d7af63f968e36d2271a4e17efeb25
Author: alifr <[email protected]>
Date:   Mon Aug 5 14:34:10 2019 -0400

    update argument name

commit f7843fdb0a8e0dac5aa5ccbcccbe9bce50fe817e
Author: alifr <[email protected]>
Date:   Mon Aug 5 14:33:19 2019 -0400

    update component name

commit 359dae9a21652e03d9045cd36c49e6d72e5532ec
Author: alifr <[email protected]>
Date:   Fri Aug 2 17:33:47 2019 -0400

    add id's to users

commit ed8e0e2425ea04db96e2abdd636d01fb8e337eb4
Author: alifr <[email protected]>
Date:   Fri Aug 2 14:19:45 2019 -0400

    add Heroku to local dev environment

commit 897612f1e05b5cd0945767ab6c54d9f29b21d888
Author: alifr <[email protected]>
Date:   Fri Aug 2 13:35:30 2019 -0400

    add pages and placeholders for DashboardPage

commit 66eb00c2b0aa5c8064ebc1fe714552fc1cf816d7
Author: alifr <[email protected]>
Date:   Fri Aug 2 13:34:28 2019 -0400

    Add TestResults component

commit cc2920c8285839af097bd5607d83d3b4cd7bec5f
Author: alifr <[email protected]>
Date:   Fri Aug 2 13:32:22 2019 -0400

    add momentjs

commit 69c153f414dc05ded7be77f9f25eb13f414af734
Author: alifr <[email protected]>
Date:   Fri Aug 2 14:25:24 2019 -0400

    fetch patientList using Provider's GUID

commit dc10b52e45d0aa5683416a93942bf76597c671bf
Author: alifr <[email protected]>
Date:   Thu Aug 1 15:48:43 2019 -0400

    fixup! Add patient list component

commit 81dc625a2d3da1418616f6185aab0628ab04eb0b
Author: alifr <[email protected]>
Date:   Thu Aug 1 15:45:42 2019 -0400

    Add patient list component

commit 40ef5e46a51955b3b58f4b4727aa034ad0f08693
Author: alifr <[email protected]>
Date:   Thu Aug 1 09:43:06 2019 -0400

    update api calls. update mock data

src/components/Breadcrumbs/Breadcrumbs.js

@@ -0,0 +1,46 @@
+import React from 'react';
+import { Container, Typography, Button } from '@material-ui/core';
+import { makeStyles } from '@material-ui/core/styles'
+import { Link, navigate } from '@reach/router';
+import { Close } from '@material-ui/icons'
+
+const useStyles = makeStyles(theme => ({
+  Breadcrumbs: {
+    position: 'relative',
+    display: 'flex',
+    justifyContent: 'space-between',
+    alignItems: 'center',
+    padding: theme.spacing(3),
+    marginBottom: theme.spacing(2),
+    width: 'auto',
+    backgroundColor: theme.palette.common.white,
+    boxShadow: theme.shadows[1]
+  },
+  pipe: {
+    padding: `0 ${theme.spacing(2)}px`
+  },
+  close: {
+    float: 'right',
+    textTransform: 'none',
+    fontSize: theme.typography.h6.fontSize
+  }
+}))
+
+const Breadcrumbs = (props) => {
+  const classes = useStyles();
+  const handleClick = (event) => {
+    navigate('/dashboard')
+  }
+  return (
+    <Container className={classes.Breadcrumbs}>
+      <Typography variant="h5" component="p">
+        <Link to="/dashboard">Home</Link> <span className={classes.pipe}>|</span> {props.pageName}
+      </Typography>
+
+      <Button variant="text" color="primary" size="large" className={classes.close} onClick={handleClick}><Close/>Close</Button>
+
+    </Container>
+  )
+}
+
+export default Breadcrumbs;

src/components/region/Footer/Footer.js

@@ -1,10 +1,31 @@
 import React from 'react';
+import { makeStyles } from '@material-ui/core/styles'
+
+const useStyles = makeStyles(theme => ({
+  root: {
+    backgroundColor: '#0D1C3C',
+    padding: theme.spacing(3),
+    color: theme.palette.common.white
+  },
+  logo: {
+    float: 'left',
+    border: `1px solid ${theme.palette.common.white}`,
+    padding: theme.spacing(2)
+  },
+  links: {
+    float: 'right',
+    border: `1px solid ${theme.palette.common.white}`,
+    padding: theme.spacing(2)
+  }
+}))
+
 
 const Footer = () => {
+  const classes = useStyles()
   return (
-    <footer>
-      <div>NCI Logo</div>
-      <div>Footer links, including social media</div>
+    <footer className={classes.root}>
+      <div className={classes.logo}>NCI Logo</div>
+      <div className={classes.links}>Footer links, including social media</div>
     </footer>
   )
 }

src/pages/ConsentPage.js

@@ -1,11 +1,24 @@
 import React from 'react'
+import { Box, Container, Typography } from '@material-ui/core';
+import { makeStyles } from '@material-ui/core/styles'
 
-import { Box, Container } from '@material-ui/core';
+import Breadcrumbs from '../components/Breadcrumbs/Breadcrumbs'
+
+const useStyles = makeStyles(theme => ({
+  header: {
+    margin: `${theme.spacing(3)}px 0`
+  }
+}))
 
 export default () => {
+  const classes = useStyles()
   return (
-    <Box my={6} mx={0}>
+    <Box my={0} mx={0}>
+      <Breadcrumbs pageName="Consent Page" />
       <Container>
+        <Typography variant="h2" className={classes.header}>
+          Concent Form
+        </Typography>
         Consent Page Placeholder
       </Container>
     </Box>

src/pages/GetHelpPage.js

@@ -1,11 +1,24 @@
 import React from 'react'
+import { Box, Container, Typography } from '@material-ui/core';
+import { makeStyles } from '@material-ui/core/styles'
 
-import { Box, Container } from '@material-ui/core';
+import Breadcrumbs from '../components/Breadcrumbs/Breadcrumbs'
+
+const useStyles = makeStyles(theme => ({
+  header: {
+    margin: `${theme.spacing(3)}px 0`
+  }
+}))
 
 export default () => {
+  const classes = useStyles()
   return (
-    <Box my={6} mx={0}>
+    <Box my={0} mx={0}>
+      <Breadcrumbs pageName="Get Help" />
       <Container>
+        <Typography variant="h2" className={classes.header}>
+          Get Help
+        </Typography>
         Get Help Page Placeholder
       </Container>
     </Box>

src/pages/NotFoundPage.js

@@ -1,5 +1,5 @@
 import React from 'react'
-import { Link } from 'react-router-dom'
+import { Link } from '@reach/router'
 
 export default () => (
   <div>

src/pages/NotificationsPage.js

@@ -1,11 +1,24 @@
 import React from 'react'
+import { Box, Container, Typography } from '@material-ui/core';
+import { makeStyles } from '@material-ui/core/styles'
 
-import { Box, Container } from '@material-ui/core';
+import Breadcrumbs from '../components/Breadcrumbs/Breadcrumbs'
+
+const useStyles = makeStyles(theme => ({
+  header: {
+    margin: `${theme.spacing(3)}px 0`
+  }
+}))
 
 export default () => {
+  const classes = useStyles()
   return (
-    <Box my={6} mx={0}>
+    <Box my={0} mx={0}>
+      <Breadcrumbs pageName="Notifications" />
       <Container>
+        <Typography variant="h2" className={classes.header}>
+          Notifications
+        </Typography>
         Notifications Page placeholder
       </Container>
     </Box>

src/pages/ProfilePage.js

@@ -1,11 +1,13 @@
 import React from 'react'
+import { Box, Container } from '@material-ui/core';
 
+import Breadcrumbs from '../components/Breadcrumbs/Breadcrumbs'
 import Profile from '../components/Profile/Profile'
-import { Box, Container } from '@material-ui/core';
 
 export default () => {
   return (
-    <Box my={6} mx={0}>
+    <Box my={0} mx={0}>
+      <Breadcrumbs pageName="Profile" />
       <Container>
         <Profile />
       </Container>

src/pages/TestResultsPage.js

@@ -1,13 +1,15 @@
 import React from 'react'
+import { Box, Container } from '@material-ui/core';
 
+import Breadcrumbs from '../components/Breadcrumbs/Breadcrumbs'
 import TestResults from '../components/TestResults/TestResults'
-import { Box, Container } from '@material-ui/core';
 
-export default () => {
+export default ({userName}) => {
   return (
-    <Box my={6} mx={0}>
+    <Box my={0} mx={0}>
+      <Breadcrumbs pageName="Reports" />
       <Container>
-        <TestResults />
+        <TestResults userName={userName} />
       </Container>
     </Box>
   )