From 84bfe0c8fc0cf83d78e6d106d315951483e975f5 Mon Sep 17 00:00:00 2001
From: Alexander Zinchuk <alx.zinchuk@gmail.com>
Date: Sat, 28 Jan 2023 02:15:34 +0100
Subject: [PATCH] Sticker: Prevent dragging (#2363)

---
 src/components/common/CustomEmoji.module.scss |  7 ++-----
 src/components/common/StickerView.module.scss | 12 ++++++------
 src/components/common/StickerView.tsx         |  4 +++-
 3 files changed, 11 insertions(+), 12 deletions(-)

diff --git a/src/components/common/CustomEmoji.module.scss b/src/components/common/CustomEmoji.module.scss
index 14c66d663..1f7f281ab 100644
--- a/src/components/common/CustomEmoji.module.scss
+++ b/src/components/common/CustomEmoji.module.scss
@@ -33,15 +33,12 @@
   border-radius: var(--custom-emoji-border-radius) !important;
 }
 
-.highlightCatch {
+.highlight-catch {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   user-select: auto !important;
-}
-
-.altEmoji {
-  opacity: 0;
+  z-index: 1;
 }
diff --git a/src/components/common/StickerView.module.scss b/src/components/common/StickerView.module.scss
index 673b3c845..0dbe436b7 100644
--- a/src/components/common/StickerView.module.scss
+++ b/src/components/common/StickerView.module.scss
@@ -10,14 +10,14 @@
   &:global(.closing) {
     transition-delay: 150ms;
   }
-
-  &_opaque {
-    background: var(--thumbs-background);
-    transition-delay: 0s;
-  }
 }
 
-.noTransition {
+.thumb-opaque {
+  background: var(--thumbs-background);
+  transition-delay: 0s;
+}
+
+.no-transition {
   transition: none !important;
 }
 
diff --git a/src/components/common/StickerView.tsx b/src/components/common/StickerView.tsx
index a1a2acfdf..6ed09fbff 100644
--- a/src/components/common/StickerView.tsx
+++ b/src/components/common/StickerView.tsx
@@ -132,11 +132,12 @@ const StickerView: FC<OwnProps> = ({
         className={buildClassName(
           styles.thumb,
           noTransition && styles.noTransition,
-          isThumbOpaque && styles.thumb_opaque,
+          isThumbOpaque && styles.thumbOpaque,
           thumbClassName,
           thumbClassNames,
         )}
         alt=""
+        draggable={false}
       />
       {isLottie ? (
         <AnimatedSticker
@@ -178,6 +179,7 @@ const StickerView: FC<OwnProps> = ({
           className={buildClassName(styles.media, fullMediaClassName, fullMediaClassNames)}
           src={fullMediaData}
           alt={emoji}
+          draggable={false}
         />
       )}
     </>