From 9ccc7e3ff90cd85d9b8da31bec7d8f9f83cd922c Mon Sep 17 00:00:00 2001
From: Alexander Zinchuk <alx.zinchuk@gmail.com>
Date: Sat, 25 Feb 2023 18:50:33 +0100
Subject: [PATCH] Attachment Modal: Various fixes (#2675)

---
 src/components/middle/composer/Composer.scss     |  3 +--
 src/components/middle/composer/MessageInput.tsx  |  2 +-
 src/components/middle/composer/TextFormatter.tsx |  1 +
 src/hooks/useVirtualBackdrop.ts                  | 11 +++++------
 4 files changed, 8 insertions(+), 9 deletions(-)

diff --git a/src/components/middle/composer/Composer.scss b/src/components/middle/composer/Composer.scss
index 335e53273..263070b27 100644
--- a/src/components/middle/composer/Composer.scss
+++ b/src/components/middle/composer/Composer.scss
@@ -466,8 +466,7 @@
   flex-grow: 1;
 
   .form-control {
-    padding: calc((3.5rem - var(--composer-text-size, 1rem) * 1.375) / 2 - var(--border-width, 0) * 2)
-      calc(0.9rem - var(--border-width));
+    padding: calc((3.5rem - var(--composer-text-size, 1rem) * 1.375) / 2) 0.875rem;
     overflow: hidden;
     height: auto;
     line-height: 1.375;
diff --git a/src/components/middle/composer/MessageInput.tsx b/src/components/middle/composer/MessageInput.tsx
index 1eb8a0bea..78d1e4c50 100644
--- a/src/components/middle/composer/MessageInput.tsx
+++ b/src/components/middle/composer/MessageInput.tsx
@@ -71,7 +71,7 @@ const MAX_ATTACHMENT_MODAL_INPUT_HEIGHT = 160;
 const TAB_INDEX_PRIORITY_TIMEOUT = 2000;
 // Heuristics allowing the user to make a triple click
 const SELECTION_RECALCULATE_DELAY_MS = 260;
-const TEXT_FORMATTER_SAFE_AREA_PX = 90;
+const TEXT_FORMATTER_SAFE_AREA_PX = 140;
 // For some reason Safari inserts `<br>` after user removes text from input
 const SAFARI_BR = '<br>';
 const IGNORE_KEYS = [
diff --git a/src/components/middle/composer/TextFormatter.tsx b/src/components/middle/composer/TextFormatter.tsx
index 37c72a3c1..147f93310 100644
--- a/src/components/middle/composer/TextFormatter.tsx
+++ b/src/components/middle/composer/TextFormatter.tsx
@@ -75,6 +75,7 @@ const TextFormatter: FC<OwnProps> = ({
     isOpen,
     containerRef,
     onClose,
+    true,
   );
 
   useEffect(() => {
diff --git a/src/hooks/useVirtualBackdrop.ts b/src/hooks/useVirtualBackdrop.ts
index c6f9f0a9b..290899f0a 100644
--- a/src/hooks/useVirtualBackdrop.ts
+++ b/src/hooks/useVirtualBackdrop.ts
@@ -9,12 +9,13 @@ export default function useVirtualBackdrop(
   isOpen: boolean,
   menuRef: RefObject<HTMLElement>,
   onClose?: () => void | undefined,
+  ignoreRightClick?: boolean,
 ) {
   useEffect(() => {
-    const handleEvent = (e: Event) => {
+    const handleEvent = (e: MouseEvent) => {
       const menu = menuRef.current;
       const target = e.target as HTMLElement | null;
-      if (!menu || !target) {
+      if (!menu || !target || (ignoreRightClick && e.button === 2)) {
         return;
       }
 
@@ -24,9 +25,7 @@ export default function useVirtualBackdrop(
       ) {
         e.preventDefault();
         e.stopPropagation();
-        if (onClose) {
-          onClose();
-        }
+        onClose?.();
       }
     };
 
@@ -37,5 +36,5 @@ export default function useVirtualBackdrop(
     return () => {
       document.removeEventListener('mousedown', handleEvent);
     };
-  }, [isOpen, menuRef, onClose]);
+  }, [ignoreRightClick, isOpen, menuRef, onClose]);
 }