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 b2d3e22a2e..c1d642d9c6 100644 --- a/editor.planx.uk/src/pages/FlowEditor/components/Team/TeamMembers.tsx +++ b/editor.planx.uk/src/pages/FlowEditor/components/Team/TeamMembers.tsx @@ -2,6 +2,7 @@ import Avatar from "@mui/material/Avatar"; import Box from "@mui/material/Box"; import Chip from "@mui/material/Chip"; import Container from "@mui/material/Container"; +import Divider from "@mui/material/Divider"; import { styled } from "@mui/material/styles"; import Table from "@mui/material/Table"; import TableBody from "@mui/material/TableBody"; @@ -32,6 +33,11 @@ export type TeamMember = Omit & { role: Role; }; +const roleLabels: Record = { + platformAdmin: "Admin", + teamEditor: "Editor", +}; + interface Props { teamMembersByRole: Record; } @@ -44,120 +50,107 @@ export const TeamMembers: React.FC = ({ teamMembersByRole }) => { return acc.concat(teamMembersByRole[role]); }, []); + const archivedMembers = otherRoles.filter( + (member) => member.role !== "platformAdmin" && !member.email, + ); + + const getRoleLabel = (role: string) => { + return roleLabels[role] || role; + }; + + const renderMemberTable = (members: TeamMember[]) => { + if (members.length === 0) { + return ( + <> + + + + + No members found + + + +
+ + ); + } + return ( + + + + + + User + + + Role + + + Email + + + + + {members.map((member) => ( + + + + {member.firstName[0]} + {member.lastName[0]} + + {member.firstName} {member.lastName} + + + + + {member.email} + + ))} + +
+
+ ); + }; + return ( - Team members + Team editors - Team members have access to edit your flows and services. + Editors have access to edit your flows and services. - - - - - - User - - - Role - - - Email - - - - - {otherRoles.map((member) => ( - - - - {member.firstName[0]} - {member.lastName[0]} - - {member.firstName} {member.lastName} - - - - - {member.email} - - ))} - -
-
+ {renderMemberTable(otherRoles)}
- Platform admins + Admins Admins have editor access across all teams. - - - - - - User - - - Role - - - Email - - - - - {platformAdmins.map((member) => ( - - - - {member.firstName[0]} - {member.lastName[0]} - - {member.firstName} {member.lastName} - - - - - {member.email} - - ))} - -
-
+ {renderMemberTable(platformAdmins)}
- Archived team members + Archived team editors - Past members who no longer have access to your team. + Past members who no longer have access to edit your team. + {renderMemberTable(archivedMembers)}