🧴

coder · aslilac · Jul 24, 2024 · Jul 22, 2024 · Jul 22, 2024 · Jul 22, 2024
commit 42344efba15dff4e157fd5d5970ae030fde88e39
diff --git a/site/src/api/queries/roles.ts b/site/src/api/queries/roles.ts
@@ -9,7 +9,7 @@ export const roles = () => {
 
 export const organizationRoles = (organizationId: string) => {
   return {
-    queryKey: ["organizationRoles"],
+    queryKey: ["organization", organizationId, "roles"],
     queryFn: () => API.getOrganizationRoles(organizationId),
   };
 };
diff --git a/site/src/pages/ManagementSettingsPage/OrganizationMembersPage.tsx b/site/src/pages/ManagementSettingsPage/OrganizationMembersPage.tsx
@@ -106,19 +106,15 @@ const OrganizationMembersPage: FC = () => {
                     />
                   </TableCell>
                   <UserRoleCell
-                    user={{
-                      id: member.user_id,
-                      login_type: "",
-                    }}
                     inheritedRoles={member.global_roles}
                     roles={member.roles}
                     allAvailableRoles={organizationRolesQuery.data}
                     oidcRoleSyncEnabled={false}
                     isLoading={organizationRolesQuery.isLoading}
                     canEditUsers
-                    onUserRolesUpdate={async (userId, newRoleNames) => {
+                    onEditRoles={async (newRoleNames) => {
                       await updateMemberRolesMutation.mutateAsync({
-                        userId,
+                        userId: member.user_id,
                         roles: newRoleNames,
                       });
                       displaySuccess("Roles updated successfully.");

diff --git a/site/src/pages/ManagementSettingsPage/UserTable/EditRolesButton.tsx b/site/src/pages/ManagementSettingsPage/UserTable/EditRolesButton.tsx
@@ -73,7 +73,7 @@ export interface EditRolesButtonProps {
   selectedRoleNames: Set<string>;
   onChange: (roles: SlimRole["name"][]) => void;
   oidcRoleSync: boolean;
-  userLoginType: string;
+  userLoginType?: string;
 }
 
 export const EditRolesButton: FC<EditRolesButtonProps> = ({

diff --git a/site/src/pages/ManagementSettingsPage/UserTable/UserRoleCell.tsx b/site/src/pages/ManagementSettingsPage/UserTable/UserRoleCell.tsx
@@ -18,7 +18,7 @@ import Stack from "@mui/material/Stack";
 import TableCell from "@mui/material/TableCell";
 import Tooltip from "@mui/material/Tooltip";
 import type { FC } from "react";
-import type { SlimRole, User } from "api/typesGenerated";
+import type { LoginType, SlimRole } from "api/typesGenerated";
 import { Pill } from "components/Pill/Pill";
 import {
   Popover,
@@ -31,26 +31,26 @@ type UserRoleCellProps = {
   isLoading: boolean;
   canEditUsers: boolean;
   allAvailableRoles: readonly SlimRole[] | undefined;
-  user: Pick<User, "id" | "login_type">;
+  userLoginType?: LoginType;
   inheritedRoles?: readonly SlimRole[];
   roles: readonly SlimRole[];
   oidcRoleSyncEnabled: boolean;
-  onUserRolesUpdate: (userId: string, newRoleNames: string[]) => void;
+  onEditRoles: (newRoleNames: string[]) => void;
 };
 
 export const UserRoleCell: FC<UserRoleCellProps> = ({
   isLoading,
   canEditUsers,
   allAvailableRoles,
-  user,
+  userLoginType,
   inheritedRoles,
   roles,
   oidcRoleSyncEnabled,
-  onUserRolesUpdate,
+  onEditRoles,
 }) => {
-  const theRolesForReal = getMergedRoles(inheritedRoles ?? [], roles);
+  const mergedRoles = getMergedRoles(inheritedRoles ?? [], roles);
   const [mainDisplayRole = fallbackRole, ...extraRoles] =
-    sortRolesByAccessLevel(theRolesForReal ?? []);
+    sortRolesByAccessLevel(mergedRoles ?? []);
   const hasOwnerRole = mainDisplayRole.name === "owner";
 
   return (
@@ -61,15 +61,15 @@ export const UserRoleCell: FC<UserRoleCellProps> = ({
             roles={sortRolesByAccessLevel(allAvailableRoles ?? [])}
             selectedRoleNames={getSelectedRoleNames(roles)}
             isLoading={isLoading}
-            userLoginType={user.login_type}
+            userLoginType={userLoginType}
             oidcRoleSync={oidcRoleSyncEnabled}
             onChange={(roles) => {
               // Remove the fallback role because it is only for the UI
               const rolesWithoutFallback = roles.filter(
                 (role) => role !== fallbackRole.name,
               );
 
-              onUserRolesUpdate(user.id, rolesWithoutFallback);
+              onEditRoles(rolesWithoutFallback);
             }}
           />
         )}
@@ -163,7 +163,6 @@ const styles = {
 const fallbackRole: MergedSlimRole = {
   name: "member",
   display_name: "Member",
-  global: false,
 } as const;
 
 const roleNamesByAccessLevel: readonly string[] = [

diff --git a/site/src/pages/UsersPage/UsersTable/UsersTableBody.tsx b/site/src/pages/UsersPage/UsersTable/UsersTableBody.tsx
@@ -156,11 +156,11 @@ export const UsersTableBody: FC<UsersTableBodyProps> = ({
             <UserRoleCell
               canEditUsers={canEditUsers}
               allAvailableRoles={roles}
-              user={user}
+              userLoginType={user.login_type}
               roles={user.roles}
               oidcRoleSyncEnabled={oidcRoleSyncEnabled}
               isLoading={Boolean(isUpdatingUserRoles)}
-              onUserRolesUpdate={onUpdateUserRoles}
+              onEditRoles={(roles) => onUpdateUserRoles(user.id, roles)}
             />
 
             <UserGroupsCell userGroups={groupsByUserId?.get(user.id)} />