From ce90f9cd257e4534744e18dcffec60b331121e42 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Fri, 7 Jul 2023 16:05:23 +0100
Subject: [PATCH] Improve position of user avatar tooltips

---
 .../app/[application]/_components/UserAvatars.svelte       | 3 ++-
 .../src/pages/builder/app/[application]/_layout.svelte     | 7 ++++++-
 2 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/packages/builder/src/pages/builder/app/[application]/_components/UserAvatars.svelte b/packages/builder/src/pages/builder/app/[application]/_components/UserAvatars.svelte
index 9e62951d53..7e9682dacc 100644
--- a/packages/builder/src/pages/builder/app/[application]/_components/UserAvatars.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/_components/UserAvatars.svelte
@@ -5,6 +5,7 @@
   export let users = []
   export let order = "ltr"
   export let size = "S"
+  export let tooltipPosition = TooltipPosition.Top
 
   $: uniqueUsers = unique(users, order)
   $: avatars = getAvatars(uniqueUsers, order)
@@ -47,7 +48,7 @@
           color="var(--spectrum-global-color-gray-500)"
         />
       {:else}
-        <UserAvatar {size} {user} tooltipPosition={TooltipPosition.Bottom} />
+        <UserAvatar {size} {user} {tooltipPosition} />
       {/if}
     </span>
   {/each}
diff --git a/packages/builder/src/pages/builder/app/[application]/_layout.svelte b/packages/builder/src/pages/builder/app/[application]/_layout.svelte
index 8586a300fc..8e637d6fa2 100644
--- a/packages/builder/src/pages/builder/app/[application]/_layout.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/_layout.svelte
@@ -15,6 +15,7 @@
     Heading,
     Modal,
     notifications,
+    TooltipPosition,
   } from "@budibase/bbui"
   import AppActions from "components/deploy/AppActions.svelte"
   import { API } from "api"
@@ -172,7 +173,11 @@
       </div>
       <div class="toprightnav">
         <span>
-          <UserAvatars users={$userStore} order="rtl" />
+          <UserAvatars
+            users={$userStore}
+            order="rtl"
+            tooltipPosition={TooltipPosition.Bottom}
+          />
         </span>
         <AppActions {application} {loaded} />
       </div>