diff --git a/.changeset/feat_add_copy_original_message.md b/.changeset/feat_add_copy_original_message.md new file mode 100644 index 0000000000..6928a35d95 --- /dev/null +++ b/.changeset/feat_add_copy_original_message.md @@ -0,0 +1,5 @@ +--- +default: minor +--- + +Add Copy Message button to copy unformatted version. diff --git a/src/app/components/message/modals/Options.tsx b/src/app/components/message/modals/Options.tsx index 5171c9b45a..7a93733b72 100644 --- a/src/app/components/message/modals/Options.tsx +++ b/src/app/components/message/modals/Options.tsx @@ -43,6 +43,7 @@ import { useRoomPinnedEvents } from '$hooks/useRoomPinnedEvents'; import { EmojiBoard } from '$components/emoji-board'; import { MemoizedBody, type ReactionHandler } from '$features/room/message'; import { useRecentEmoji } from '$hooks/useRecentEmoji'; +import { CopyIcon } from '@phosphor-icons/react'; function WrappedMessage({ isModal, @@ -134,6 +135,38 @@ const MessageCopyLinkItem = as< ); }); +const MessageCopyTextItem = as< + 'button', + { + room: Room; + mEvent: MatrixEvent; + onClose: () => void; + } +>(({ room, mEvent, onClose, ...props }, ref) => { + const handleCopy = () => { + const content = mEvent.getContent(); + const body = content?.body; + + if (body) copyToClipboard(body); + onClose(); + }; + + return ( + + + Copy Message + + + ); +}); + export const MessagePinItem = as< 'button', { @@ -507,10 +540,7 @@ export function OptionMenu({ escapeDeactivates: stopPropagation, }} > - e.preventDefault()} - className={isModal ? css.MessageOptionsMenu : ''} - > + {dragOpts?.dragHandle} {ActualMessage && !emojiBoardAnchor && ( <> @@ -519,6 +549,7 @@ export function OptionMenu({ )} e.preventDefault()} > {canSendReaction && onReactionToggle && setIsEmoji && ( - Add to User Sticker Pack + Steal Sticker )} @@ -634,6 +666,7 @@ export function OptionMenu({ )} + {canForwardEvent(mEvent) && ( )} diff --git a/src/app/features/room/message/styles.css.ts b/src/app/features/room/message/styles.css.ts index 7986df8a2d..d4c49305a4 100644 --- a/src/app/features/room/message/styles.css.ts +++ b/src/app/features/room/message/styles.css.ts @@ -41,6 +41,12 @@ export const MessageOptionsMenu = style({ flexDirection: 'column', }); +export const PreventSelect = style({ + WebkitUserSelect: 'none', + msUserSelect: 'none', + userSelect: 'none', + MozUserSelect: 'none', +}); //I have zero clue where these numbers and vars are from but they should be changed //I just copied the hardcoded value in a more correct place