moon
/
soapbox
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Performance: hide EmojiSelector until portaled

This commit is contained in:
Alex Gleason 2023-02-14 11:20:25 -06:00
parent ec2235011f
commit 0aeeeb1dc4
No known key found for this signature in database
GPG Key ID: 7211D1F99744FBB7
2 changed files with 22 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
app/soapbox/components/status-reaction-wrapper.tsx
View File

@ -105,14 +105,16 @@ const StatusReactionWrapper: React.FC<IStatusReactionWrapper> = ({ statusId, chi
ref: setReferenceElement, ref: setReferenceElement,
})} })}
<Portal> {visible && (
<EmojiSelector <Portal>
placement='top-start' <EmojiSelector
referenceElement={referenceElement} placement='top-start'
onReact={handleReact} referenceElement={referenceElement}
visible={visible} onReact={handleReact}
/> visible={visible}
</Portal> />
</Portal>
)}
</div> </div>
); );
}; };

22
app/soapbox/features/chats/components/chat-message-reaction-wrapper/chat-message-reaction-wrapper.tsx
View File

@ -37,16 +37,18 @@ function ChatMessageReactionWrapper(props: IChatMessageReactionWrapper) {
onClick: onToggleVisibility, onClick: onToggleVisibility,
})} })}
<Portal> {isOpen && (
<EmojiSelector <Portal>
visible={isOpen} <EmojiSelector
referenceElement={referenceElement} visible={isOpen}
onReact={handleSelect} referenceElement={referenceElement}
onClose={() => setIsOpen(false)} onReact={handleSelect}
offset={[-10, 12]} onClose={() => setIsOpen(false)}
all={false} offset={[-10, 12]}
/> all={false}
</Portal> />
</Portal>
)}
</React.Fragment> </React.Fragment>
); );
} }