Skip to content

Commit 6d9fc82

Browse files
committed
yes
1 parent c58140e commit 6d9fc82

File tree

2 files changed

+86
-92
lines changed

2 files changed

+86
-92
lines changed

site/src/pages/ManagementSettingsPage/OrganizationMembersPage.tsx

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -82,7 +82,6 @@ const OrganizationMembersPage: FC = () => {
8282
organization={organization}
8383
me={me}
8484
members={members}
85-
groupsByUserId={groupsByUserIdQuery.data}
8685
addMember={async (user: User) => {
8786
await addMemberMutation.mutateAsync(user.id);
8887
void membersQuery.refetch();

site/src/pages/ManagementSettingsPage/OrganizationMembersPageView.tsx

Lines changed: 86 additions & 91 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,6 @@ import TableContainer from "@mui/material/TableContainer";
88
import TableHead from "@mui/material/TableHead";
99
import TableRow from "@mui/material/TableRow";
1010
import { getErrorMessage } from "api/errors";
11-
import type { GroupsByUserId } from "api/queries/groups";
1211
import type {
1312
Group,
1413
Organization,
@@ -18,7 +17,6 @@ import type {
1817
} from "api/typesGenerated";
1918
import { ErrorAlert } from "components/Alert/ErrorAlert";
2019
import { AvatarData } from "components/AvatarData/AvatarData";
21-
import { Breadcrumbs, Crumb } from "components/Breadcrumbs/Breadcrumbs";
2220
import { displayError, displaySuccess } from "components/GlobalSnackbar/utils";
2321
import {
2422
MoreMenu,
@@ -30,9 +28,11 @@ import {
3028
import { Stack } from "components/Stack/Stack";
3129
import { UserAutocomplete } from "components/UserAutocomplete/UserAutocomplete";
3230
import { UserAvatar } from "components/UserAvatar/UserAvatar";
31+
import { UserGroupsCell } from "pages/UsersPage/UsersTable/UserGroupsCell";
3332
import { type FC, useState } from "react";
3433
import { TableColumnHelpTooltip } from "./UserTable/TableColumnHelpTooltip";
3534
import { UserRoleCell } from "./UserTable/UserRoleCell";
35+
import { Breadcrumbs, Crumb } from "components/Breadcrumbs/Breadcrumbs";
3636

3737
interface OrganizationMembersPageViewProps {
3838
allAvailableRoles: readonly SlimRole[] | undefined;
@@ -43,7 +43,6 @@ interface OrganizationMembersPageViewProps {
4343
organization: Organization;
4444
me: User;
4545
members: Array<OrganizationMemberTableEntry> | undefined;
46-
groupsByUserId: GroupsByUserId | undefined;
4746
addMember: (user: User) => Promise<void>;
4847
removeMember: (member: OrganizationMemberWithUserData) => void;
4948
updateMemberRoles: (
@@ -72,7 +71,7 @@ export const OrganizationMembersPageView: FC<
7271
updateMemberRoles,
7372
}) => {
7473
return (
75-
<Stack>
74+
<div>
7675
<Breadcrumbs>
7776
<Crumb>Organizations</Crumb>
7877
<Crumb href={`/organizations/${organization}`}>
@@ -82,98 +81,94 @@ export const OrganizationMembersPageView: FC<
8281
Members
8382
</Crumb>
8483
</Breadcrumbs>
84+
<Stack>
85+
{Boolean(error) && <ErrorAlert error={error} />}
8586

86-
{Boolean(error) && <ErrorAlert error={error} />}
87-
88-
{canEditMembers && (
89-
<AddOrganizationMember
90-
isLoading={isAddingMember}
91-
onSubmit={addMember}
92-
/>
93-
)}
87+
{canEditMembers && (
88+
<AddOrganizationMember
89+
isLoading={isAddingMember}
90+
onSubmit={addMember}
91+
/>
92+
)}
9493

95-
<TableContainer>
96-
<Table>
97-
<TableHead>
98-
<TableRow>
99-
<TableCell width="50%">User</TableCell>
100-
<TableCell width="49%">
101-
<Stack direction="row" spacing={1} alignItems="center">
102-
<span>Roles</span>
103-
<TableColumnHelpTooltip variant="roles" />
104-
</Stack>
105-
</TableCell>
106-
<TableCell width="1%"></TableCell>
107-
</TableRow>
108-
</TableHead>
109-
<TableBody>
110-
{members?.map((member) => (
111-
<TableRow key={member.user_id}>
112-
<TableCell>
113-
<AvatarData
114-
avatar={
115-
<UserAvatar
116-
username={member.username}
117-
avatarURL={member.avatar_url}
118-
/>
119-
}
120-
title={member.name || member.username}
121-
subtitle={member.email}
122-
/>
94+
<TableContainer>
95+
<Table>
96+
<TableHead>
97+
<TableRow>
98+
<TableCell width="33%">User</TableCell>
99+
<TableCell width="33%">
100+
<Stack direction="row" spacing={1} alignItems="center">
101+
<span>Roles</span>
102+
<TableColumnHelpTooltip variant="roles" />
103+
</Stack>
123104
</TableCell>
124-
<UserRoleCell
125-
inheritedRoles={member.global_roles}
126-
roles={member.roles}
127-
allAvailableRoles={allAvailableRoles}
128-
oidcRoleSyncEnabled={false}
129-
isLoading={isUpdatingMemberRoles}
130-
canEditUsers={canEditMembers}
131-
onEditRoles={async (roles) => {
132-
try {
133-
await updateMemberRoles(member, roles);
134-
displaySuccess("Roles updated successfully.");
135-
} catch (error) {
136-
displayError(
137-
getErrorMessage(error, "Failed to update roles."),
138-
);
139-
}
140-
}}
141-
/>
142-
<TableCell>
143-
{member.user_id !== me.id && canEditMembers && (
144-
<MoreMenu>
145-
<MoreMenuTrigger>
146-
<ThreeDotsButton />
147-
</MoreMenuTrigger>
148-
<MoreMenuContent>
149-
<MoreMenuItem
150-
danger
151-
onClick={async () => {
152-
try {
153-
await removeMember(member);
154-
displaySuccess("Member removed successfully.");
155-
} catch (error) {
156-
displayError(
157-
getErrorMessage(
158-
error,
159-
"Failed to remove member.",
160-
),
161-
);
162-
}
163-
}}
164-
>
165-
Remove
166-
</MoreMenuItem>
167-
</MoreMenuContent>
168-
</MoreMenu>
169-
)}
105+
<TableCell width="33%">
106+
<Stack direction="row" spacing={1} alignItems="center">
107+
<span>Groups</span>
108+
<TableColumnHelpTooltip variant="groups" />
109+
</Stack>
170110
</TableCell>
111+
<TableCell width="1%" />
171112
</TableRow>
172-
))}
173-
</TableBody>
174-
</Table>
175-
</TableContainer>
176-
</Stack>
113+
</TableHead>
114+
<TableBody>
115+
{members?.map((member) => (
116+
<TableRow key={member.user_id}>
117+
<TableCell>
118+
<AvatarData
119+
avatar={
120+
<UserAvatar
121+
username={member.username}
122+
avatarURL={member.avatar_url}
123+
/>
124+
}
125+
title={member.name || member.username}
126+
subtitle={member.email}
127+
/>
128+
</TableCell>
129+
<UserRoleCell
130+
inheritedRoles={member.global_roles}
131+
roles={member.roles}
132+
allAvailableRoles={allAvailableRoles}
133+
oidcRoleSyncEnabled={false}
134+
isLoading={isUpdatingMemberRoles}
135+
canEditUsers={canEditMembers}
136+
onEditRoles={async (roles) => {
137+
try {
138+
await updateMemberRoles(member, roles);
139+
displaySuccess("Roles updated successfully.");
140+
} catch (error) {
141+
displayError(
142+
getErrorMessage(error, "Failed to update roles."),
143+
);
144+
}
145+
}}
146+
/>
147+
<UserGroupsCell userGroups={member.groups} />
148+
<TableCell>
149+
{member.user_id !== me.id && canEditMembers && (
150+
<MoreMenu>
151+
<MoreMenuTrigger>
152+
<ThreeDotsButton />
153+
</MoreMenuTrigger>
154+
<MoreMenuContent>
155+
<MoreMenuItem
156+
danger
157+
onClick={() => removeMember(member)}
158+
>
159+
Remove
160+
</MoreMenuItem>
161+
</MoreMenuContent>
162+
</MoreMenu>
163+
)}
164+
</TableCell>
165+
</TableRow>
166+
))}
167+
</TableBody>
168+
</Table>
169+
</TableContainer>
170+
</Stack>
171+
</div>
177172
);
178173
};
179174

0 commit comments

Comments
 (0)