From 31e0a6b317ef16d4870c727eb4cceedce700adbc Mon Sep 17 00:00:00 2001
From: tglide <26071571+TGlide@users.noreply.github.com>
Date: Wed, 7 Dec 2022 17:52:32 +0000
Subject: [PATCH] fix: fixes copy on permission role popover

---
 src/lib/components/permissions/row.svelte | 92 ++++++++++++-----------
 1 file changed, 47 insertions(+), 45 deletions(-)

diff --git a/src/lib/components/permissions/row.svelte b/src/lib/components/permissions/row.svelte
index 66dbbca67..e69f66616 100644
--- a/src/lib/components/permissions/row.svelte
+++ b/src/lib/components/permissions/row.svelte
@@ -53,59 +53,61 @@
                             })
                             .finally(() => {
                                 tick().then(() => {
-                                    instance.setContent(content.innerHTML);
+                                    instance.setContent(content);
                                 });
                             });
                     }
                 }}>
                 {role}
             </div>
-            <div class="u-hide" bind:this={content}>
-                {#if data}
-                    {@const isUser = role.startsWith('user')}
-                    {@const isTeam = role.startsWith('team')}
-                    {@const isAnonymous = !data.email && !data.phone}
-                    <div class="user-profile">
-                        {#if isAnonymous}
-                            <div class="avatar is-size-small ">
-                                <span class="icon-anonymous" aria-hidden="true" />
-                            </div>
-                        {:else if data.name}
-                            <AvatarInitials name={data.name} size={40} />
-                        {:else}
-                            <div class="avatar is-size-small ">
-                                <span class="icon-minus-sm" aria-hidden="true" />
-                            </div>
-                        {/if}
-                        <span class="user-profile-info is-only-desktop">
-                            <span class="name">
-                                {data.name
-                                    ? data.name
-                                    : data?.email
-                                    ? data?.email
-                                    : data?.phone
-                                    ? data?.phone
-                                    : '-'}
-                            </span>
-                            <Output value={data.$id}>{role}</Output>
-                        </span>
-                        {#if (isUser && (data?.email || data?.phone)) || isTeam}
-                            <span class="user-profile-sep" />
-
-                            <span class="user-profile-empty-column" />
+            <div class="u-hide">
+                <div bind:this={content}>
+                    {#if data}
+                        {@const isUser = role.startsWith('user')}
+                        {@const isTeam = role.startsWith('team')}
+                        {@const isAnonymous = !data.email && !data.phone}
+                        <div class="user-profile">
+                            {#if isAnonymous}
+                                <div class="avatar is-size-small ">
+                                    <span class="icon-anonymous" aria-hidden="true" />
+                                </div>
+                            {:else if data.name}
+                                <AvatarInitials name={data.name} size={40} />
+                            {:else}
+                                <div class="avatar is-size-small ">
+                                    <span class="icon-minus-sm" aria-hidden="true" />
+                                </div>
+                            {/if}
                             <span class="user-profile-info is-only-desktop">
-                                {#if isUser}
-                                    <p class="text u-x-small">{data?.email}</p>
-                                    <p class="text u-x-small">{data?.phone}</p>
-                                {:else if isTeam}
-                                    <p class="text u-x-small">Members: {data?.total}</p>
-                                {/if}
+                                <span class="name">
+                                    {data.name
+                                        ? data.name
+                                        : data?.email
+                                        ? data?.email
+                                        : data?.phone
+                                        ? data?.phone
+                                        : '-'}
+                                </span>
+                                <Output value={data.$id}>{role}</Output>
                             </span>
-                        {/if}
-                    </div>
-                {:else}
-                    Not found.
-                {/if}
+                            {#if (isUser && (data?.email || data?.phone)) || isTeam}
+                                <span class="user-profile-sep" />
+
+                                <span class="user-profile-empty-column" />
+                                <span class="user-profile-info is-only-desktop">
+                                    {#if isUser}
+                                        <p class="text u-x-small">{data?.email}</p>
+                                        <p class="text u-x-small">{data?.phone}</p>
+                                    {:else if isTeam}
+                                        <p class="text u-x-small">Members: {data?.total}</p>
+                                    {/if}
+                                </span>
+                            {/if}
+                        </div>
+                    {:else}
+                        Not found.
+                    {/if}
+                </div>
             </div>
         {/if}
     </div>