From 3a661fb58bd889ebd6d8ec728c2353c340475080 Mon Sep 17 00:00:00 2001 From: Danny Rorabaugh Date: Thu, 13 Jul 2023 09:15:34 -0400 Subject: [PATCH] [SiteSettings] Enable add user to project --- public/locales/en/translation.json | 1 + .../ProjectUsers/AddProjectUsers.tsx | 22 +++++++++++++------ .../ProjectSettings/ProjectUsers/UserList.tsx | 5 +++-- .../ProjectUsers/tests/UserList.test.tsx | 6 ++++- src/components/ProjectSettings/index.tsx | 2 +- .../ProjectUsersButtonWithConfirmation.tsx | 12 +++++++++- .../tests/ProjectManagement.test.tsx | 8 +++++++ 7 files changed, 44 insertions(+), 12 deletions(-) diff --git a/public/locales/en/translation.json b/public/locales/en/translation.json index 60a7092277..0f1a9e28cb 100644 --- a/public/locales/en/translation.json +++ b/public/locales/en/translation.json @@ -102,6 +102,7 @@ }, "siteSettings": { "projectRoles": "Project roles", + "addProjectUsers": "Add project users", "archiveProjectText": "This project will not be accessible to any users.", "restoreProjectText": "Somebody probably had a good reason to archive this project. Are you sure you want to restore it?", "userList": "Users", diff --git a/src/components/ProjectSettings/ProjectUsers/AddProjectUsers.tsx b/src/components/ProjectSettings/ProjectUsers/AddProjectUsers.tsx index 86c974cad3..cf68adb9ec 100644 --- a/src/components/ProjectSettings/ProjectUsers/AddProjectUsers.tsx +++ b/src/components/ProjectSettings/ProjectUsers/AddProjectUsers.tsx @@ -24,10 +24,14 @@ const customStyles = { }, }; -export default function AddProjectUsers(): ReactElement { - const projectId = useAppSelector( - (state: StoreState) => state.currentProjectState.project.id - ); +interface AddProjectUsersProps { + projectId: string; + siteAdmin?: boolean; +} + +export default function AddProjectUsers( + props: AddProjectUsersProps +): ReactElement { const projectUsers = useAppSelector( (state: StoreState) => state.currentProjectState.users ); @@ -42,10 +46,10 @@ export default function AddProjectUsers(): ReactElement { function addToProject(user: User): void { if (!projectUsers.map((u) => u.id).includes(user.id)) { backend - .addOrUpdateUserRole(projectId, Role.Harvester, user.id) + .addOrUpdateUserRole(props.projectId, Role.Harvester, user.id) .then(() => { toast.success(t("projectSettings.invite.toastSuccess")); - dispatch(asyncRefreshProjectUsers(projectId)); + dispatch(asyncRefreshProjectUsers(props.projectId)); }) .catch((err) => { console.error(err); @@ -57,7 +61,11 @@ export default function AddProjectUsers(): ReactElement { return ( <> - + {RuntimeConfig.getInstance().emailServicesEnabled() && ( diff --git a/src/components/ProjectSettings/ProjectUsers/UserList.tsx b/src/components/ProjectSettings/ProjectUsers/UserList.tsx index 016ea47940..6b6937fa63 100644 --- a/src/components/ProjectSettings/ProjectUsers/UserList.tsx +++ b/src/components/ProjectSettings/ProjectUsers/UserList.tsx @@ -28,8 +28,9 @@ export function doesTextMatchUser(text: string, user: User): boolean { } interface UserListProps { - projectUsers: User[]; addToProject: (user: User) => void; + minSearchLength: number; + projectUsers: User[]; } export default function UserList(props: UserListProps): ReactElement { @@ -68,7 +69,7 @@ export default function UserList(props: UserListProps): ReactElement { const updateUsers = (text: string): void => { setFilterInput(text); - if (text.length >= 3) { + if (text.length >= props.minSearchLength) { const filterUsers = (users: User[]): User[] => users.filter((u) => doesTextMatchUser(text, u)); setFilteredNonProjUsers(filterUsers(nonProjUsers)); diff --git a/src/components/ProjectSettings/ProjectUsers/tests/UserList.test.tsx b/src/components/ProjectSettings/ProjectUsers/tests/UserList.test.tsx index c23ec3fd5f..15612a7ec3 100644 --- a/src/components/ProjectSettings/ProjectUsers/tests/UserList.test.tsx +++ b/src/components/ProjectSettings/ProjectUsers/tests/UserList.test.tsx @@ -21,7 +21,11 @@ let testRenderer: renderer.ReactTestRenderer; const renderUserList = async (users: User[] = []): Promise => { await renderer.act(async () => { testRenderer = renderer.create( - + ); }); }; diff --git a/src/components/ProjectSettings/index.tsx b/src/components/ProjectSettings/index.tsx index b3291e83c3..272836ce3b 100644 --- a/src/components/ProjectSettings/index.tsx +++ b/src/components/ProjectSettings/index.tsx @@ -161,7 +161,7 @@ export default function ProjectSettingsComponent() { } title={t("projectSettings.user.addUser")} - body={} + body={} /> )} diff --git a/src/components/SiteSettings/ProjectManagement/ProjectUsersButtonWithConfirmation.tsx b/src/components/SiteSettings/ProjectManagement/ProjectUsersButtonWithConfirmation.tsx index 496dac8303..7f24f52dd0 100644 --- a/src/components/SiteSettings/ProjectManagement/ProjectUsersButtonWithConfirmation.tsx +++ b/src/components/SiteSettings/ProjectManagement/ProjectUsersButtonWithConfirmation.tsx @@ -4,13 +4,16 @@ import { Dialog, DialogContent, DialogTitle, + Divider, IconButton, + Typography, } from "@mui/material"; import { useEffect, useState } from "react"; import { useTranslation } from "react-i18next"; import { asyncRefreshProjectUsers } from "components/Project/ProjectActions"; import ActiveProjectUsers from "components/ProjectSettings/ProjectUsers/ActiveProjectUsers"; +import AddProjectUsers from "components/ProjectSettings/ProjectUsers/AddProjectUsers"; import { useAppDispatch } from "types/hooks"; import theme from "types/theme"; @@ -40,7 +43,7 @@ export default function ProjectUsersButtonWithConfirmation( setOpen(false)} open={open}> - {t("siteSettings.projectRoles")} + {t("siteSettings.projectRoles")} setOpen(false)} @@ -58,6 +61,8 @@ export default function ProjectUsersButtonWithConfirmation( function ProjUsersDialogContent(props: { projectId: string }) { const dispatch = useAppDispatch(); + const { t } = useTranslation(); + useEffect(() => { dispatch(asyncRefreshProjectUsers(props.projectId)); }, [dispatch, props.projectId]); @@ -65,6 +70,11 @@ function ProjUsersDialogContent(props: { projectId: string }) { return ( + + + {t("siteSettings.addProjectUsers")} + + ); } diff --git a/src/components/SiteSettings/ProjectManagement/tests/ProjectManagement.test.tsx b/src/components/SiteSettings/ProjectManagement/tests/ProjectManagement.test.tsx index aeb84639ce..30d9318553 100644 --- a/src/components/SiteSettings/ProjectManagement/tests/ProjectManagement.test.tsx +++ b/src/components/SiteSettings/ProjectManagement/tests/ProjectManagement.test.tsx @@ -6,6 +6,7 @@ import "tests/reactI18nextMock"; import ExportButton from "components/ProjectExport/ExportButton"; import ProjectButtonWithConfirmation from "components/SiteSettings/ProjectManagement/ProjectButtonWithConfirmation"; import { ProjectList } from "components/SiteSettings/ProjectManagement/ProjectManagement"; +import ProjectUsersButtonWithConfirmation from "components/SiteSettings/ProjectManagement/ProjectUsersButtonWithConfirmation"; import { randomProject } from "types/project"; const mockProjects = [randomProject(), randomProject(), randomProject()]; @@ -37,4 +38,11 @@ describe("ProjectList", () => { ); expect(projectButtons.length).toEqual(mockProjects.length); }); + + it("Has the right number of project roles buttons", () => { + const projectButtons = testRenderer.root.findAllByType( + ProjectUsersButtonWithConfirmation + ); + expect(projectButtons.length).toEqual(mockProjects.length); + }); });