improvement: address feedback

This commit is contained in:
Scott Wilson
2025-06-27 21:00:48 -07:00
parent ed7d709a70
commit 48f40ff938
@@ -392,7 +392,7 @@ export const OrgMembersTable = ({ handlePopUpOpen, setCompleteInviteLinks }: Pro
</IconButton> </IconButton>
</div> </div>
</Th> </Th>
<Th> <Th className="w-1/3">
<div className="flex items-center"> <div className="flex items-center">
Role Role
<IconButton <IconButton
@@ -462,47 +462,43 @@ export const OrgMembersTable = ({ handlePopUpOpen, setCompleteInviteLinks }: Pro
a={OrgPermissionSubjects.Member} a={OrgPermissionSubjects.Member}
> >
{(isAllowed) => ( {(isAllowed) => (
<> <Select
{!isActive && ( value={role === "custom" ? findRoleFromId(roleId)?.slug : role}
<Button isDisabled={userId === u?.id || !isAllowed}
isDisabled className="h-8 w-48 bg-mineshaft-700"
className="w-40" position="popper"
colorSchema="primary" dropdownContainerClassName="border border-mineshaft-600 bg-mineshaft-800"
variant="outline_bg" onValueChange={(selectedRole) =>
onClick={() => {}} onRoleChange(orgMembershipId, selectedRole)
> }
Suspended >
</Button> {(roles || [])
)} .filter(({ slug }) =>
{isActive && status === "accepted" && ( slug === "owner" ? isIamOwner || role === "owner" : true
<Select )
value={role === "custom" ? findRoleFromId(roleId)?.slug : role} .map(({ slug, name: roleName }) => (
isDisabled={userId === u?.id || !isAllowed} <SelectItem value={slug} key={`owner-option-${slug}`}>
className="h-8 w-48 bg-mineshaft-700" {roleName}
position="popper" </SelectItem>
dropdownContainerClassName="border border-mineshaft-600 bg-mineshaft-800" ))}
onValueChange={(selectedRole) => </Select>
onRoleChange(orgMembershipId, selectedRole) )}
} </OrgPermissionCan>
> </Td>
{(roles || []) <Td>
.filter(({ slug }) => <div className="flex items-center justify-end gap-6">
slug === "owner" ? isIamOwner || role === "owner" : true {isActive &&
) (status === "invited" || status === "verified") &&
.map(({ slug, name: roleName }) => ( email &&
<SelectItem value={slug} key={`owner-option-${slug}`}> serverDetails?.emailConfigured && (
{roleName} <OrgPermissionCan
</SelectItem> I={OrgPermissionActions.Edit}
))} a={OrgPermissionSubjects.Member}
</Select> >
)} {(isAllowed) => (
{isActive &&
(status === "invited" || status === "verified") &&
email &&
serverDetails?.emailConfigured && (
<Button <Button
isDisabled={!isAllowed} isDisabled={!isAllowed}
className="h-8 w-48 border-mineshaft-600 bg-mineshaft-700 font-normal" className="h-8 border-mineshaft-600 bg-mineshaft-700 font-normal"
colorSchema="primary" colorSchema="primary"
variant="outline_bg" variant="outline_bg"
onClick={(e) => { onClick={(e) => {
@@ -513,118 +509,116 @@ export const OrgMembersTable = ({ handlePopUpOpen, setCompleteInviteLinks }: Pro
Resend Invite Resend Invite
</Button> </Button>
)} )}
</> </OrgPermissionCan>
)} )}
</OrgPermissionCan> <DropdownMenu>
</Td> <DropdownMenuTrigger asChild>
<Td> <IconButton
<DropdownMenu> ariaLabel="Options"
<DropdownMenuTrigger asChild> colorSchema="secondary"
<IconButton className={twMerge("w-6", userId === u?.id && "opacity-50")}
ariaLabel="Options" variant="plain"
colorSchema="secondary" isDisabled={userId === u?.id}
className={twMerge("w-6", userId === u?.id && "opacity-50")} >
variant="plain" <FontAwesomeIcon icon={faEllipsisV} />
isDisabled={userId === u?.id} </IconButton>
> </DropdownMenuTrigger>
<FontAwesomeIcon icon={faEllipsisV} /> <DropdownMenuContent sideOffset={2} align="end">
</IconButton> <OrgPermissionCan
</DropdownMenuTrigger> I={OrgPermissionActions.Edit}
<DropdownMenuContent sideOffset={2} align="end"> a={OrgPermissionSubjects.Member}
<OrgPermissionCan >
I={OrgPermissionActions.Edit} {(isAllowed) => (
a={OrgPermissionSubjects.Member} <DropdownMenuItem
> onClick={(e) => {
{(isAllowed) => ( e.stopPropagation();
<DropdownMenuItem navigate({
onClick={(e) => { to: "/organization/members/$membershipId" as const,
e.stopPropagation(); params: {
navigate({ membershipId: orgMembershipId
to: "/organization/members/$membershipId" as const, }
params: { });
membershipId: orgMembershipId }}
isDisabled={!isAllowed}
icon={<FontAwesomeIcon icon={faEdit} />}
>
Edit User
</DropdownMenuItem>
)}
</OrgPermissionCan>
<OrgPermissionCan
I={OrgPermissionActions.Delete}
a={OrgPermissionSubjects.Member}
>
{(isAllowed) => (
<DropdownMenuItem
icon={<FontAwesomeIcon icon={faUserSlash} />}
onClick={async (e) => {
e.stopPropagation();
if (currentOrg?.scimEnabled) {
createNotification({
text: "You cannot manage users from Infisical when org-level auth is enforced for your organization",
type: "error"
});
return;
} }
});
}}
isDisabled={!isAllowed}
icon={<FontAwesomeIcon icon={faEdit} />}
>
Edit User
</DropdownMenuItem>
)}
</OrgPermissionCan>
<OrgPermissionCan
I={OrgPermissionActions.Delete}
a={OrgPermissionSubjects.Member}
>
{(isAllowed) => (
<DropdownMenuItem
icon={<FontAwesomeIcon icon={faUserSlash} />}
onClick={async (e) => {
e.stopPropagation();
if (currentOrg?.scimEnabled) { if (!isActive) {
createNotification({ // activate user
text: "You cannot manage users from Infisical when org-level auth is enforced for your organization", await updateOrgMembership({
type: "error" organizationId: orgId,
membershipId: orgMembershipId,
isActive: true
});
return;
}
// deactivate user
handlePopUpOpen("deactivateMember", {
orgMembershipId,
username
}); });
return; }}
} isDisabled={!isAllowed}
>
{`${isActive ? "Deactivate" : "Activate"} User`}
</DropdownMenuItem>
)}
</OrgPermissionCan>
<OrgPermissionCan
I={OrgPermissionActions.Delete}
a={OrgPermissionSubjects.Member}
>
{(isAllowed) => (
<DropdownMenuItem
onClick={(e) => {
e.stopPropagation();
if (!isActive) { if (currentOrg?.scimEnabled && isActive) {
// activate user createNotification({
await updateOrgMembership({ text: "You cannot manage users from Infisical when org-level auth is enforced for your organization",
organizationId: orgId, type: "error"
membershipId: orgMembershipId, });
isActive: true return;
}
handlePopUpOpen("removeMember", {
orgMembershipId,
username
}); });
}}
return; isDisabled={!isAllowed}
} icon={<FontAwesomeIcon icon={faUserXmark} />}
>
// deactivate user Remove User
handlePopUpOpen("deactivateMember", { </DropdownMenuItem>
orgMembershipId, )}
username </OrgPermissionCan>
}); </DropdownMenuContent>
}} </DropdownMenu>
isDisabled={!isAllowed} </div>
>
{`${isActive ? "Deactivate" : "Activate"} User`}
</DropdownMenuItem>
)}
</OrgPermissionCan>
<OrgPermissionCan
I={OrgPermissionActions.Delete}
a={OrgPermissionSubjects.Member}
>
{(isAllowed) => (
<DropdownMenuItem
onClick={(e) => {
e.stopPropagation();
if (currentOrg?.scimEnabled && isActive) {
createNotification({
text: "You cannot manage users from Infisical when org-level auth is enforced for your organization",
type: "error"
});
return;
}
handlePopUpOpen("removeMember", {
orgMembershipId,
username
});
}}
isDisabled={!isAllowed}
icon={<FontAwesomeIcon icon={faUserXmark} />}
>
Remove User
</DropdownMenuItem>
)}
</OrgPermissionCan>
</DropdownMenuContent>
</DropdownMenu>
</Td> </Td>
</Tr> </Tr>
); );