From 3583b79789ecd43990be2bcce410b442fde540d5 Mon Sep 17 00:00:00 2001
From: geweald <misieekq@gmail.com>
Date: Wed, 2 Mar 2022 13:31:41 +0100
Subject: [PATCH] fix(ui): overflow of mentions overlay & input focus node

---
 packages/stream_chat_flutter/CHANGELOG.md     |  6 +++
 .../lib/src/message_input.dart                | 54 +++++++++++--------
 2 files changed, 37 insertions(+), 23 deletions(-)

diff --git a/packages/stream_chat_flutter/CHANGELOG.md b/packages/stream_chat_flutter/CHANGELOG.md
index 8aa64cd9..15aea4b1 100644
--- a/packages/stream_chat_flutter/CHANGELOG.md
+++ b/packages/stream_chat_flutter/CHANGELOG.md
@@ -1,3 +1,9 @@
+## Upcoming
+
+🐞 Fixed
+
+- Mentions overlay now doesn't overflow when not enough height available
+
 ## 3.5.0
 
 🐞 Fixed
diff --git a/packages/stream_chat_flutter/lib/src/message_input.dart b/packages/stream_chat_flutter/lib/src/message_input.dart
index d1a45786..bc08ebcd 100644
--- a/packages/stream_chat_flutter/lib/src/message_input.dart
+++ b/packages/stream_chat_flutter/lib/src/message_input.dart
@@ -344,6 +344,7 @@ class MessageInputState extends State<MessageInput> {
 
   final _imagePicker = ImagePicker();
   late final _focusNode = widget.focusNode ?? FocusNode();
+  late final _isInternalFocusNode = widget.focusNode == null;
   bool _inputEnabled = true;
   bool _commandEnabled = false;
   bool _showCommandsOverlay = false;
@@ -1191,30 +1192,36 @@ class MessageInputState extends State<MessageInput> {
       };
     }
 
-    return UserMentionsOverlay(
-      query: query,
-      mentionAllAppUsers: widget.mentionAllAppUsers,
-      client: StreamChat.of(context).client,
-      channel: channel,
-      size: Size(renderObject.size.width - 16, 400),
-      mentionsTileBuilder: tileBuilder,
-      onMentionUserTap: (user) {
-        _mentionedUsers.add(user);
-        splits[splits.length - 1] = user.name;
-        final rejoin = splits.join('@');
+    return LayoutBuilder(
+      builder: (context, snapshot) => UserMentionsOverlay(
+        query: query,
+        mentionAllAppUsers: widget.mentionAllAppUsers,
+        client: StreamChat.of(context).client,
+        channel: channel,
+        size: Size(
+          renderObject.size.width - 16,
+          min(400, (snapshot.maxHeight - renderObject.size.height - 16).abs()),
+        ),
+        mentionsTileBuilder: tileBuilder,
+        onMentionUserTap: (user) {
+          _mentionedUsers.add(user);
+          splits[splits.length - 1] = user.name;
+          final rejoin = splits.join('@');
 
-        textEditingController.value = TextEditingValue(
-          text: rejoin +
-              textEditingController.text.substring(
-                textEditingController.selection.start,
-              ),
-          selection: TextSelection.collapsed(
-            offset: rejoin.length,
-          ),
-        );
-        _onChangedDebounced.cancel();
-        setState(() => _showMentionsOverlay = false);
-      },
+          textEditingController.value = TextEditingValue(
+            text: rejoin +
+                textEditingController.text.substring(
+                  textEditingController.selection.start,
+                ),
+            selection: TextSelection.collapsed(
+              offset: rejoin.length,
+            ),
+          );
+          _onChangedDebounced.cancel();
+
+          setState(() => _showMentionsOverlay = false);
+        },
+      ),
     );
   }
 
@@ -1925,6 +1932,7 @@ class MessageInputState extends State<MessageInput> {
   void dispose() {
     textEditingController.dispose();
     _focusNode.removeListener(_focusNodeListener);
+    if (_isInternalFocusNode) _focusNode.dispose();
     _stopSlowMode();
     _onChangedDebounced.cancel();
     super.dispose();