Merge pull request #2078 from mslourens/new_roles_bug

display role names instead of _id

packages/builder/src/pages/builder/portal/manage/users/[userId].svelte

@@ -36,7 +36,8 @@
   $: defaultRoleId = $userFetch?.data?.builder?.global ? "ADMIN" : "BASIC"
   // Merge the Apps list and the roles response to get something that makes sense for the table
   $: appList = Object.keys($apps?.data).map(id => {
-    const role = $userFetch?.data?.roles?.[id] || defaultRoleId
+    const roleId = $userFetch?.data?.roles?.[id] || defaultRoleId
+    const role = $apps?.data?.[id].roles.find(role => role._id === roleId)
     return {
       ...$apps?.data?.[id],
       _id: id,

packages/builder/src/pages/builder/portal/manage/users/_components/TagsTableRenderer.svelte

@@ -4,7 +4,7 @@
 
   const displayLimit = 5
 
-  $: roles = value?.filter(role => role != null) ?? []
+  $: roles = value?.filter(role => role != null).map(role => role.name) ?? []
   $: tags = roles.slice(0, displayLimit)
   $: leftover = roles.length - tags.length
 </script>

packages/builder/src/pages/builder/portal/manage/users/_components/UpdateRolesModal.svelte

@@ -10,8 +10,8 @@
 
   const roles = app.roles
   let options = roles
+    .filter(role => role._id !== "PUBLIC")
     .map(role => ({ value: role._id, label: role.name }))
-    .filter(role => role.value !== "PUBLIC")
   let selectedRole = user?.roles?.[app?._id]
 
   async function updateUserRoles() {
@@ -48,5 +48,7 @@
     on:change
     {options}
     label="Role"
+    getOptionLabel={role => role.name}
+    getOptionValue={role => role._id}
   />
 </ModalContent>