diff --git a/app/src/components/projectSettings/MemberTable.tsx b/app/src/components/projectSettings/MemberTable.tsx index 707e098..392785d 100644 --- a/app/src/components/projectSettings/MemberTable.tsx +++ b/app/src/components/projectSettings/MemberTable.tsx @@ -1,4 +1,4 @@ -import { useState } from "react"; +import { useMemo, useState } from "react"; import { Table, Thead, @@ -44,6 +44,15 @@ const MemberTable = () => { [selectedProject?.id, cancelInvitationMutation], ); + const sortedMembers = useMemo(() => { + if (!selectedProject?.projectUsers) return []; + return selectedProject.projectUsers.sort((a, b) => { + if (a.role === b.role) return a.createdAt < b.createdAt ? -1 : 1; + // Take advantage of fact that ADMIN is alphabetically before MEMBER + return a.role < b.role ? -1 : 1; + }); + }, [selectedProject?.projectUsers]); + return ( <>
|
- |
- {member.user.email} | -{member.role} | - {selectedProject.role === "ADMIN" && ( -
- {member.user.id !== session?.user?.id &&
- member.user.id !== selectedProject.personalProjectUserId && (
- |
|
+ |
- )}
- {member.user.email} | +{member.role} | + {selectedProject.role === "ADMIN" && ( +
+ {member.user.id !== session?.user?.id &&
+ member.user.id !== selectedProject.personalProjectUserId && (
+ |
+ )}
+
+ );
+ })}
{selectedProject?.projectUserInvitations?.map((invitation) => {
return (