diff options
Diffstat (limited to 'opendc-web/opendc-web-ui/src/components')
3 files changed, 31 insertions, 28 deletions
diff --git a/opendc-web/opendc-web-ui/src/components/navigation/Navbar.js b/opendc-web/opendc-web-ui/src/components/navigation/Navbar.js index f16a3feb..5c9ea1b8 100644 --- a/opendc-web/opendc-web-ui/src/components/navigation/Navbar.js +++ b/opendc-web/opendc-web-ui/src/components/navigation/Navbar.js @@ -15,7 +15,7 @@ import Login from '../../containers/auth/Login' import Logout from '../../containers/auth/Logout' import ProfileName from '../../containers/auth/ProfileName' import { login, navbar, opendcBrand } from './Navbar.module.scss' -import { useIsLoggedIn } from '../../auth' +import { useAuth } from '../../auth' export const NAVBAR_HEIGHT = 60 @@ -44,10 +44,10 @@ export const NavItem = ({ route, children }) => { export const LoggedInSection = () => { const router = useRouter() - const isLoggedIn = useIsLoggedIn() + const { isAuthenticated } = useAuth() return ( <Nav navbar className="auth-links"> - {isLoggedIn ? ( + {isAuthenticated ? ( [ router.asPath === '/' ? ( <NavItem route="/projects" key="projects"> @@ -58,12 +58,10 @@ export const LoggedInSection = () => { </Link> </NavItem> ) : ( - <NavItem route="/profile" key="profile"> - <Link href="/profile"> - <NavLink title="My Profile"> - <ProfileName /> - </NavLink> - </Link> + <NavItem key="profile"> + <NavLink title="My Profile"> + <ProfileName /> + </NavLink> </NavItem> ), <NavItem route="logout" key="logout"> diff --git a/opendc-web/opendc-web-ui/src/components/projects/ProjectList.js b/opendc-web/opendc-web-ui/src/components/projects/ProjectList.js index 90d42326..cb17b835 100644 --- a/opendc-web/opendc-web-ui/src/components/projects/ProjectList.js +++ b/opendc-web/opendc-web-ui/src/components/projects/ProjectList.js @@ -1,12 +1,12 @@ import PropTypes from 'prop-types' import React from 'react' -import { Authorization } from '../../shapes' +import { Project } from '../../shapes' import ProjectRow from './ProjectRow' -const ProjectList = ({ authorizations }) => { +const ProjectList = ({ projects }) => { return ( <div className="vertically-expanding-container"> - {authorizations.length === 0 ? ( + {projects.length === 0 ? ( <div className="alert alert-info"> <span className="info-icon fa fa-question-circle mr-2" /> <strong>No projects here yet...</strong> Add some with the 'New Project' button! @@ -22,8 +22,8 @@ const ProjectList = ({ authorizations }) => { </tr> </thead> <tbody> - {authorizations.map((authorization) => ( - <ProjectRow projectAuth={authorization} key={authorization.project._id} /> + {projects.map((project) => ( + <ProjectRow project={project} key={project._id} /> ))} </tbody> </table> @@ -33,7 +33,7 @@ const ProjectList = ({ authorizations }) => { } ProjectList.propTypes = { - authorizations: PropTypes.arrayOf(Authorization).isRequired, + projects: PropTypes.arrayOf(Project).isRequired, } export default ProjectList diff --git a/opendc-web/opendc-web-ui/src/components/projects/ProjectRow.js b/opendc-web/opendc-web-ui/src/components/projects/ProjectRow.js index a0aac098..9a95b777 100644 --- a/opendc-web/opendc-web-ui/src/components/projects/ProjectRow.js +++ b/opendc-web/opendc-web-ui/src/components/projects/ProjectRow.js @@ -1,24 +1,29 @@ import classNames from 'classnames' import React from 'react' import ProjectActions from '../../containers/projects/ProjectActions' -import { Authorization } from '../../shapes' +import { Project } from '../../shapes' import { AUTH_DESCRIPTION_MAP, AUTH_ICON_MAP } from '../../util/authorizations' import { parseAndFormatDateTime } from '../../util/date-time' +import { useAuth } from '../../auth' -const ProjectRow = ({ projectAuth }) => ( - <tr> - <td className="pt-3">{projectAuth.project.name}</td> - <td className="pt-3">{parseAndFormatDateTime(projectAuth.project.datetimeLastEdited)}</td> - <td className="pt-3"> - <span className={classNames('fa', 'fa-' + AUTH_ICON_MAP[projectAuth.authorizationLevel], 'mr-2')} /> - {AUTH_DESCRIPTION_MAP[projectAuth.authorizationLevel]} - </td> - <ProjectActions projectId={projectAuth.project._id} /> - </tr> -) +const ProjectRow = ({ project }) => { + const { user } = useAuth() + const { level } = project.authorizations.find((auth) => auth.userId === user.sub) + return ( + <tr> + <td className="pt-3">{project.name}</td> + <td className="pt-3">{parseAndFormatDateTime(project.datetimeLastEdited)}</td> + <td className="pt-3"> + <span className={classNames('fa', 'fa-' + AUTH_ICON_MAP[level], 'mr-2')} /> + {AUTH_DESCRIPTION_MAP[level]} + </td> + <ProjectActions projectId={project._id} /> + </tr> + ) +} ProjectRow.propTypes = { - projectAuth: Authorization.isRequired, + project: Project.isRequired, } export default ProjectRow |