From cc7edade21fb63cbc96341762ed1feb10ec87a23 Mon Sep 17 00:00:00 2001
From: David Baker <dbkr@users.noreply.github.com>
Date: Fri, 19 Apr 2024 10:04:48 +0100
Subject: [PATCH] Move the TAC to above the button (#12438)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* Move the TAC to above the button

This isn't what the designs say, but there is a (bug/feature)* in
radix where it will turn a mouseup event within the menu into a
click so that it activates the menu option that's under your cursor
when you lift the button, even if you pressed the button down on
a different item. Unfortunately it forgot to check that the mouse
down happened in the menu, so if the menu appears under the cursor,
the cursor, it will immediately select whatever option appeared under
the cursor.

I think the simplest solution here is to just move the menu above the
TAC button. This also makes it consistent† with quick settings.

*delete as applicable
†Not actually consistent because it fades in a different way

* Update snapshots
---
 .../ThreadsActivityCentre.tsx                        |  4 ++--
 .../ThreadsActivityCentre-test.tsx.snap              | 12 ++++++------
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/src/components/views/spaces/threads-activity-centre/ThreadsActivityCentre.tsx b/src/components/views/spaces/threads-activity-centre/ThreadsActivityCentre.tsx
index 8b0b470f12..da2ce6be63 100644
--- a/src/components/views/spaces/threads-activity-centre/ThreadsActivityCentre.tsx
+++ b/src/components/views/spaces/threads-activity-centre/ThreadsActivityCentre.tsx
@@ -88,7 +88,8 @@ export function ThreadsActivityCentre({ displayButtonLabel }: ThreadsActivityCen
                 </ReleaseAnnouncement>
             ) : (
                 <Menu
-                    align="end"
+                    align="start"
+                    side="top"
                     open={open}
                     onOpenChange={(newOpen) => {
                         // Track only when the Threads Activity Centre is opened
@@ -96,7 +97,6 @@ export function ThreadsActivityCentre({ displayButtonLabel }: ThreadsActivityCen
 
                         setOpen(newOpen);
                     }}
-                    side="right"
                     title={_t("threads_activity_centre|header")}
                     trigger={
                         <ThreadsActivityCentreButton
diff --git a/test/components/views/spaces/__snapshots__/ThreadsActivityCentre-test.tsx.snap b/test/components/views/spaces/__snapshots__/ThreadsActivityCentre-test.tsx.snap
index 40420b4bfa..028011341e 100644
--- a/test/components/views/spaces/__snapshots__/ThreadsActivityCentre-test.tsx.snap
+++ b/test/components/views/spaces/__snapshots__/ThreadsActivityCentre-test.tsx.snap
@@ -5,10 +5,10 @@ exports[`ThreadsActivityCentre renders notifications matching the snapshot 1`] =
   aria-labelledby="radix-14"
   aria-orientation="vertical"
   class="_menu_1x5h1_17"
-  data-align="end"
+  data-align="start"
   data-orientation="vertical"
   data-radix-menu-content=""
-  data-side="right"
+  data-side="top"
   data-state="open"
   dir="ltr"
   id="radix-15"
@@ -130,10 +130,10 @@ exports[`ThreadsActivityCentre should match snapshot when empty 1`] = `
   aria-labelledby="radix-20"
   aria-orientation="vertical"
   class="_menu_1x5h1_17"
-  data-align="end"
+  data-align="start"
   data-orientation="vertical"
   data-radix-menu-content=""
-  data-side="right"
+  data-side="top"
   data-state="open"
   dir="ltr"
   id="radix-21"
@@ -164,10 +164,10 @@ exports[`ThreadsActivityCentre should order the room with the same notification
   aria-labelledby="radix-22"
   aria-orientation="vertical"
   class="_menu_1x5h1_17"
-  data-align="end"
+  data-align="start"
   data-orientation="vertical"
   data-radix-menu-content=""
-  data-side="right"
+  data-side="top"
   data-state="open"
   dir="ltr"
   id="radix-23"