Fix UI to update user roles

BrunoQuaresma · BrunoQuaresma · commit 16d1e7b0b54e · 2022-05-09T18:26:20.000Z
diff --git a/site/src/components/UsersTable/RoleSelect.tsx b/site/src/components/UsersTable/RoleSelect.tsx
@@ -16,6 +16,7 @@ export const RoleSelect: React.FC<RoleSelectProps> = ({ roles, selectedRoles, lo
   const styles = useStyles()
   const value = selectedRoles.map((r) => r.name)
   const renderValue = () => selectedRoles.map((r) => r.display_name).join(", ")
+  const sortedRoles = roles.sort((a, b) => a.display_name.localeCompare(b.display_name))
 
   return (
     <Select
@@ -25,11 +26,11 @@ export const RoleSelect: React.FC<RoleSelectProps> = ({ roles, selectedRoles, lo
       variant="outlined"
       className={styles.select}
       onChange={(e) => {
-        const { value } = e.currentTarget
+        const { value } = e.target
         onChange(value as string[])
       }}
     >
-      {roles.map((r) => {
+      {sortedRoles.map((r) => {
         const isChecked = selectedRoles.some((selectedRole) => selectedRole.name === r.name)
 
         return (
diff --git a/site/src/xServices/users/usersXService.ts b/site/src/xServices/users/usersXService.ts
@@ -303,7 +303,7 @@ export const usersMachine = createMachine(
         displayError(Language.resetUserPasswordError)
       },
       displayUpdateRolesSuccess: () => {
-        displayError(Language.updateUserRolesSuccess)
+        displaySuccess(Language.updateUserRolesSuccess)
       },
       displayUpdateRolesErrorMessage: () => {
         displayError(Language.updateUserRolesError)
@@ -317,8 +317,7 @@ export const usersMachine = createMachine(
             return users
           }
 
-          const updatedUser = event.data
-          return users.map((u) => (u.id === updatedUser.id ? updatedUser : u))
+          return users.map((u) => (u.id === event.data.id ? event.data : u))
         },
       }),
     },
