From 9135fb80e1ff3e5c9cfef91f57e87bff32241832 Mon Sep 17 00:00:00 2001 From: Jessica McInchak Date: Tue, 17 Sep 2024 16:35:34 +0200 Subject: [PATCH] fix: hide add/edit user in Templates team and for archived members (#3693) --- .../components/Team/TeamMembers.tsx | 12 ++++++-- .../Team/components/MembersTable.tsx | 29 ++++++++++--------- .../tests/TeamMembers.addNewEditor.test.tsx | 17 +++++++++-- .../tests/TeamMembers.updateEditor.test.tsx | 21 ++++++++++++-- .../pages/FlowEditor/components/Team/types.ts | 1 + 5 files changed, 59 insertions(+), 21 deletions(-) diff --git a/editor.planx.uk/src/pages/FlowEditor/components/Team/TeamMembers.tsx b/editor.planx.uk/src/pages/FlowEditor/components/Team/TeamMembers.tsx index 3bec5e489a..1ae158e124 100644 --- a/editor.planx.uk/src/pages/FlowEditor/components/Team/TeamMembers.tsx +++ b/editor.planx.uk/src/pages/FlowEditor/components/Team/TeamMembers.tsx @@ -15,7 +15,13 @@ import { MembersTable } from "./components/MembersTable"; import { TeamMember } from "./types"; export const TeamMembers = () => { - const teamMembers = useStore((state) => state.teamMembers); + const [teamMembers, teamSlug] = useStore((state) => [ + state.teamMembers, + state.teamSlug, + ]); + + // All users are automatically added to Templates team via a db trigger, we never want to manually add/edit them + const isNotTemplatesTeam = teamSlug !== "templates"; const teamMembersByRole = groupBy(teamMembers, "role") as Record< Role, @@ -42,7 +48,7 @@ export const TeamMembers = () => { Editors have access to edit your services. - + @@ -51,7 +57,7 @@ export const TeamMembers = () => { Admins have editor access across all teams. - + {archivedMembers.length > 0 && ( diff --git a/editor.planx.uk/src/pages/FlowEditor/components/Team/components/MembersTable.tsx b/editor.planx.uk/src/pages/FlowEditor/components/Team/components/MembersTable.tsx index 70a11d3681..1b4022ba57 100644 --- a/editor.planx.uk/src/pages/FlowEditor/components/Team/components/MembersTable.tsx +++ b/editor.planx.uk/src/pages/FlowEditor/components/Team/components/MembersTable.tsx @@ -29,6 +29,7 @@ const EditUserButton = styled(Button)(({ theme }) => ({ export const MembersTable = ({ members, showAddMemberButton, + showEditMemberButton, }: MembersTableProps) => { const [showAddModal, setShowAddModal] = useState(false); const [showUpdateModal, setShowUpdateModal] = useState(false); @@ -126,19 +127,21 @@ export const MembersTable = ({ /> {member.email} - - - { - setShowUpdateModal(true); - setInitialValues(member); - }} - data-testId={`edit-button-${i}`} - > - Edit - - - + {showEditMemberButton && ( + + + { + setShowUpdateModal(true); + setInitialValues(member); + }} + data-testId={`edit-button-${i}`} + > + Edit + + + + )} ))} {showAddMemberButton && ( diff --git a/editor.planx.uk/src/pages/FlowEditor/components/Team/tests/TeamMembers.addNewEditor.test.tsx b/editor.planx.uk/src/pages/FlowEditor/components/Team/tests/TeamMembers.addNewEditor.test.tsx index db8998eeb5..1c9a54c6a6 100644 --- a/editor.planx.uk/src/pages/FlowEditor/components/Team/tests/TeamMembers.addNewEditor.test.tsx +++ b/editor.planx.uk/src/pages/FlowEditor/components/Team/tests/TeamMembers.addNewEditor.test.tsx @@ -27,7 +27,7 @@ let initialState: FullStore; describe("when a user presses 'add a new editor'", () => { beforeEach(async () => { - useStore.setState({ teamMembers: mockTeamMembersData }); + useStore.setState({ teamMembers: mockTeamMembersData, teamSlug: "planx" }); const { user } = await setupTeamMembersScreen(); const teamEditorsTable = screen.getByTestId("team-editors"); @@ -46,7 +46,7 @@ describe("when a user presses 'add a new editor'", () => { describe("when a user fills in the 'add a new editor' form correctly", () => { afterAll(() => useStore.setState(initialState)); beforeEach(async () => { - useStore.setState({ teamMembers: mockTeamMembersData }); + useStore.setState({ teamMembers: mockTeamMembersData, teamSlug: "planx" }); const { user } = await setupTeamMembersScreen(); await userTriesToAddNewEditor(user); }); @@ -92,3 +92,16 @@ describe("when the addNewEditor modal is rendered", () => { expect(results).toHaveNoViolations(); }); }); + +describe("'add a new editor' button is hidden from Templates team", () => { + beforeEach(async() => { + useStore.setState({ teamMembers: mockTeamMembersData, teamSlug: "templates" }); + }); + + it("hides the button on the Templates team", async () => { + const { user: _user } = await setupTeamMembersScreen(); + const teamEditorsTable = screen.getByTestId("team-editors"); + const addEditorButton = within(teamEditorsTable).queryByText("Add a new editor"); + expect(addEditorButton).not.toBeInTheDocument(); + }); +}); diff --git a/editor.planx.uk/src/pages/FlowEditor/components/Team/tests/TeamMembers.updateEditor.test.tsx b/editor.planx.uk/src/pages/FlowEditor/components/Team/tests/TeamMembers.updateEditor.test.tsx index 5d7884add8..7cba480610 100644 --- a/editor.planx.uk/src/pages/FlowEditor/components/Team/tests/TeamMembers.updateEditor.test.tsx +++ b/editor.planx.uk/src/pages/FlowEditor/components/Team/tests/TeamMembers.updateEditor.test.tsx @@ -17,6 +17,7 @@ describe("when a user presses 'edit button'", () => { useStore.setState({ teamMembers: mockTeamMembersData, user: mockPlatformAdminUser, + teamSlug: "planx", }); const { user } = await setupTeamMembersScreen(); @@ -56,7 +57,7 @@ describe("when a user presses 'edit button'", () => { describe("when a user deletes an input value", () => { beforeEach(async () => { - useStore.setState({ teamMembers: mockTeamMembersData }); + useStore.setState({ teamMembers: mockTeamMembersData, teamSlug: "planx" }); }); it("displays an error message when clicking away", async () => { const { user } = await setupTeamMembersScreen(); @@ -92,7 +93,7 @@ describe("when a user deletes an input value", () => { describe("when a user updates a field correctly", () => { beforeEach(async () => { - useStore.setState({ teamMembers: mockTeamMembersData }); + useStore.setState({ teamMembers: mockTeamMembersData, teamSlug: "planx" }); const { user } = await setupTeamMembersScreen(); const teamEditorsTable = screen.getByTestId("team-editors"); @@ -124,7 +125,7 @@ describe("when a user updates a field correctly", () => { describe("when a user correctly updates an Editor", () => { beforeEach(async () => { - useStore.setState({ teamMembers: mockTeamMembersData }); + useStore.setState({ teamMembers: mockTeamMembersData, teamSlug: "planx" }); const { user } = await setupTeamMembersScreen(); const teamEditorsTable = screen.getByTestId("team-editors"); @@ -164,11 +165,25 @@ describe("when a user correctly updates an Editor", () => { }); }); +describe("'edit' button is hidden from Templates team", () => { + beforeEach(async() => { + useStore.setState({ teamMembers: mockTeamMembersData, user: mockPlatformAdminUser, teamSlug: "templates" }); + }); + + it("hides the button on the Templates team", async () => { + const { user: _user } = await setupTeamMembersScreen(); + const teamEditorsTable = screen.getByTestId("team-editors"); + const editButton = within(teamEditorsTable).queryByTestId("edit-button-0"); + expect(editButton).not.toBeInTheDocument(); + }); +}); + describe("when a user is not a platform admin", () => { beforeEach(async () => { useStore.setState({ teamMembers: mockTeamMembersData, user: mockPlainUser, + team: "planx", }); await setupTeamMembersScreen(); diff --git a/editor.planx.uk/src/pages/FlowEditor/components/Team/types.ts b/editor.planx.uk/src/pages/FlowEditor/components/Team/types.ts index c93d213188..cb14bf582f 100644 --- a/editor.planx.uk/src/pages/FlowEditor/components/Team/types.ts +++ b/editor.planx.uk/src/pages/FlowEditor/components/Team/types.ts @@ -8,6 +8,7 @@ export type TeamMember = Omit & { export interface MembersTableProps { members: TeamMember[]; showAddMemberButton?: boolean; + showEditMemberButton?: boolean; } export interface AddNewEditorModalProps { showModal: boolean;