From 3169fe636b9142e0f49e1a150d1f751e344fed5a Mon Sep 17 00:00:00 2001 From: Jonathan Rainville Date: Mon, 12 Jul 2021 13:42:40 -0400 Subject: [PATCH] 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 | 8 +- .../Chat/components/SearchPopup.qml | 137 +++++++++--------- 2 files changed, 77 insertions(+), 68 deletions(-) diff --git a/ui/app/AppLayouts/Chat/ChatColumn.qml b/ui/app/AppLayouts/Chat/ChatColumn.qml index e9cd7f3f71..1bf203e1ce 100644 --- a/ui/app/AppLayouts/Chat/ChatColumn.qml +++ b/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() diff --git a/ui/app/AppLayouts/Chat/components/SearchPopup.qml b/ui/app/AppLayouts/Chat/components/SearchPopup.qml index 4b6d3220c9..07d425a63e 100644 --- a/ui/app/AppLayouts/Chat/components/SearchPopup.qml +++ b/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) { - return 122 + const noResultHeight = 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 - const childrenHeight = searchHeader.height + channelBadge.height + channelBadge.anchors.topMargin + - searchResultContent.height + searchResultContent.anchors.topMargin + if (minHeight > maxHeight) { + return maxHeight + } - // min height - if (childrenHeight < 560) { - return 560 + if (messageColumn.height < minHeight - noResultHeight) { + return minHeight } - // max height - if (childrenHeight > 970) { - return 970 + if (messageColumn.height > maxHeight - noResultHeight) { + return maxHeight } - 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 - implicitHeight: childrenRect.height + anchors.bottom: parent.bottom 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 - spacing: 0 + clip: true - Repeater { - model: popup.searchResults + Column { + id: messageColumn + width: parent.width + spacing: 0 - delegate: Message { - property var messageItem: ({}) + Repeater { + model: popup.searchResults - function getMessage() { - chatsModel.messageView.setObservedMessageItem(popup.chatId, modelData) - return chatsModel.messageView.observedMessageItem - } + delegate: Message { + property var messageItem: ({}) - Component.onCompleted: { - messageItem = getMessage() - } - - 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)) + function getMessage() { + chatsModel.messageView.setObservedMessageItem(popup.chatId, modelData) + return chatsModel.messageView.observedMessageItem } - 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: "" } } }