fix(search): fix missing scroll and wrong heights

Also fixes a bug where if the search was cleared, messages would after that appear all on top of each other. 
Also leaves the popup live after closing so the search can be gone back to

ui/app/AppLayouts/Chat/ChatColumn.qml

@@ -248,18 +248,15 @@ StackLayout {
                                 qsTr("Contact") :
                                 qsTr("Contact request pending") :
                             qsTr("Not a contact"))
-                        break;
                     case Constants.chatTypePublic:
                         return qsTr("Public chat")
                     case Constants.chatTypePrivateGroupChat:
                         let cnt = chatsModel.channelView.activeChannel.members.rowCount();
                         if(cnt > 1) return qsTr("%1 members").arg(cnt);
                         return qsTr("1 member");
-                        break;
                     case Constants.chatTypeCommunity:
                     default:
                         return ""
-                        break;
                 }
             }
             chatInfoButton.image.source: profileImage || chatsModel.channelView.activeChannel.identicon
@@ -291,6 +288,11 @@ StackLayout {
             notificationButton.visible: appSettings.isActivityCenterEnabled
             notificationCount: chatsModel.activityNotificationList.unreadCount
 
+            onSearchButtonClicked: searchPopup.open()
+            SearchPopup {
+                id: searchPopup
+            }
+
             onMembersButtonClicked: showUsers = !showUsers
             onNotificationButtonClicked: activityCenter.open()
 

ui/app/AppLayouts/Chat/components/SearchPopup.qml

@@ -21,23 +21,23 @@ Popup {
     y: Math.round(((parent ? parent.height : 0) - height) / 2)
     width: 690
     height: {
-        if (!searchResults || !searchResults.length) {
+        const noResultHeight = 122
-            return 122
+        let minHeight = 560
+        const maxHeight = parent.height - 200
+        if (!searchResults || !searchResults.length || !searchResultContent.visible) {
+            return noResultHeight
         }
 
-        // FIXME childrenRect has a binding loop for some reason
+        if (minHeight > maxHeight) {
-        const childrenHeight = searchHeader.height + channelBadge.height + channelBadge.anchors.topMargin +
+            return maxHeight
-                             searchResultContent.height + searchResultContent.anchors.topMargin
+        }
 
-        // min height
+        if (messageColumn.height < minHeight - noResultHeight) {
-        if (childrenHeight < 560) {
+            return minHeight
-            return 560
         }
-        // max height
+        if (messageColumn.height > maxHeight - noResultHeight) {
-        if (childrenHeight > 970) {
+            return maxHeight
-            return 970
         }
-        return childrenHeight
     }
     background: Rectangle {
         color: Style.current.background
@@ -49,7 +49,6 @@ Popup {
     }
     onClosed: {
         popupOpened = false
-        destroy()
     }
     padding: 0
 
@@ -70,13 +69,14 @@ Popup {
 
         property var searchMessages: Backpressure.debounce(searchInput, 400, function (value) {
             if (value === "") {
-                searchResults = []
+                searchResultContent.visible = false
                 return
             }
 
             // TODO add loading?
             const messageIdsStr = chatsModel.messageView.messageList.messageSearch(value)
             try {
+                searchResultContent.visible = true
                 searchResults = JSON.parse(messageIdsStr)
             } catch (e) {
                 console.error ("Error parsing search result", e)
@@ -142,8 +142,7 @@ Popup {
         id: searchResultContent
         visible: !!popup.searchResults && popup.searchResults.length > 0
         width: parent.width
-        height: visible ? implicitHeight + anchors.topMargin : 0
+        anchors.bottom: parent.bottom
-        implicitHeight: childrenRect.height
         anchors.top: channelBadge.bottom
         anchors.topMargin: visible ? 13 : 0
 
@@ -164,66 +163,74 @@ Popup {
             anchors.leftMargin: Style.current.bigPadding
         }
 
-        Column {
+        ScrollView {
+            id: scrollView
             anchors.top: sectionTitle.bottom
             anchors.topMargin: 4
+            anchors.bottom: parent.bottom
+            anchors.bottomMargin: Style.current.smallPadding
             width: parent.width
-            height: searchResultContent.visible ? childrenRect.height : 0
+            clip: true
-            spacing: 0
 
-            Repeater {
+            Column {
-                model: popup.searchResults
+                id: messageColumn
+                width: parent.width
+                spacing: 0
 
-                delegate: Message {
+                Repeater {
-                    property var messageItem: ({})
+                    model: popup.searchResults
 
-                    function getMessage() {
+                    delegate: Message {
-                        chatsModel.messageView.setObservedMessageItem(popup.chatId, modelData)
+                        property var messageItem: ({})
-                        return chatsModel.messageView.observedMessageItem
-                    }
 
-                    Component.onCompleted: {
+                        function getMessage() {
-                        messageItem = getMessage()
+                            chatsModel.messageView.setObservedMessageItem(popup.chatId, modelData)
-                    }
+                            return chatsModel.messageView.observedMessageItem
-
-                    anchors.right: undefined
-                    messageId: messageItem.messageId
-                    fromAuthor: messageItem.fromAuthor
-                    chatId: messageItem.chatId
-                    userName: messageItem.userName
-                    alias: messageItem.alias
-                    localName: messageItem.localName
-                    message: messageItem.message
-                    plainText: messageItem.plainText
-                    identicon: messageItem.identicon
-                    isCurrentUser: messageItem.isCurrentUser
-                    timestamp: messageItem.timestamp
-                    sticker: messageItem.sticker
-                    contentType: messageItem.contentType
-                    outgoingStatus: messageItem.outgoingStatus
-                    responseTo: messageItem.responseTo
-                    imageClick: imagePopup.openPopup.bind(imagePopup)
-                    linkUrls: messageItem.linkUrls
-                    communityId: messageItem.communityId
-                    hasMention: messageItem.hasMention
-                    stickerPackId: messageItem.stickerPackId
-                    pinnedBy: messageItem.pinnedBy
-                    pinnedMessage: messageItem.isPinned
-                    activityCenterMessage: true
-                    clickMessage: function (isProfileClick) {
-                        if (isProfileClick) {
-                            const pk = messageItem.fromAuthor
-                            const userProfileImage = appMain.getProfileImage(pk)
-                            return openProfilePopup(chatsModel.userNameOrAlias(pk), pk, userProfileImage || utilsModel.generateIdenticon(pk))
                         }
 
-                        popup.close()
+                        Component.onCompleted: {
+                            messageItem = getMessage()
+                        }
 
-                        positionAtMessage(messageItem.messageId)
+                        anchors.right: undefined
+                        messageId: messageItem.messageId
+                        fromAuthor: messageItem.fromAuthor
+                        chatId: messageItem.chatId
+                        userName: messageItem.userName
+                        alias: messageItem.alias
+                        localName: messageItem.localName
+                        message: messageItem.message
+                        plainText: messageItem.plainText
+                        identicon: messageItem.identicon
+                        isCurrentUser: messageItem.isCurrentUser
+                        timestamp: messageItem.timestamp
+                        sticker: messageItem.sticker
+                        contentType: messageItem.contentType
+                        outgoingStatus: messageItem.outgoingStatus
+                        responseTo: messageItem.responseTo
+                        imageClick: imagePopup.openPopup.bind(imagePopup)
+                        linkUrls: messageItem.linkUrls
+                        communityId: messageItem.communityId
+                        hasMention: messageItem.hasMention
+                        stickerPackId: messageItem.stickerPackId
+                        pinnedBy: messageItem.pinnedBy
+                        pinnedMessage: messageItem.isPinned
+                        activityCenterMessage: true
+                        clickMessage: function (isProfileClick) {
+                            if (isProfileClick) {
+                                const pk = messageItem.fromAuthor
+                                const userProfileImage = appMain.getProfileImage(pk)
+                                return openProfilePopup(chatsModel.userNameOrAlias(pk), pk, userProfileImage || utilsModel.generateIdenticon(pk))
+                            }
+
+                            popup.close()
+
+                            positionAtMessage(messageItem.messageId)
+                        }
+
+                        prevMessageIndex: -1
+                        prevMsgTimestamp: ""
                     }
-
-                    prevMessageIndex: -1
-                    prevMsgTimestamp: ""
                 }
             }
         }