From 32146587fb3dd001da88c84bd74b9657bf665bdd Mon Sep 17 00:00:00 2001
From: zubiden <19638254+zubiden@users.noreply.github.com>
Date: Fri, 7 Mar 2025 15:16:58 +0100
Subject: [PATCH] Message: Make some elements unselectable (#5707)

---
 src/components/common/Audio.tsx                        | 2 +-
 src/components/common/File.tsx                         | 2 +-
 src/components/common/FullNameTitle.tsx                | 1 +
 src/components/common/embedded/EmbeddedMessage.tsx     | 1 +
 src/components/middle/message/ContextMenuContainer.tsx | 4 +++-
 src/components/middle/message/Message.tsx              | 7 +++++--
 src/styles/_common.scss                                | 1 +
 7 files changed, 13 insertions(+), 5 deletions(-)

diff --git a/src/components/common/Audio.tsx b/src/components/common/Audio.tsx
index 15657c3f5..d868a71aa 100644
--- a/src/components/common/Audio.tsx
+++ b/src/components/common/Audio.tsx
@@ -412,7 +412,7 @@ const Audio: FC<OwnProps> = ({
   return (
     <div className={fullClassName} dir={lang.isRtl ? 'rtl' : 'ltr'}>
       {isSelectable && (
-        <div className="message-select-control">
+        <div className="message-select-control no-selection">
           {isSelected && <Icon name="select" />}
         </div>
       )}
diff --git a/src/components/common/File.tsx b/src/components/common/File.tsx
index 654ab260a..46333431e 100644
--- a/src/components/common/File.tsx
+++ b/src/components/common/File.tsx
@@ -103,7 +103,7 @@ const File: FC<OwnProps> = ({
   return (
     <div ref={elementRef} className={fullClassName} dir={lang.isRtl ? 'rtl' : undefined}>
       {isSelectable && (
-        <div className="message-select-control">
+        <div className="message-select-control no-selection">
           {isSelected && <Icon name="select" />}
         </div>
       )}
diff --git a/src/components/common/FullNameTitle.tsx b/src/components/common/FullNameTitle.tsx
index 64228e484..ad6793c6d 100644
--- a/src/components/common/FullNameTitle.tsx
+++ b/src/components/common/FullNameTitle.tsx
@@ -148,6 +148,7 @@ const FullNameTitle: FC<OwnProps> = ({
             >
               <CustomEmoji
                 forceAlways
+                className="no-selection"
                 withSparkles={emojiStatus.type === 'collectible'}
                 sparklesClassName="statusSparkles"
                 sparklesStyle={buildStyle(statusSparklesColor && `color: ${statusSparklesColor}`)}
diff --git a/src/components/common/embedded/EmbeddedMessage.tsx b/src/components/common/embedded/EmbeddedMessage.tsx
index 2af129590..363c8d7bb 100644
--- a/src/components/common/embedded/EmbeddedMessage.tsx
+++ b/src/components/common/embedded/EmbeddedMessage.tsx
@@ -231,6 +231,7 @@ const EmbeddedMessage: FC<OwnProps> = ({
         className,
         isQuote && 'is-quote',
         mediaThumbnail && 'with-thumb',
+        'no-selection',
       )}
       dir={lang.isRtl ? 'rtl' : undefined}
       onClick={handleClick}
diff --git a/src/components/middle/message/ContextMenuContainer.tsx b/src/components/middle/message/ContextMenuContainer.tsx
index 570f1d1d9..75d0d5f14 100644
--- a/src/components/middle/message/ContextMenuContainer.tsx
+++ b/src/components/middle/message/ContextMenuContainer.tsx
@@ -365,9 +365,11 @@ const ContextMenuContainer: FC<OwnProps & StateProps> = ({
 
     const selectionText = getSelectionAsFormattedText(selectionRange);
 
+    const messageText = message.content.text!.text!.replace(/\u00A0/g, ' ');
+
     setCanQuoteSelection(
       selectionText.text.trim().length > 0
-      && message.content.text!.text!.includes(selectionText.text),
+      && messageText.includes(selectionText.text),
     );
   }, [
     selectionRange, selectionRange?.collapsed, selectionRange?.startOffset, selectionRange?.endOffset,
diff --git a/src/components/middle/message/Message.tsx b/src/components/middle/message/Message.tsx
index c8228e9c1..5ad2ac089 100644
--- a/src/components/middle/message/Message.tsx
+++ b/src/components/middle/message/Message.tsx
@@ -1513,6 +1513,7 @@ const Message: FC<OwnProps & StateProps> = ({
               {!asForwarded && senderEmojiStatus && (
                 <CustomEmoji
                   documentId={senderEmojiStatus.documentId}
+                  className="no-selection"
                   loopLimit={EMOJI_STATUS_LOOP_LIMIT}
                   observeIntersectionForLoading={observeIntersectionForLoading}
                   observeIntersectionForPlaying={observeIntersectionForPlaying}
@@ -1587,13 +1588,15 @@ const Message: FC<OwnProps & StateProps> = ({
         data-should-update-views={message.viewsCount !== undefined}
       />
       {!isInDocumentGroup && (
-        <div className="message-select-control">
+        <div className="message-select-control no-selection">
           {isSelected && <Icon name="select" />}
         </div>
       )}
       {isLastInDocumentGroup && (
         <div
-          className={buildClassName('message-select-control group-select', isGroupSelected && 'is-selected')}
+          className={buildClassName(
+            'message-select-control group-select no-selection', isGroupSelected && 'is-selected',
+          )}
           onClick={handleDocumentGroupSelectAll}
         >
           {isGroupSelected && (
diff --git a/src/styles/_common.scss b/src/styles/_common.scss
index 5a7ea6990..6c226b097 100644
--- a/src/styles/_common.scss
+++ b/src/styles/_common.scss
@@ -3,6 +3,7 @@
 // Common styles for all media-type components across the app.
 .media-inner {
   position: relative;
+  user-select: none;
 
   video.full-media,
   img.full-media,