Skip to content

Commit 7a40e09

Browse files
committed
🧹
1 parent 8697339 commit 7a40e09

File tree

3 files changed

+52
-32
lines changed

3 files changed

+52
-32
lines changed

site/src/pages/ManagementSettingsPage/OrganizationMembersPage.test.tsx

Lines changed: 8 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,14 @@ import OrganizationMembersPage from "./OrganizationMembersPage";
1616

1717
jest.spyOn(console, "error").mockImplementation(() => {});
1818

19+
beforeAll(() => {
20+
server.use(
21+
http.get("/api/v2/experiments", () => {
22+
return HttpResponse.json(["multi-organization"]);
23+
}),
24+
);
25+
});
26+
1927
const renderPage = async () => {
2028
renderWithTemplateSettingsLayout(<OrganizationMembersPage />, {
2129
route: `/organizations/my-organization/members`,
@@ -59,27 +67,10 @@ const updateUserRole = async (role: SlimRole) => {
5967
};
6068
};
6169

62-
beforeAll(() => {
63-
server.use(
64-
http.get("/api/v2/experiments", () => {
65-
return HttpResponse.json(["multi-organization"]);
66-
}),
67-
);
68-
});
69-
7070
describe("OrganizationMembersPage", () => {
7171
describe("remove member", () => {
7272
describe("when it is success", () => {
7373
it("shows a success message", async () => {
74-
server.use(
75-
http.delete(
76-
`/api/v2/organizations/:organizationId/members/${MockUser2.id}`,
77-
async () => {
78-
return new HttpResponse(null, { status: 204 });
79-
},
80-
),
81-
);
82-
8374
await renderPage();
8475
await removeMember();
8576
await screen.findByText("Member removed.");

site/src/pages/ManagementSettingsPage/UserTable/UserRoleCell.tsx

Lines changed: 38 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -48,10 +48,14 @@ export const UserRoleCell: FC<UserRoleCellProps> = ({
4848
oidcRoleSyncEnabled,
4949
onEditRoles,
5050
}) => {
51-
const mergedRoles = getMergedRoles(inheritedRoles ?? [], roles);
51+
const mergedRoles = getTieredRoles(inheritedRoles ?? [], roles);
5252
const [mainDisplayRole = fallbackRole, ...extraRoles] =
5353
sortRolesByAccessLevel(mergedRoles ?? []);
54-
const hasOwnerRole = mainDisplayRole.name === "owner";
54+
const hasOwnerRole =
55+
mainDisplayRole.name === "owner" ||
56+
mainDisplayRole.name === "organization-admin";
57+
58+
const displayName = mainDisplayRole.display_name || mainDisplayRole.name;
5559

5660
return (
5761
<TableCell>
@@ -74,13 +78,21 @@ export const UserRoleCell: FC<UserRoleCellProps> = ({
7478
/>
7579
)}
7680

77-
<Pill css={hasOwnerRole ? styles.ownerRoleBadge : styles.roleBadge}>
81+
<Pill
82+
css={
83+
hasOwnerRole
84+
? styles.ownerRoleBadge
85+
: mainDisplayRole.global
86+
? styles.globalRoleBadge
87+
: styles.roleBadge
88+
}
89+
>
7890
{mainDisplayRole.global ? (
7991
<Tooltip title="This user has this role for all organizations.">
80-
<span>{mainDisplayRole.display_name}*</span>
92+
<span>{displayName}*</span>
8193
</Tooltip>
8294
) : (
83-
mainDisplayRole.display_name
95+
displayName
8496
)}
8597
</Pill>
8698

@@ -91,7 +103,7 @@ export const UserRoleCell: FC<UserRoleCellProps> = ({
91103
};
92104

93105
type OverflowRolePillProps = {
94-
roles: readonly SlimRole[];
106+
roles: readonly TieredSlimRole[];
95107
};
96108

97109
const OverflowRolePill: FC<OverflowRolePillProps> = ({ roles }) => {
@@ -136,12 +148,15 @@ const OverflowRolePill: FC<OverflowRolePillProps> = ({ roles }) => {
136148
{roles.map((role) => (
137149
<Pill
138150
key={role.name}
139-
css={{
140-
backgroundColor: theme.palette.background.paper,
141-
borderColor: theme.palette.divider,
142-
}}
151+
css={role.global ? styles.globalRoleBadge : styles.roleBadge}
143152
>
144-
{role.display_name || role.name}
153+
{role.global ? (
154+
<Tooltip title="This user has this role for all organizations.">
155+
<span>{role.display_name || role.name}*</span>
156+
</Tooltip>
157+
) : (
158+
role.display_name || role.name
159+
)}
145160
</Pill>
146161
))}
147162
</PopoverContent>
@@ -150,6 +165,10 @@ const OverflowRolePill: FC<OverflowRolePillProps> = ({ roles }) => {
150165
};
151166

152167
const styles = {
168+
globalRoleBadge: (theme) => ({
169+
backgroundColor: theme.roles.success.background,
170+
borderColor: theme.roles.success.outline,
171+
}),
153172
ownerRoleBadge: (theme) => ({
154173
backgroundColor: theme.roles.info.background,
155174
borderColor: theme.roles.info.outline,
@@ -160,16 +179,20 @@ const styles = {
160179
}),
161180
} satisfies Record<string, Interpolation<Theme>>;
162181

163-
const fallbackRole: MergedSlimRole = {
182+
const fallbackRole: TieredSlimRole = {
164183
name: "member",
165184
display_name: "Member",
166185
} as const;
167186

168187
const roleNamesByAccessLevel: readonly string[] = [
169188
"owner",
189+
"organization-admin",
170190
"user-admin",
191+
"organization-user-admin",
171192
"template-admin",
193+
"organization-template-admin",
172194
"auditor",
195+
"organization-auditor",
173196
];
174197

175198
function sortRolesByAccessLevel<T extends SlimRole>(
@@ -195,15 +218,15 @@ function getSelectedRoleNames(roles: readonly SlimRole[]) {
195218
return roleNameSet;
196219
}
197220

198-
interface MergedSlimRole extends SlimRole {
221+
interface TieredSlimRole extends SlimRole {
199222
global?: boolean;
200223
}
201224

202-
function getMergedRoles(
225+
function getTieredRoles(
203226
globalRoles: readonly SlimRole[],
204227
localRoles: readonly SlimRole[],
205228
) {
206-
const roles = new Map<string, MergedSlimRole>();
229+
const roles = new Map<string, TieredSlimRole>();
207230

208231
for (const role of globalRoles) {
209232
roles.set(role.name, {

site/src/testHelpers/handlers.ts

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -73,6 +73,12 @@ export const handlers = [
7373
M.MockOrganizationMember2,
7474
]);
7575
}),
76+
http.delete(
77+
`/api/v2/organizations/:organizationId/members/:userId`,
78+
async () => {
79+
return new HttpResponse(null, { status: 204 });
80+
},
81+
),
7682

7783
// templates
7884
http.get("/api/v2/templates/:templateId", () => {

0 commit comments

Comments
 (0)