From e5f147e9778f61b47b765d6481a8a5fda8a978b6 Mon Sep 17 00:00:00 2001
From: miruka <miruka@disroot.org>
Date: Tue, 14 Jul 2020 04:54:23 -0400
Subject: [PATCH] Add expand/search button to room pane when narrow

---
 .../Chat/RoomPane/MemberView/MemberView.qml   | 82 ++++++++++++-------
 src/icons/thin/room-pane-expand-search.svg    |  3 +
 2 files changed, 54 insertions(+), 31 deletions(-)
 create mode 100644 src/icons/thin/room-pane-expand-search.svg

diff --git a/src/gui/Pages/Chat/RoomPane/MemberView/MemberView.qml b/src/gui/Pages/Chat/RoomPane/MemberView/MemberView.qml
index 51e2ab68..d89dc046 100644
--- a/src/gui/Pages/Chat/RoomPane/MemberView/MemberView.qml
+++ b/src/gui/Pages/Chat/RoomPane/MemberView/MemberView.qml
@@ -65,11 +65,12 @@ HColumnLayout {
         color: theme.chat.roomPane.bottomBar.background
 
         Layout.fillWidth: true
-        Layout.minimumHeight: theme.baseElementsHeight
-        Layout.maximumHeight: Layout.minimumHeight
+        Layout.preferredHeight: childrenRect.height
 
         HRowLayout {
-            anchors.fill: parent
+            width: parent.width
+            layoutDirection:
+                expandButton.visible ? Qt.RightToLeft : Qt.LeftToRight
 
             HTextField {
                 id: filterField
@@ -82,7 +83,6 @@ HColumnLayout {
                 opacity: width >= 16 * theme.uiScale ? 1 : 0
 
                 Layout.fillWidth: true
-                Layout.fillHeight: true
 
                 // FIXME: fails to display sometimes for some reason if
                 // declared normally
@@ -124,37 +124,57 @@ HColumnLayout {
                 Behavior on opacity { HNumberAnimation {} }
             }
 
-            HButton {
-                id: inviteButton
-                icon.name: "room-send-invite"
-                backgroundColor:
-                    theme.chat.roomPane.bottomBar.inviteButton.background
-                enabled:
-                    chat.userInfo.presence !== "offline" &&
-                    chat.roomInfo.can_invite
+            HColumnLayout {
+                HButton {
+                    id: inviteButton
+                    icon.name: "room-send-invite"
+                    backgroundColor:
+                        theme.chat.roomPane.bottomBar.inviteButton.background
+                    enabled:
+                        chat.userInfo.presence !== "offline" &&
+                        chat.roomInfo.can_invite
 
-                toolTip.text:
-                    enabled ?
-                    qsTr("Invite members to this room") :
-                    qsTr("No permission to invite members to this room")
+                    toolTip.text:
+                        enabled ?
+                        qsTr("Invite members to this room") :
+                        qsTr("No permission to invite members to this room")
 
-                onClicked: utils.makePopup(
-                    "Popups/InviteToRoomPopup.qml",
-                    {
-                        userId: chat.userId,
-                        roomId: chat.roomId,
-                        roomName: chat.roomInfo.display_name,
-                        invitingAllowed:
-                            Qt.binding(() => inviteButton.enabled),
-                    },
-                )
+                    onClicked: utils.makePopup(
+                        "Popups/InviteToRoomPopup.qml",
+                        {
+                            userId: chat.userId,
+                            roomId: chat.roomId,
+                            roomName: chat.roomInfo.display_name,
+                            invitingAllowed:
+                                Qt.binding(() => inviteButton.enabled),
+                        },
+                    )
 
-                Layout.fillHeight: true
+                    Layout.preferredHeight: filterField.implicitHeight
 
-                HShortcut {
-                    sequences: window.settings.keys.inviteToRoom
-                    onActivated:
-                        if (inviteButton.enabled) inviteButton.clicked()
+                    HShortcut {
+                        sequences: window.settings.keys.inviteToRoom
+                        onActivated:
+                            if (inviteButton.enabled) inviteButton.clicked()
+                    }
+                }
+
+                HButton {
+                    id: expandButton
+                    icon.name: "room-pane-expand-search"
+                    backgroundColor: inviteButton.backgroundColor
+                    toolTip.text: qsTr("Expand search")
+                    visible: Layout.preferredHeight > 0
+
+                    // Will trigger roomPane.requireDefaultSize
+                    onClicked: filterField.forceActiveFocus()
+
+                    Layout.preferredHeight:
+                        filterField.width < 32 * theme.uiScale ?
+                        filterField.implicitHeight :
+                        0
+
+                    Behavior on Layout.preferredHeight { HNumberAnimation {} }
                 }
             }
         }
diff --git a/src/icons/thin/room-pane-expand-search.svg b/src/icons/thin/room-pane-expand-search.svg
new file mode 100644
index 00000000..db70421c
--- /dev/null
+++ b/src/icons/thin/room-pane-expand-search.svg
@@ -0,0 +1,3 @@
+<svg height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg">
+    <path d="m23.809 21.646-6.205-6.205c1.167-1.605 1.857-3.579 1.857-5.711 0-5.365-4.365-9.73-9.731-9.73-5.365 0-9.73 4.365-9.73 9.73 0 5.366 4.365 9.73 9.73 9.73 2.034 0 3.923-.627 5.487-1.698l6.238 6.238zm-20.955-11.916c0-3.792 3.085-6.877 6.877-6.877s6.877 3.085 6.877 6.877-3.085 6.877-6.877 6.877c-3.793 0-6.877-3.085-6.877-6.877z"/>
+</svg>