From fe1250076726d197321b53cf5ac3fb72d5b51e1c Mon Sep 17 00:00:00 2001
From: Jordan Vidrine <30537603+jordanvidrine@users.noreply.github.com>
Date: Thu, 24 Apr 2025 09:32:28 -0500
Subject: [PATCH] UX: Do not let composer affect chat window height (#32423)

---
 .../javascripts/discourse/app/components/composer-body.js | 8 ++++++--
 app/assets/stylesheets/common/base/compose.scss           | 1 -
 .../chat/assets/stylesheets/common/chat-height-mixin.scss | 8 +++-----
 3 files changed, 9 insertions(+), 8 deletions(-)

diff --git a/app/assets/javascripts/discourse/app/components/composer-body.js b/app/assets/javascripts/discourse/app/components/composer-body.js
index 13f2cc93019..bd38e6b3fc4 100644
--- a/app/assets/javascripts/discourse/app/components/composer-body.js
+++ b/app/assets/javascripts/discourse/app/components/composer-body.js
@@ -133,7 +133,9 @@ export default class ComposerBody extends Component {
     this.lastMousePos = mouseYPos(event);
 
     DRAG_EVENTS.forEach((dragEvent) => {
-      document.addEventListener(dragEvent, this.throttledPerformDrag);
+      document.addEventListener(dragEvent, this.throttledPerformDrag, {
+        capture: true,
+      });
     });
 
     END_DRAG_EVENTS.forEach((endDragEvent) => {
@@ -148,7 +150,9 @@ export default class ComposerBody extends Component {
     this.appEvents.trigger("composer:resize-ended");
 
     DRAG_EVENTS.forEach((dragEvent) => {
-      document.removeEventListener(dragEvent, this.throttledPerformDrag);
+      document.removeEventListener(dragEvent, this.throttledPerformDrag, {
+        capture: true,
+      });
     });
 
     END_DRAG_EVENTS.forEach((endDragEvent) => {
diff --git a/app/assets/stylesheets/common/base/compose.scss b/app/assets/stylesheets/common/base/compose.scss
index 165aaf16297..a7784e04a78 100644
--- a/app/assets/stylesheets/common/base/compose.scss
+++ b/app/assets/stylesheets/common/base/compose.scss
@@ -1,6 +1,5 @@
 html.composer-open {
   #main-outlet {
-    padding-bottom: var(--composer-height);
     transition: padding-bottom 250ms ease;
   }
 }
diff --git a/plugins/chat/assets/stylesheets/common/chat-height-mixin.scss b/plugins/chat/assets/stylesheets/common/chat-height-mixin.scss
index bd3909d1392..28e3ed71e0b 100644
--- a/plugins/chat/assets/stylesheets/common/chat-height-mixin.scss
+++ b/plugins/chat/assets/stylesheets/common/chat-height-mixin.scss
@@ -5,7 +5,7 @@
     var(--composer-vh, 1vh) * 100 - var(--main-outlet-offset, 0px) - 1px -
       $inset
   );
-  height: calc($base-height - var(--composer-height, 0px));
+  height: calc($base-height);
 
   // mobile with keyboard opened
   html.keyboard-visible & {
@@ -14,13 +14,11 @@
 
   // ipad
   html.footer-nav-ipad & {
-    height: calc($base-height - var(--composer-height, 0px));
+    height: calc($base-height);
   }
 
   // PWA/HUB without keyboard
   html.footer-nav-visible:not(.keyboard-visible) & {
-    height: calc(
-      $base-height - var(--composer-height, 0px) - var(--footer-nav-height, 0px)
-    );
+    height: calc($base-height - var(--footer-nav-height, 0px));
   }
 }