From c77158c8b7eac88ade85392903e294765097fee9 Mon Sep 17 00:00:00 2001
From: Eugen Rochko <eugen@zeonfederated.com>
Date: Mon, 2 Jun 2025 14:21:31 +0200
Subject: [PATCH] Fix nested buttons in search popout in web UI (#34871)

---
 app/javascript/mastodon/actions/search.ts                | 9 +++++++--
 .../mastodon/features/compose/components/search.tsx      | 8 +++++---
 2 files changed, 12 insertions(+), 5 deletions(-)

diff --git a/app/javascript/mastodon/actions/search.ts b/app/javascript/mastodon/actions/search.ts
index 13a4ee4432..1e57c30715 100644
--- a/app/javascript/mastodon/actions/search.ts
+++ b/app/javascript/mastodon/actions/search.ts
@@ -121,10 +121,15 @@ export const clickSearchResult = createAppAsyncThunk(
 
 export const forgetSearchResult = createAppAsyncThunk(
   'search/forgetResult',
-  (q: string, { dispatch, getState }) => {
+  (
+    { q, type }: { q: string; type?: RecentSearchType },
+    { dispatch, getState },
+  ) => {
     const previous = getState().search.recent;
     const me = getState().meta.get('me') as string;
-    const current = previous.filter((result) => result.q !== q);
+    const current = previous.filter(
+      (result) => result.q !== q || result.type !== type,
+    );
 
     searchHistory.set(me, current);
     dispatch(updateSearchHistory(current));
diff --git a/app/javascript/mastodon/features/compose/components/search.tsx b/app/javascript/mastodon/features/compose/components/search.tsx
index 84e11e44b5..2186ff36ab 100644
--- a/app/javascript/mastodon/features/compose/components/search.tsx
+++ b/app/javascript/mastodon/features/compose/components/search.tsx
@@ -221,7 +221,7 @@ export const Search: React.FC<{
     },
     forget: (e) => {
       e.stopPropagation();
-      void dispatch(forgetSearchResult(search.q));
+      void dispatch(forgetSearchResult(search));
     },
   }));
 
@@ -497,8 +497,10 @@ export const Search: React.FC<{
             <div className='search__popout__menu'>
               {recentOptions.length > 0 ? (
                 recentOptions.map(({ label, key, action, forget }, i) => (
-                  <button
+                  <div
                     key={key}
+                    tabIndex={0}
+                    role='button'
                     onMouseDown={action}
                     className={classNames(
                       'search__popout__menu__item search__popout__menu__item--flex',
@@ -509,7 +511,7 @@ export const Search: React.FC<{
                     <button className='icon-button' onMouseDown={forget}>
                       <Icon id='times' icon={CloseIcon} />
                     </button>
-                  </button>
+                  </div>
                 ))
               ) : (
                 <div className='search__popout__menu__message'>