Loading
}\r\n {status === \"error\" && navigate(\"/\")}\r\n \r\n );\r\n};\r\n","import '../styles/Profile.css';\r\nimport React, { useContext, useState, useEffect } from \"react\";\r\nimport { Redirect, useParams, useNavigate } from \"react-router-dom\";\r\nimport { UserContext } from \"../UserContext\";\r\nimport { ProfileSummary } from \"../components/ProfileSummary\";\r\nimport { USER_TYPE, STATUS_CODE } from \"../models/models\";\r\n\r\nimport CircularProgress from '@material-ui/core/CircularProgress';\r\n\r\n\r\nexport const Profile = () => {\r\n\r\n\r\n const { user, setUser } = useContext(UserContext);\r\n const [redirect, setRedirect] = useState(false);\r\n\r\n \r\n let { id } = useParams();\r\n let { key } = useParams();\r\n let navigate = useNavigate();\r\n \r\n if (redirect) {\r\n //navigate(\"/profile\");\r\n }\r\n\r\n\r\n useEffect(() => {\r\n\r\n if (!user) {\r\n const defaultUser = {\r\n type: -1,\r\n Authorization: null\r\n };\r\n fetchData();\r\n }\r\n\r\n async function fetchData() {\r\n const res = await fetch(\r\n `/api/auth-person/${id}/${key}`\r\n );\r\n if (res.status === STATUS_CODE.UNAUTHORIZED) {\r\n setUser({\r\n type: USER_TYPE.INVALID,\r\n Authorization: null\r\n });\r\n navigate(\"/error\");\r\n } else {\r\n const d = await res.json();\r\n setUser({ type: USER_TYPE.PERSON, Authorization: `Bearer ${d.token}` });\r\n setRedirect(true);\r\n }\r\n \r\n \r\n }\r\n \r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n return (\r\n <>\r\n { (redirect && user && user.Authorization && user.type === USER_TYPE.PERSON) ?\r\n \r\n You don't have access to this page--please try again and contact us if you have trouble accessing your account.\r\n
\r\n }\r\n \r\n );\r\n}\r\n\r\n\r\nexport default Profile;","import './App.css';\r\nimport icon from './assets/icon.svg';\r\nimport React, { useMemo, useContext, useState, useEffect, Component } from \"react\";\r\nimport {\r\n CssBaseline,\r\n IconButton,\r\n Container,\r\n Grid,\r\n} from \"@material-ui/core\";\r\nimport MenuIcon from \"@material-ui/icons/Menu\";\r\nimport { QueryClient, QueryClientProvider } from 'react-query'\r\n\r\nimport { UserContext } from \"./UserContext\";\r\nimport { unstable_createMuiStrictModeTheme as createMuiTheme } from '@material-ui/core';\r\nimport {\r\n ThemeProvider,\r\n makeStyles,\r\n responsiveFontSizes,\r\n} from \"@material-ui/core/styles\";\r\nimport { Blog } from \"./views/Blog\";\r\nimport { About } from \"./views/About\";\r\nimport { Data } from \"./views/Data\";\r\nimport { Home } from \"./views/Home\";\r\nimport { Accounts } from \"./views/Accounts\";\r\nimport { Error } from \"./views/Error\";\r\nimport {\r\n BrowserRouter as Router,\r\n Routes,\r\n Route,\r\n Navigate,\r\n useLocation,\r\n useNavigate,\r\n useParams\r\n} from \"react-router-dom\";\r\nimport { Institution } from \"./views/Institution\";\r\nimport { Reports } from \"./views/Reports\";\r\nimport { Profile } from \"./views/Profile\";\r\n\r\n\r\n\r\nfunction App(props) {\r\n const { window } = props;\r\n\r\n const [isOpen, setIsOpen] = useState(false);\r\n const location = useLocation();\r\n const navigate = useNavigate();\r\n \r\n\r\n\r\n let theme = createMuiTheme({\r\n palette: {\r\n type: \"light\",\r\n\r\n primary: {\r\n main: \"#001C55\",\r\n },\r\n secondary: {\r\n main: \"#F4D35E\",\r\n },\r\n error: {\r\n main: \"#DA4167\",\r\n },\r\n warning: {\r\n main: \"#CE796B\",\r\n },\r\n info: {\r\n main: \"#06D6A0\",\r\n },\r\n success: {\r\n main: \"#03CEA4\",\r\n },\r\n contrastThreshold: 3,\r\n },\r\n typography: {\r\n fontFamily: [\"IBM Plex Sans\", \"sans-serif\"],\r\n },\r\n });\r\n theme = responsiveFontSizes(theme);\r\n const classes = useStyles(theme);\r\n\r\n const { user, setUser } = useContext(UserContext);\r\n\r\n\r\n const li = [\r\n {\r\n pathShort: \"/\",\r\n path: \"/\",\r\n text:\"Home\",\r\n key: 1\r\n },\r\n {\r\n pathShort: \"/about\",\r\n path: \"/about\",\r\n text:\"About\",\r\n key: 2\r\n },\r\n {\r\n pathShort: \"/data\",\r\n path: \"/data\",\r\n text:\"Data\",\r\n key: 3\r\n },\r\n {\r\n pathShort: \"/blog\",\r\n path: \"/blog\",\r\n text:\"Blog\",\r\n key: 4\r\n },\r\n {\r\n pathShort: \"/accounts\",\r\n path: \"/accounts\",\r\n text:\"Accounts\",\r\n key: 5,\r\n isInvisible: true\r\n },\r\n {\r\n pathShort: \"/profile\",\r\n path: \"/profile/:id/:key\",\r\n text:\"Profile\",\r\n key: 6,\r\n isInvisible: true\r\n },\r\n {\r\n pathShort: \"/institution\",\r\n path: \"/institution/:id/:key\",\r\n text:\"Institution\",\r\n key: 7,\r\n isInvisible: true\r\n },\r\n {\r\n pathShort: \"/error\",\r\n path: \"/error\",\r\n text:\"Error\",\r\n key: 8,\r\n isInvisible: true\r\n },\r\n ];\r\n\r\n // if (user?.type === 0) {\r\n // li.push({\r\n // pathShort: \"/profile\",\r\n // path: \"/profile\",\r\n // text: \"My Profile\",\r\n // key: 9,\r\n // isRestricted: true\r\n // })\r\n // }\r\n\r\n // if (user?.type === 1) {\r\n // li.push({\r\n // pathShort: \"/institution\",\r\n // path: \"/institution\",\r\n // text: \"My Institution\",\r\n // key: 10, \r\n // isRestricted: true\r\n // })\r\n // }\r\n\r\n const [selectedKey, setSelectedKey] = useState(() => {\r\n if (location.pathname.length <= 1) return 1; \r\n const key = li.filter(_item => _item.key > 1).find(_subItem => location.pathname.startsWith(_subItem.pathShort))?.key;\r\n return key ? key : 1; \r\n });\r\n \r\n const onClickNavItem = (key) => {\r\n const clicked = li.find(_item => _item.key === key);\r\n \r\n navigate(clicked.path)\r\n }\r\n\r\n useEffect(() => {\r\n if (location.pathname.length <= 1) {\r\n setSelectedKey(1);\r\n } else {\r\n const key = li.filter(_item => _item.key > 1).find(_subItem => location.pathname.startsWith(_subItem.pathShort))?.key;\r\n if (key) setSelectedKey(key);\r\n }\r\n \r\n }, [location])\r\n\r\n const navbar = (\r\n\r\n - \r\n {\r\n li.filter(i => !i?.isInvisible).map((objLink) => {\r\n //return (
- onClickNavItem(objLink.key)}>{objLink.text} )\r\n return ( )\r\n })\r\n }\r\n
\r\n \r\n \r\n \r\n \r\n {/* }/> */}\r\n }/>\r\n }/>\r\n }/>\r\n }>\r\n }/>\r\n \r\n }/>\r\n }/>\r\n }/>\r\n }/>\r\n \r\n \r\n \r\n
\r\n