From 6f15b5f42fb98f535e713009c1fd3cc4a57fbfdc Mon Sep 17 00:00:00 2001
From: Alex Gleason <alex@alexgleason.me>
Date: Wed, 8 Feb 2023 20:26:37 -0600
Subject: [PATCH] StatusReactionWrapper: put the picker in a portal

---
 .../components/status-reaction-wrapper.tsx        | 15 +++++++++------
 1 file changed, 9 insertions(+), 6 deletions(-)

diff --git a/app/soapbox/components/status-reaction-wrapper.tsx b/app/soapbox/components/status-reaction-wrapper.tsx
index 545d6fe7d..c2ce020f9 100644
--- a/app/soapbox/components/status-reaction-wrapper.tsx
+++ b/app/soapbox/components/status-reaction-wrapper.tsx
@@ -1,3 +1,4 @@
+import { Portal } from '@reach/portal';
 import React, { useState, useEffect, useRef } from 'react';
 
 import { simpleEmojiReact } from 'soapbox/actions/emoji-reacts';
@@ -105,12 +106,14 @@ const StatusReactionWrapper: React.FC<IStatusReactionWrapper> = ({ statusId, chi
         ref: setReferenceElement,
       })}
 
-      <EmojiSelector
-        placement='top-start'
-        referenceElement={referenceElement}
-        onReact={handleReact}
-        visible={visible}
-      />
+      <Portal>
+        <EmojiSelector
+          placement='top-start'
+          referenceElement={referenceElement}
+          onReact={handleReact}
+          visible={visible}
+        />
+      </Portal>
     </div>
   );
 };