From 8850771a493176265dc765b6d56ddb0f8ecee5c9 Mon Sep 17 00:00:00 2001
From: Rory Powell <rory.codes@gmail.com>
Date: Sun, 25 Jul 2021 21:14:49 +0100
Subject: [PATCH] Add dedicateed renderer for roles tags

---
 .../src/pages/builder/portal/manage/users/[userId].svelte | 3 ++-
 .../users/_components/RolesTagsTableRenderer.svelte       | 8 ++++++++
 .../manage/users/_components/TagsTableRenderer.svelte     | 6 +++---
 3 files changed, 13 insertions(+), 4 deletions(-)
 create mode 100644 packages/builder/src/pages/builder/portal/manage/users/_components/RolesTagsTableRenderer.svelte

diff --git a/packages/builder/src/pages/builder/portal/manage/users/[userId].svelte b/packages/builder/src/pages/builder/portal/manage/users/[userId].svelte
index 72a0cd3f4e..ebb01bd336 100644
--- a/packages/builder/src/pages/builder/portal/manage/users/[userId].svelte
+++ b/packages/builder/src/pages/builder/portal/manage/users/[userId].svelte
@@ -19,7 +19,8 @@
   import { fetchData } from "helpers"
   import { users, auth } from "stores/portal"
 
-  import TagsRenderer from "./_components/TagsTableRenderer.svelte"
+  import TagsRenderer from "./_components/RolesTagsTableRenderer.svelte"
+
   import UpdateRolesModal from "./_components/UpdateRolesModal.svelte"
   import ForceResetPasswordModal from "./_components/ForceResetPasswordModal.svelte"
 
diff --git a/packages/builder/src/pages/builder/portal/manage/users/_components/RolesTagsTableRenderer.svelte b/packages/builder/src/pages/builder/portal/manage/users/_components/RolesTagsTableRenderer.svelte
new file mode 100644
index 0000000000..7e63045edd
--- /dev/null
+++ b/packages/builder/src/pages/builder/portal/manage/users/_components/RolesTagsTableRenderer.svelte
@@ -0,0 +1,8 @@
+<script>
+  import TagsTableRenderer from "./TagsTableRenderer.svelte"
+  export let value
+
+  $: roles = value?.filter(role => role != null).map(role => role.name) ?? []
+</script>
+
+<TagsTableRenderer value={roles} />
diff --git a/packages/builder/src/pages/builder/portal/manage/users/_components/TagsTableRenderer.svelte b/packages/builder/src/pages/builder/portal/manage/users/_components/TagsTableRenderer.svelte
index 564abca211..d2b56bbf33 100644
--- a/packages/builder/src/pages/builder/portal/manage/users/_components/TagsTableRenderer.svelte
+++ b/packages/builder/src/pages/builder/portal/manage/users/_components/TagsTableRenderer.svelte
@@ -4,9 +4,9 @@
 
   const displayLimit = 5
 
-  $: roles = value?.filter(role => role != null).map(role => role.name) ?? []
-  $: tags = roles.slice(0, displayLimit)
-  $: leftover = roles.length - tags.length
+  $: values = value?.filter(value => value != null) ?? []
+  $: tags = values.slice(0, displayLimit)
+  $: leftover = values.length - tags.length
 </script>
 
 <div class="tag-renderer">