diff --git a/src/screens/UserPortal/People/People.test.tsx b/src/screens/UserPortal/People/People.test.tsx index c978a0a5a3..a83902b31d 100644 --- a/src/screens/UserPortal/People/People.test.tsx +++ b/src/screens/UserPortal/People/People.test.tsx @@ -222,4 +222,22 @@ describe('Testing People Screen [User Portal]', () => { expect(screen.queryByText('Noble Admin')).toBeInTheDocument(); expect(screen.queryByText('Noble Mittal')).not.toBeInTheDocument(); }); + + test('Members should be rendered with correct user type', async () => { + render( + + + + + + + + + , + ); + + await wait(); + expect(screen.queryByText('Admin')).toBeInTheDocument(); + expect(screen.queryByText('User')).toBeInTheDocument(); + }); }); diff --git a/src/screens/UserPortal/People/People.tsx b/src/screens/UserPortal/People/People.tsx index 4904e75b20..2bb0f0590c 100644 --- a/src/screens/UserPortal/People/People.tsx +++ b/src/screens/UserPortal/People/People.tsx @@ -50,8 +50,9 @@ export default function people(): JSX.Element { // State for managing the number of rows per page in pagination const [rowsPerPage, setRowsPerPage] = useState(5); - const [members, setMembers] = useState([]); + const [members, setMembers] = useState([]); const [mode, setMode] = useState(0); + const [updatedMembers, setUpdatedMembers] = useState([]); // Extracting organization ID from URL parameters const { orgId: organizationId } = useParams(); @@ -135,23 +136,64 @@ export default function people(): JSX.Element { }; useEffect(() => { - if (data) { - setMembers(data.organizationsMemberConnection.edges); + if (data && data2) { + // Ensure organization exists + const organization = data2.organizations?.[0]; + if (!organization) { + console.error('Failed to load organization data'); + return; + } + + interface InterfaceAdmin { + _id: string; + } + const adminIds = organization.admins.map( + (admin: InterfaceAdmin) => admin._id, + ); + try { + const updatedMembers = data.organizationsMemberConnection.edges.map( + (member: InterfaceMember) => { + const isAdmin = adminIds.includes(member._id); + return { + ...member, + userType: isAdmin ? 'Admin' : 'User', + }; + }, + ); + setUpdatedMembers(updatedMembers); + setMembers(updatedMembers); + } catch (error) { + console.error('Failed to process member data:', error); + } } - }, [data]); + }, [data, data2]); + + const FILTER_MODES = { + ALL_MEMBERS: 0, + ADMINS: 1, + } as const; /** * Updates the list of members based on the selected filter mode. */ /* istanbul ignore next */ useEffect(() => { - if (mode == 0) { + if (mode === FILTER_MODES.ALL_MEMBERS) { if (data) { - setMembers(data.organizationsMemberConnection.edges); + setMembers(updatedMembers); } - } else if (mode == 1) { + } else if (mode === FILTER_MODES.ADMINS) { if (data2) { - setMembers(data2.organizations[0].admins); + const organization = data2.organizations?.[0]; + if (!organization) { + console.error('Organization not found'); + return; + } + const admins = organization.admins.map((admin: InterfaceMember) => ({ + ...admin, + userType: 'Admin' as const, + })); + setMembers(admins); } } }, [mode]);