Function MemberTableByRole

frontend/src/react/pages/settings/MembersPage.tsx:610–856

({
  bindings,
  allowEdit,
  onUpdateBinding,
  onRevokeBinding,
  scope,
}: {
  bindings: MemberBinding[];
  allowEdit: boolean;
  onUpdateBinding: (binding: MemberBinding) => void;
  onRevokeBinding: (binding: MemberBinding) => void;
  scope: "workspace" | "project";
})

// ============================================================

function MemberTableByRole({
  bindings,
  allowEdit,
  onUpdateBinding,
  onRevokeBinding,
  scope,
}: {
  bindings: MemberBinding[];
  allowEdit: boolean;
  onUpdateBinding: (binding: MemberBinding) => void;
  onRevokeBinding: (binding: MemberBinding) => void;
  scope: "workspace" | "project";
}) {
  const { t } = useTranslation();
  const currentUser = useCurrentUser();
  const isSaaSMode = useAppStore((s) => s.isSaaSMode());
  const roleList = useAppStore((state) => state.roleList);
  const [expandedRoles, setExpandedRoles] = useState<Set<string>>(new Set());
  const initializedRef = useRef(false);

  type RoleMember = { member: MemberBinding; allExpired: boolean };
  const roleToBindings = useMemo(() => {
    const map = new Map<string, RoleMember[]>();
    const appendToRole = (role: string, entry: RoleMember) => {
      const arr = map.get(role) ?? [];
      arr.push(entry);
      map.set(role, arr);
    };
    for (const mb of bindings) {
      if (scope === "project") {
        // Group this member's bindings by role so we can mark a row expired
        // only when ALL of its bindings for that role are expired.
        const bindingsByRole = new Map<string, Binding[]>();
        for (const b of mb.projectRoleBindings) {
          const arr = bindingsByRole.get(b.role) ?? [];
          arr.push(b);
          bindingsByRole.set(b.role, arr);
        }
        for (const [role, roleBindings] of bindingsByRole) {
          const allExpired = roleBindings.every((b) =>
            isBindingPolicyExpired(b)
          );
          appendToRole(role, { member: mb, allExpired });
        }
      } else {
        for (const role of mb.workspaceLevelRoles) {
          appendToRole(role, { member: mb, allExpired: false });
        }
      }
    }
    const sortedRoles = sortRoles([...map.keys()]);
    return sortedRoles.map((role) => ({
      role,
      // Active members first, expired-only members last.
      members: (map.get(role) ?? []).slice().sort((a, b) => {
        return Number(a.allExpired) - Number(b.allExpired);
      }),
    }));