status-im/status-desktop
2
0
Fork 0
mirror of https://github.com/status-im/status-desktop.git synced 2025-01-13 15:55:18 +00:00
Code Issues Projects Releases Wiki Activity

feature(@desktop/chat): popup search added on the left side

Browse Source 
As requested by design popup search added for the left side, click on a search
field (above channels list).

Refers to the changes requested by the issue-2934

Fixes: #2934
This commit is contained in:
Sale Djenic 2021-08-16 10:54:20 +02:00 committed by Iuri Matias
parent 06c10df134
commit 1b6ae41c63
3 changed files with 127 additions and 143 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

102
ui/app/AppLayouts/Chat/ChatColumn.qml
View File

@ -7,7 +7,6 @@ import QtGraphicalEffects 1.0
import StatusQ.Core.Theme 0.1
import StatusQ.Components 0.1
import StatusQ.Controls 0.1
import StatusQ.Popups 0.1
import "../../../shared"
import "../../../shared/status"
@ -165,107 +164,6 @@ Item {
}
}
StatusSearchLocationMenu {
id: searchPopupMenu
searchPopup: searchPopup
locatioModel: chatsModel.messageSearchViewController.locationMenuModel
onItemClicked: {
chatsModel.messageSearchViewController.setSearchLocation(firstLevelItemValue, secondLevelItemValue)
if(searchPopup.searchText !== "")
searchMessages(searchPopup.searchText)
}
}
property var searchMessages: Backpressure.debounce(searchPopup, 400, function (value) {
chatsModel.messageSearchViewController.searchMessages(value)
})
StatusSearchPopup {
id: searchPopup
noResultsLabel: qsTr("No results")
defaultSearchLocationText: qsTr("Anywhere")
searchOptionsPopupMenu: searchPopupMenu
searchResults: chatsModel.messageSearchViewController.resultModel
onSearchTextChanged: {
searchMessages(searchPopup.searchText);
}
onAboutToHide: {
if (searchPopupMenu.visible) {
searchPopupMenu.close();
}
//clear menu
for (var i = 2; i <= searchPopupMenu.count; i++) {
searchPopupMenu.removeItem(searchPopupMenu.takeItem(i));
}
}
onClosed: {
searchPopupMenu.dismiss();
}
onOpened: {
searchPopup.resetSearchSelection();
chatsModel.messageSearchViewController.prepareLocationMenuModel()
const jsonObj = chatsModel.messageSearchViewController.getSearchLocationObject()
if (!jsonObj) {
return
}
let obj = JSON.parse(jsonObj)
if (obj.location === "") {
if(obj.subLocation === "") {
chatsModel.messageSearchViewController.setSearchLocation("", "")
}
else {
searchPopup.setSearchSelection(obj.subLocation.text,
"",
obj.subLocation.imageSource,
obj.subLocation.isIdenticon,
obj.subLocation.iconName,
obj.subLocation.identiconColor)
chatsModel.messageSearchViewController.setSearchLocation("", obj.subLocation.value)
}
}
else {
if (obj.location.title === "Chat") {
searchPopup.setSearchSelection(obj.subLocation.text,
"",
obj.subLocation.imageSource,
obj.subLocation.isIdenticon,
obj.subLocation.iconName,
obj.subLocation.identiconColor)
chatsModel.messageSearchViewController.setSearchLocation(obj.location.value, obj.subLocation.value)
}
else {
searchPopup.setSearchSelection(obj.location.title,
obj.subLocation.text,
obj.location.imageSource,
obj.location.isIdenticon,
obj.location.iconName,
obj.location.identiconColor)
chatsModel.messageSearchViewController.setSearchLocation(obj.location.value, obj.subLocation.value)
}
}
}
onResultItemClicked: {
searchPopup.close()
chatsModel.switchToSearchedItem(itemId)
}
onResultItemTitleClicked: {
const pk = titleId
const userProfileImage = appMain.getProfileImage(pk)
return openProfilePopup(chatsModel.userNameOrAlias(pk), pk, userProfileImage || utilsModel.generateIdenticon(pk))
}
}
StackLayout {
anchors.fill: parent
currentIndex: chatsModel.channelView.activeChannelIndex > -1 && chatGroupsListViewCount > 0 ? 0 : 1

110
ui/app/AppLayouts/Chat/ChatLayout.qml
View File

@ -11,6 +11,7 @@ import "./ChatColumn"
import "./CommunityComponents"
import StatusQ.Layout 0.1
import StatusQ.Popups 0.1
StatusAppThreePanelLayout {
id: chatView
@ -33,6 +34,115 @@ StatusAppThreePanelLayout {
chatColumn.onActivated()
}
StatusSearchLocationMenu {
id: searchPopupMenu
searchPopup: searchPopup
locationModel: chatsModel.messageSearchViewController.locationMenuModel
onItemClicked: {
chatsModel.messageSearchViewController.setSearchLocation(firstLevelItemValue, secondLevelItemValue)
if(searchPopup.searchText !== "")
searchMessages(searchPopup.searchText)
}
}
property var searchMessages: Backpressure.debounce(searchPopup, 400, function (value) {
chatsModel.messageSearchViewController.searchMessages(value)
})
Connections {
target: chatsModel.messageSearchViewController.locationMenuModel
onModelAboutToBeReset: {
for (var i = 2; i <= searchPopupMenu.count; i++) {
//clear menu
if (!!searchPopupMenu.takeItem(i)) {
searchPopupMenu.removeItem(searchPopupMenu.takeItem(i));
}
}
}
}
StatusSearchPopup {
id: searchPopup
noResultsLabel: qsTr("No results")
defaultSearchLocationText: qsTr("Anywhere")
searchOptionsPopupMenu: searchPopupMenu
searchResults: chatsModel.messageSearchViewController.resultModel
onSearchTextChanged: {
searchMessages(searchPopup.searchText);
}
onAboutToHide: {
if (searchPopupMenu.visible) {
searchPopupMenu.close();
}
}
onClosed: {
searchPopupMenu.dismiss();
}
onOpened: {
searchPopup.resetSearchSelection();
chatsModel.messageSearchViewController.prepareLocationMenuModel()
const jsonObj = chatsModel.messageSearchViewController.getSearchLocationObject()
if (!jsonObj) {
return
}
let obj = JSON.parse(jsonObj)
if (obj.location === "") {
if(obj.subLocation === "") {
chatsModel.messageSearchViewController.setSearchLocation("", "")
}
else {
searchPopup.setSearchSelection(obj.subLocation.text,
"",
obj.subLocation.imageSource,
obj.subLocation.isIdenticon,
obj.subLocation.iconName,
obj.subLocation.identiconColor)
chatsModel.messageSearchViewController.setSearchLocation("", obj.subLocation.value)
}
}
else {
if (obj.location.title === "Chat") {
searchPopup.setSearchSelection(obj.subLocation.text,
"",
obj.subLocation.imageSource,
obj.subLocation.isIdenticon,
obj.subLocation.iconName,
obj.subLocation.identiconColor)
chatsModel.messageSearchViewController.setSearchLocation(obj.location.value, obj.subLocation.value)
}
else {
searchPopup.setSearchSelection(obj.location.title,
obj.subLocation.text,
obj.location.imageSource,
obj.location.isIdenticon,
obj.location.iconName,
obj.location.identiconColor)
chatsModel.messageSearchViewController.setSearchLocation(obj.location.value, obj.subLocation.value)
}
}
}
onResultItemClicked: {
searchPopup.close()
chatsModel.switchToSearchedItem(itemId)
}
onResultItemTitleClicked: {
const pk = titleId
const userProfileImage = appMain.getProfileImage(pk)
return openProfilePopup(chatsModel.userNameOrAlias(pk), pk, userProfileImage || utilsModel.generateIdenticon(pk))
}
}
leftPanel: Loader {
id: contactColumnLoader
sourceComponent: appSettings.communitiesEnabled && chatsModel.communities.activeCommunity.active ? communtiyColumnComponent : contactsColumnComponent

58
ui/app/AppLayouts/Chat/ContactsColumn.qml
View File

@ -21,7 +21,6 @@ Item {
height: parent.height
property int chatGroupsListViewCount: channelList.chatListItems.count
property alias searchStr: searchInput.text
signal openProfileClicked()
MouseArea {
@ -48,23 +47,29 @@ Item {
width: parent.width
height: searchInput.height
StatusBaseInput {
id: searchInput
Item {
anchors.verticalCenter: parent.verticalCenter
anchors.left: parent.left
anchors.right: actionButton.left
anchors.leftMargin: 16
anchors.rightMargin: 16
implicitHeight: searchInput.height
implicitWidth: searchInput.width
height: 36
topPadding: 8
bottomPadding: 0
//% "Search"
placeholderText: qsTrId("search")
icon.name: "search"
Keys.onEscapePressed: {
actionButton.forceActiveFocus();
StatusBaseInput {
id: searchInput
height: 36
width: parent.width
topPadding: 8
bottomPadding: 0
//% "Search"
placeholderText: qsTrId("search")
icon.name: "search"
}
MouseArea {
anchors.fill: parent
onClicked: searchPopup.open()
}
}
@ -202,23 +207,6 @@ Item {
clip: true
Item {
id: noSearchResults
anchors.top: parent.top
anchors.horizontalCenter: parent.horizontalCenter
width: parent.width
visible: !!!channelList.height && contactsColumn.searchStr !== ""
height: visible ? 300 : 0
StatusBaseText {
font.pixelSize: 15
color: Theme.palette.directColor5
anchors.centerIn: parent
//% "No search results"
text: qsTrId("no-search-results")
}
}
StatusChatList {
id: channelList
@ -232,10 +220,6 @@ Item {
return appMain.getProfileImage(id)
}
filterFn: function (chatListItem) {
return !!!contactsColumn.searchStr || chatListItem.name.toLowerCase().includes(contactsColumn.searchStr.toLowerCase())
}
Connections {
target: profileModel.contacts.list
onContactChanged: {
@ -265,14 +249,6 @@ Item {
}
}
}
EmptyView {
id: emptyViewAndSuggestions
width: parent.width
visible: !appSettings.hideChannelSuggestions && !noSearchResults.visible
anchors.top: noSearchResults.visible ? noSearchResults.bottom : channelList.bottom
anchors.topMargin: 32
}
}
Component {