refactor(@desktop/chat): make use of StatusQ's input in contact list search

Also, use `StatusPopupMenu` for starting new chats.
This commit is contained in:
Pascal Precht 2021-07-26 15:34:19 +02:00
parent 0dbfb61093
commit d47ddf69bb
No known key found for this signature in database
GPG Key ID: 0EE28D8D6FD85D7D
3 changed files with 121 additions and 95 deletions

View File

@ -17,8 +17,8 @@ StatusModal {
id: popup
onOpened: {
searchBox.text = "";
searchBox.forceActiveFocus(Qt.MouseFocusReason)
contentComponent.searchBox.text = "";
contentComponent.searchBox.forceActiveFocus(Qt.MouseFocusReason)
}
//% "Communities"
@ -44,6 +44,7 @@ StatusModal {
content: Column {
width: popup.width
property alias searchBox: searchBox
Item {
height: 68

View File

@ -11,6 +11,7 @@ import "./CommunityComponents"
import StatusQ.Core 0.1
import StatusQ.Core.Theme 0.1
import StatusQ.Controls 0.1
import StatusQ.Components 0.1
import StatusQ.Popups 0.1
@ -20,14 +21,14 @@ Item {
height: parent.height
property int chatGroupsListViewCount: channelList.chatListItems.count
property alias searchStr: searchBox.text
property alias searchStr: searchInput.text
signal openProfileClicked()
MouseArea {
anchors.fill: parent
onClicked: {
//steal focus from search field
addChat.forceActiveFocus();
actionButton.forceActiveFocus();
}
}
@ -40,25 +41,122 @@ Item {
text: qsTrId("chat")
}
SearchBox {
id: searchBox
Item {
id: searchInputWrapper
anchors.top: headline.bottom
anchors.topMargin: Style.current.padding
anchors.right: addChat.left
anchors.rightMargin: Style.current.padding
anchors.topMargin: 16
width: parent.width
height: searchInput.height
StatusBaseInput {
id: searchInput
anchors.verticalCenter: parent.verticalCenter
anchors.left: parent.left
anchors.leftMargin: Style.current.padding
anchors.right: actionButton.left
anchors.leftMargin: 16
anchors.rightMargin: 16
height: 36
topPadding: 8
bottomPadding: 0
placeholderText: qsTr("Search")
icon.name: "search"
Keys.onEscapePressed: {
addChat.forceActiveFocus();
actionButton.forceActiveFocus();
}
}
AddChat {
id: addChat
StatusRoundButton {
id: actionButton
anchors.verticalCenter: parent.verticalCenter
anchors.right: parent.right
anchors.rightMargin: Style.current.padding
anchors.top: headline.bottom
anchors.topMargin: Style.current.padding
anchors.rightMargin: 8
width: 32
height: 32
type: StatusRoundButton.Type.Secondary
icon.name: "add"
state: "default"
onClicked: chatContextMenu.popup(actionButton.width-chatContextMenu.width, actionButton.height + 4)
states: [
State {
name: "default"
PropertyChanges {
target: actionButton
icon.rotation: 0
highlighted: false
}
},
State {
name: "pressed"
PropertyChanges {
target: actionButton
icon.rotation: 45
highlighted: true
}
}
]
transitions: [
Transition {
from: "default"
to: "pressed"
RotationAnimation {
duration: 150
direction: RotationAnimation.Clockwise
easing.type: Easing.InCubic
}
},
Transition {
from: "pressed"
to: "default"
RotationAnimation {
duration: 150
direction: RotationAnimation.Counterclockwise
easing.type: Easing.OutCubic
}
}
]
StatusPopupMenu {
id: chatContextMenu
onOpened: {
actionButton.state = "pressed"
}
onClosed: {
actionButton.state = "default"
}
StatusMenuItem {
text: qsTr("Start new chat")
icon.name: "private-chat"
onTriggered: openPopup(privateChatPopupComponent)
}
StatusMenuItem {
text: qsTr("Start group chat")
icon.name: "group-chat"
onTriggered: openPopup(groupChatPopupComponent)
}
StatusMenuItem {
text: qsTr("Join public chat")
icon.name: "public-chat"
onTriggered: openPopup(publicChatPopupComponent)
}
StatusMenuItem {
text: qsTr("Communities")
icon.name: "communities"
onTriggered: openPopup(communitiesPopupComponent)
}
}
}
}
StatusContactRequestsIndicatorListItem {
@ -66,7 +164,7 @@ Item {
property int nbRequests: profileModel.contacts.contactRequests.count
anchors.top: searchBox.bottom
anchors.top: searchInputWrapper.bottom
anchors.topMargin: visible ? Style.current.padding : 0
anchors.horizontalCenter: parent.horizontalCenter

View File

@ -1,73 +0,0 @@
import QtQuick 2.13
import QtQuick.Controls 2.13
import QtQuick.Layouts 1.13
import "../../../../imports"
import "../../../../shared"
import "../../../../shared/status"
import "../components"
StatusRoundButton {
id: btnAdd
pressedIconRotation: 45
icon.name: "plusSign"
size: "medium"
type: "secondary"
width: 36
height: 36
onClicked: {
if (newChatMenu.opened) {
newChatMenu.close()
} else {
let x = btnAdd.iconX + btnAdd.icon.width / 2 - newChatMenu.width / 2
newChatMenu.popup(x, btnAdd.height + 4)
}
}
PopupMenu {
id: newChatMenu
closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutsideParent
Action {
//% "Start new chat"
text: qsTrId("start-new-chat")
icon.source: "../../../img/new_chat.svg"
icon.width: 20
icon.height: 20
onTriggered: openPopup(privateChatPopupComponent)
}
Action {
//% "Start group chat"
text: qsTrId("start-group-chat")
icon.source: "../../../img/group_chat.svg"
icon.width: 20
icon.height: 20
onTriggered: openPopup(groupChatPopupComponent)
}
Action {
//% "Join public chat"
text: qsTrId("new-public-group-chat")
icon.source: "../../../img/public_chat.svg"
icon.width: 20
icon.height: 20
onTriggered: openPopup(publicChatPopupComponent)
}
Action {
enabled: appSettings.communitiesEnabled
//% "Communities"
text: qsTrId("communities")
icon.source: "../../../img/communities.svg"
icon.width: 20
icon.height: 20
onTriggered: {
openPopup(communitiesPopupComponent)
}
}
onAboutToShow: {
btnAdd.state = "pressed"
}
onAboutToHide: {
btnAdd.state = "default"
}
}
}