From 5ac3724ed4f51cca685b66c56d30a9a8ebf01272 Mon Sep 17 00:00:00 2001
From: Tommy Chow <tommyxchow@gmail.com>
Date: Sat, 2 Jul 2022 02:46:20 -0400
Subject: [PATCH] Reorder bottom bar & tweak behavior (#90) - Moved the details
 button to the right side - The send button will now hide when text is empty,
 same behavior in official Twitch app - Fix textfield width when in landscape
 and chat only mode

---
 .../channel/chat/widgets/chat_bottom_bar.dart | 37 +++++++++++--------
 lib/screens/channel/stores/chat_store.dart    |  8 +++-
 lib/screens/channel/stores/chat_store.g.dart  | 18 +++++++++
 3 files changed, 46 insertions(+), 17 deletions(-)

diff --git a/lib/screens/channel/chat/widgets/chat_bottom_bar.dart b/lib/screens/channel/chat/widgets/chat_bottom_bar.dart
index b7737478..ef618154 100644
--- a/lib/screens/channel/chat/widgets/chat_bottom_bar.dart
+++ b/lib/screens/channel/chat/widgets/chat_bottom_bar.dart
@@ -90,21 +90,10 @@ class ChatBottomBar extends StatelessWidget {
               padding: const EdgeInsets.symmetric(vertical: 5.0),
               child: Row(
                 children: [
-                  IconButton(
-                    icon: Icon(Icons.adaptive.more),
-                    tooltip: 'Chat details',
-                    onPressed: () => showModalBottomSheet(
-                      backgroundColor: Colors.transparent,
-                      isScrollControlled: true,
-                      context: context,
-                      builder: (_) => ChatDetails(
-                        chatDetailsStore: chatStore.chatDetailsStore,
-                        chatStore: chatStore,
-                        userLogin: chatStore.channelName,
-                      ),
-                    ),
-                  ),
-                  if (!chatStore.expandChat && chatStore.settings.chatWidth < 0.3 && MediaQuery.of(context).orientation == Orientation.landscape)
+                  if (!chatStore.expandChat &&
+                      chatStore.settings.chatWidth < 0.3 &&
+                      chatStore.settings.showVideo &&
+                      MediaQuery.of(context).orientation == Orientation.landscape)
                     IconButton(
                       tooltip: 'Send a message',
                       onPressed: () {
@@ -142,12 +131,28 @@ class ChatBottomBar extends StatelessWidget {
                         ),
                       ),
                     ),
-                  if (chatStore.settings.chatWidth >= 0.3 || chatStore.expandChat || MediaQuery.of(context).orientation == Orientation.portrait)
+                  if (chatStore.showSendButton &&
+                      (chatStore.settings.chatWidth >= 0.3 || chatStore.expandChat || MediaQuery.of(context).orientation == Orientation.portrait))
                     IconButton(
                       tooltip: 'Send',
                       icon: const Icon(Icons.send),
                       onPressed: chatStore.auth.isLoggedIn ? () => chatStore.sendMessage(chatStore.textController.text) : null,
                     )
+                  else
+                    IconButton(
+                      icon: Icon(Icons.adaptive.more),
+                      tooltip: 'Chat details',
+                      onPressed: () => showModalBottomSheet(
+                        backgroundColor: Colors.transparent,
+                        isScrollControlled: true,
+                        context: context,
+                        builder: (_) => ChatDetails(
+                          chatDetailsStore: chatStore.chatDetailsStore,
+                          chatStore: chatStore,
+                          userLogin: chatStore.channelName,
+                        ),
+                      ),
+                    ),
                 ],
               ),
             ),
diff --git a/lib/screens/channel/stores/chat_store.dart b/lib/screens/channel/stores/chat_store.dart
index 69c8d1bf..b8d1d4e9 100644
--- a/lib/screens/channel/stores/chat_store.dart
+++ b/lib/screens/channel/stores/chat_store.dart
@@ -71,6 +71,9 @@ abstract class ChatStoreBase with Store {
   @readonly
   var _autoScroll = true;
 
+  @readonly
+  var _showSendButton = false;
+
   @readonly
   var _showEmoteAutocomplete = false;
 
@@ -143,7 +146,10 @@ abstract class ChatStoreBase with Store {
     textController
         .addListener(() => _showEmoteAutocomplete = !_showMentionAutocomplete && textFieldFocusNode.hasFocus && textController.text.split(' ').last.isNotEmpty);
 
-    textController.addListener(() => _showMentionAutocomplete = textFieldFocusNode.hasFocus && textController.text.split(' ').last.startsWith('@'));
+    textController.addListener(() {
+      _showSendButton = textController.text.isNotEmpty;
+      _showMentionAutocomplete = textFieldFocusNode.hasFocus && textController.text.split(' ').last.startsWith('@');
+    });
   }
 
   /// Handle and process the provided string-representation of the IRC data.
diff --git a/lib/screens/channel/stores/chat_store.g.dart b/lib/screens/channel/stores/chat_store.g.dart
index 4d4189c8..a2f3f2b1 100644
--- a/lib/screens/channel/stores/chat_store.g.dart
+++ b/lib/screens/channel/stores/chat_store.g.dart
@@ -45,6 +45,24 @@ mixin _$ChatStore on ChatStoreBase, Store {
     });
   }
 
+  late final _$_showSendButtonAtom =
+      Atom(name: 'ChatStoreBase._showSendButton', context: context);
+
+  bool get showSendButton {
+    _$_showSendButtonAtom.reportRead();
+    return super._showSendButton;
+  }
+
+  @override
+  bool get _showSendButton => showSendButton;
+
+  @override
+  set _showSendButton(bool value) {
+    _$_showSendButtonAtom.reportWrite(value, super._showSendButton, () {
+      super._showSendButton = value;
+    });
+  }
+
   late final _$_showEmoteAutocompleteAtom =
       Atom(name: 'ChatStoreBase._showEmoteAutocomplete', context: context);