mirror of
https://github.com/cinnyapp/cinny.git
synced 2025-11-09 00:30:28 +03:00
Reduce reuse and clean up as a result of handling the behavior in OptionsMenu
This commit is contained in:
parent
5dd67009cb
commit
2cdc4a4969
1 changed files with 113 additions and 168 deletions
|
|
@ -877,7 +877,6 @@ export const Message = as<'div', MessageProps>(
|
||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
|
||||||
<MessageBase
|
<MessageBase
|
||||||
className={classNames(css.MessageBase, className)}
|
className={classNames(css.MessageBase, className)}
|
||||||
tabIndex={0}
|
tabIndex={0}
|
||||||
|
|
@ -891,7 +890,7 @@ export const Message = as<'div', MessageProps>(
|
||||||
{...(isMobile ? longPressBinder() : {})}
|
{...(isMobile ? longPressBinder() : {})}
|
||||||
ref={ref}
|
ref={ref}
|
||||||
>
|
>
|
||||||
{!edit && (isHovered || !!menuAnchor || !!emojiBoardAnchor) && (
|
{!edit && (isMobileSheetOpen || isHovered || !!menuAnchor || !!emojiBoardAnchor) && (
|
||||||
<MessageOptionsMenu
|
<MessageOptionsMenu
|
||||||
mEvent={mEvent}
|
mEvent={mEvent}
|
||||||
room={room}
|
room={room}
|
||||||
|
|
@ -915,6 +914,8 @@ export const Message = as<'div', MessageProps>(
|
||||||
setEmojiBoardAnchor={setEmojiBoardAnchor}
|
setEmojiBoardAnchor={setEmojiBoardAnchor}
|
||||||
setMenuAnchor={setMenuAnchor}
|
setMenuAnchor={setMenuAnchor}
|
||||||
handleOpenMenu={handleOpenMenu}
|
handleOpenMenu={handleOpenMenu}
|
||||||
|
setMobileSheetOpen={setMobileSheetOpen}
|
||||||
|
isMobileSheetOpen={isMobileSheetOpen}
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
{messageLayout === MessageLayout.Compact &&
|
{messageLayout === MessageLayout.Compact &&
|
||||||
|
|
@ -1002,62 +1003,6 @@ export const Message = as<'div', MessageProps>(
|
||||||
</DraggableMessage>
|
</DraggableMessage>
|
||||||
))}
|
))}
|
||||||
</MessageBase>
|
</MessageBase>
|
||||||
|
|
||||||
{isMobile && (
|
|
||||||
<BottomSheetMenu onClose={() => setMobileSheetOpen(false)} isOpen={isMobileSheetOpen}>
|
|
||||||
{view === 'options' ? (
|
|
||||||
<MessageDropdownMenu
|
|
||||||
closeMenu={() => {
|
|
||||||
closeMenu();
|
|
||||||
setMobileSheetOpen(false);
|
|
||||||
}}
|
|
||||||
mEvent={mEvent}
|
|
||||||
room={room}
|
|
||||||
mx={mx}
|
|
||||||
relations={relations}
|
|
||||||
canSendReaction={canSendReaction}
|
|
||||||
canEdit={canEditEvent(mx, mEvent)}
|
|
||||||
canDelete={canDelete || mEvent?.getSender() === mx.getUserId()}
|
|
||||||
canPinEvent={canPinEvent}
|
|
||||||
hideReadReceipts={hideReadReceipts}
|
|
||||||
onReactionToggle={onReactionToggle}
|
|
||||||
onReplyClick={onReplyClick}
|
|
||||||
onEditId={onEditId}
|
|
||||||
handleAddReactions={() => setView('emoji')}
|
|
||||||
/>
|
|
||||||
) : (
|
|
||||||
<Box direction="Column" style={{ width: '100%' }}>
|
|
||||||
<Header variant="Surface" size="500">
|
|
||||||
<IconButton size="300" onClick={() => setView('options')}>
|
|
||||||
<Icon src={Icons.ArrowLeft} />
|
|
||||||
</IconButton>
|
|
||||||
<Box grow="Yes" alignItems="Center">
|
|
||||||
<Text size="H4">Add Reaction</Text>
|
|
||||||
</Box>
|
|
||||||
</Header>
|
|
||||||
<EmojiBoard
|
|
||||||
imagePackRooms={imagePackRooms ?? []}
|
|
||||||
returnFocusOnDeactivate={false}
|
|
||||||
allowTextCustomEmoji
|
|
||||||
onEmojiSelect={(key) => {
|
|
||||||
onReactionToggle(mEvent.getId(), key);
|
|
||||||
setEmojiBoardAnchor(undefined);
|
|
||||||
closeMenu();
|
|
||||||
setMobileSheetOpen(false);
|
|
||||||
}}
|
|
||||||
onCustomEmojiSelect={(mxc, shortcode) => {
|
|
||||||
onReactionToggle(mEvent.getId(), mxc, shortcode);
|
|
||||||
setEmojiBoardAnchor(undefined);
|
|
||||||
closeMenu();
|
|
||||||
setMobileSheetOpen(false);
|
|
||||||
}}
|
|
||||||
requestClose={() => setEmojiBoardAnchor(undefined)}
|
|
||||||
/>
|
|
||||||
</Box>
|
|
||||||
)}
|
|
||||||
</BottomSheetMenu>
|
|
||||||
)}
|
|
||||||
</>
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue