From a6898e1484e8947ba2f7503bb510c9f7207a0f91 Mon Sep 17 00:00:00 2001
From: Gigiaj <gigiaboone@yahoo.com>
Date: Wed, 18 Jun 2025 21:49:32 -0500
Subject: [PATCH] Fix the crash caused by the emoji board load

---
 .../room/message/MessageOptionsMenu.tsx       | 33 ++++++++++---------
 1 file changed, 17 insertions(+), 16 deletions(-)

diff --git a/src/app/features/room/message/MessageOptionsMenu.tsx b/src/app/features/room/message/MessageOptionsMenu.tsx
index 2fc508bf..c5f85ada 100644
--- a/src/app/features/room/message/MessageOptionsMenu.tsx
+++ b/src/app/features/room/message/MessageOptionsMenu.tsx
@@ -197,7 +197,6 @@ export function MessageOptionsMenu({
 }: ExtendedOptionsProps) {
   const screenSize = useScreenSizeContext();
   const isMobile = screenSize === ScreenSize.Mobile;
-  const [view, setView] = useState('options');
 
   const eventId = mEvent.getId();
   if (!eventId) return null;
@@ -247,7 +246,7 @@ export function MessageOptionsMenu({
             }}
             isOpen={isEmojiBoardOpen}
           >
-            <Suspense fallback={<p>Loading</p>}>
+            <Suspense fallback={<p> </p>}>
               <EmojiBoard
                 imagePackRooms={imagePackRooms ?? []}
                 returnFocusOnDeactivate
@@ -287,20 +286,22 @@ export function MessageOptionsMenu({
               offset={emojiBoardAnchor?.width === 0 ? 0 : undefined}
               anchor={emojiBoardAnchor}
               content={
-                <EmojiBoard
-                  imagePackRooms={imagePackRooms ?? []}
-                  returnFocusOnDeactivate={false}
-                  allowTextCustomEmoji
-                  onEmojiSelect={(key) => {
-                    onReactionToggle(eventId, key);
-                    setEmojiBoardAnchor(undefined);
-                  }}
-                  onCustomEmojiSelect={(mxc, shortcode) => {
-                    onReactionToggle(eventId, mxc, shortcode);
-                    setEmojiBoardAnchor(undefined);
-                  }}
-                  requestClose={() => setEmojiBoardAnchor(undefined)}
-                />
+                <Suspense fallback={<p> </p>}>
+                  <EmojiBoard
+                    imagePackRooms={imagePackRooms ?? []}
+                    returnFocusOnDeactivate={false}
+                    allowTextCustomEmoji
+                    onEmojiSelect={(key) => {
+                      onReactionToggle(eventId, key);
+                      setEmojiBoardAnchor(undefined);
+                    }}
+                    onCustomEmojiSelect={(mxc, shortcode) => {
+                      onReactionToggle(eventId, mxc, shortcode);
+                      setEmojiBoardAnchor(undefined);
+                    }}
+                    requestClose={() => setEmojiBoardAnchor(undefined)}
+                  />
+                </Suspense>
               }
             >
               <IconButton