Skip to content

Commit

Permalink
fix(CreateChatView): fixed tagselector various issues
Browse files Browse the repository at this point in the history 
Closes status-im#7340
  • Loading branch information
@alexandraB99 @iurimatias
alexandraB99 authored and iurimatias committed Nov 14, 2022
1 parent 77fa884 commit 019a65a
Show file tree
Hide file tree
Showing 5 changed files with 126 additions and 97 deletions.
171 changes: 91 additions & 80 deletions ui/app/AppLayouts/Chat/panels/InlineSelectorPanel.qml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,9 +24,15 @@ Item {
readonly property alias warningLabel: warningLabel
readonly property alias edit: edit

property bool confirmBtnEnabled: (listView.count > 0)

signal confirmed()
signal rejected()

signal enterKeyPressed()
signal upKeyPressed()
signal downKeyPressed()

signal entryAccepted(var suggestionsDelegate)
signal entryRemoved(var delegate)
signal textPasted(string text)
Expand Down Expand Up @@ -60,100 +66,105 @@ Item {
Item {
Layout.fillWidth: true
Layout.fillHeight: true
StatusScrollView {
id: scrollView
anchors.fill: parent
padding: 0
onContentWidthChanged: {
if (scrollView.contentWidth > scrollView.width) {
scrollView.contentX = scrollView.contentWidth - scrollView.width
} else {
scrollView.contentX = 0
}
}
onWidthChanged: {
listView.positionViewAtEnd();
}

RowLayout {
height: scrollView.height
RowLayout {
anchors.fill: parent
Item {
//40 px least space for input
Layout.preferredWidth: (listView.contentWidth < (parent.width - 40)) ?
listView.contentWidth : (parent.width - 40)
Layout.preferredHeight: 44
StatusListView {
clip: true
id: listView
Layout.fillWidth: true
Layout.preferredHeight: 30
implicitWidth: contentWidth
width: parent.width
height: 30
anchors.verticalCenter: parent.verticalCenter
orientation: ListView.Horizontal
spacing: Style.current.halfPadding
ScrollBar.horizontal: scrollBar
onCountChanged: {
positionViewAtEnd();
}
}
StatusScrollBar {
id: scrollBar
parent: listView.parent
anchors.top: listView.bottom
anchors.left: listView.left
anchors.right: listView.right
policy: ScrollBar.AsNeeded
visible: resolveVisibility(policy, listView.width, listView.contentWidth)
}
}
TextInput {
id: edit
Layout.fillWidth: true
Layout.fillHeight: true
verticalAlignment: Text.AlignVCenter
font.pixelSize: 15
color: Theme.palette.directColor1
clip: true

selectByMouse: true
selectionColor: Theme.palette.primaryColor2
selectedTextColor: color

cursorDelegate: Rectangle {
color: Theme.palette.primaryColor1
implicitWidth: 2
radius: 1
visible: edit.cursorVisible
SequentialAnimation on visible {
loops: Animation.Infinite
running: edit.cursorVisible
PropertyAnimation { to: false; duration: 600; }
PropertyAnimation { to: true; duration: 600; }
}
}

TextInput {
id: edit
Layout.minimumWidth: 4
Layout.fillHeight: true
verticalAlignment: Text.AlignVCenter
font.pixelSize: 15
color: Theme.palette.directColor1

selectByMouse: true
selectionColor: Theme.palette.primaryColor2
selectedTextColor: color

cursorDelegate: Rectangle {
color: Theme.palette.primaryColor1
implicitWidth: 2
radius: 1
visible: edit.cursorVisible
SequentialAnimation on visible {
loops: Animation.Infinite
running: edit.cursorVisible
PropertyAnimation { to: false; duration: 600; }
PropertyAnimation { to: true; duration: 600; }
}
Keys.onPressed: {
if (event.matches(StandardKey.Paste)) {
event.accepted = true
const previousText = text;
const previousSelectedText = selectedText;
paste()
if (previousText === "" || previousSelectedText.length === previousText.length)
root.textPasted(text)
return;
}

Keys.onPressed: {
if (event.matches(StandardKey.Paste)) {
event.accepted = true
const previousText = text;
const previousSelectedText = selectedText;
paste()
if (previousText === "" || previousSelectedText.length === previousText.length)
root.textPasted(text)
return;
if (suggestionsDialog.visible) {
if (event.key === Qt.Key_Return || event.key === Qt.Key_Enter) {
root.entryAccepted(suggestionsListView.itemAtIndex(suggestionsListView.currentIndex))
} else if (event.key === Qt.Key_Up) {
suggestionsListView.decrementCurrentIndex()
} else if (event.key === Qt.Key_Down) {
suggestionsListView.incrementCurrentIndex()
}

if (suggestionsDialog.visible) {
if (event.key === Qt.Key_Return || event.key === Qt.Key_Enter) {
root.entryAccepted(suggestionsListView.itemAtIndex(suggestionsListView.currentIndex))
} else if (event.key === Qt.Key_Up) {
suggestionsListView.decrementCurrentIndex()
} else if (event.key === Qt.Key_Down) {
suggestionsListView.incrementCurrentIndex()
}
} else {
if (event.key === Qt.Key_Backspace && edit.text === "") {
root.entryRemoved(listView.itemAtIndex(listView.count - 1))
} else if (event.key === Qt.Key_Return || event.key === Qt.Enter) {
root.confirmed()
} else if (event.key === Qt.Key_Escape) {
root.rejected()
}
} else {
if (event.key === Qt.Key_Backspace && edit.text === "" && listView.count > 0) {
root.entryRemoved(listView.itemAtIndex(listView.count - 1))
} else if (event.key === Qt.Key_Return || event.key === Qt.Enter) {
root.enterKeyPressed()
} else if (event.key === Qt.Key_Escape) {
root.rejected()
} else if (event.key === Qt.Key_Up) {
root.upKeyPressed();
} else if (event.key === Qt.Key_Down) {
root.downKeyPressed();
}
}
}

// ensure edit cursor is visible
Item {
Layout.fillHeight: true
implicitWidth: 1
}
}

ScrollBar.horizontal: StatusScrollBar {
id: scrollBar
parent: scrollView.parent
anchors.top: scrollView.bottom
anchors.left: scrollView.left
anchors.right: scrollView.right
policy: ScrollBar.AsNeeded
visible: resolveVisibility(policy, scrollView.width, scrollView.contentWidth)
// ensure edit cursor is visible
Item {
Layout.fillHeight: true
implicitWidth: 1
}
}
}
Expand Down Expand Up @@ -181,7 +192,7 @@ Item {
StatusButton {
objectName: "inlineSelectorConfirmButton"
Layout.alignment: Qt.AlignVCenter
enabled: (listView.count > 0)
enabled: root.confirmBtnEnabled
text: qsTr("Confirm")
onClicked: root.confirmed()
}
Expand Down
31 changes: 24 additions & 7 deletions ui/app/AppLayouts/Chat/views/CreateChatView.qml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -70,6 +70,7 @@ Page {

cleanup()
chatInput.textInput.clear()
Global.closeCreateChatView();
}

onRejected: {
Expand All @@ -81,6 +82,18 @@ Page {
if (visible)
edit.forceActiveFocus()
}

onEnterKeyPressed: {
entryAccepted(contactsList.itemAtIndex(contactsList.currentIndex));
}

onUpKeyPressed: {
contactsList.decrementCurrentIndex();
}

onDownKeyPressed: {
contactsList.incrementCurrentIndex();
}
}

StatusActivityCenterButton {
Expand Down Expand Up @@ -115,13 +128,13 @@ Page {

Layout.fillWidth: true
Layout.fillHeight: true

visible: membersSelector.suggestionsModel.count &&
!(membersSelector.edit.text !== "")
implicitWidth: contentItem.childrenRect.width
model: membersSelector.suggestionsModel
delegate: ContactListItemDelegate {
width: ListView.view.width
highlighted: ListView.isCurrentItem
onClicked: membersSelector.entryAccepted(this)
}
}
Expand All @@ -138,22 +151,26 @@ Page {
closeGifPopupAfterSelection: true
onSendTransactionCommandButtonClicked: {
root.rootStore.createChatStartSendTransactionProcess = true;
root.createChat();
membersSelector.createChat();
}
onReceiveTransactionCommandButtonClicked: {
root.rootStore.createChatStartReceiveTransactionProcess = true;
root.createChat();
membersSelector.createChat();
}
onStickerSelected: {
root.rootStore.createChatStickerHashId = hashId;
root.rootStore.createChatStickerPackId = packId;
root.rootStore.createChatStickerUrl = url;
root.createChat();
membersSelector.createChat();
}
onSendMessage: {
root.rootStore.createChatFileUrls = chatInput.fileUrls;
root.rootStore.createChatInitMessage = chatInput.textInput.text;
root.createChat();
root.rootStore.createChatInitMessage = chatInput.textInput.text
root.rootStore.createChatFileUrls = chatInput.fileUrls
membersSelector.createChat()

membersSelector.cleanup()
chatInput.textInput.clear()
Global.closeCreateChatView();
}
}
}
Expand Down
3 changes: 2 additions & 1 deletion ui/app/AppLayouts/Chat/views/MembersEditSelectorView.qml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,7 @@ MembersSelectorBase {
property var sectionModule
property var chatContentModule

confirmBtnEnabled: true
onConfirmed: {
d.updateGroupMembers()
d.resetTemporaryModel()
Expand All @@ -31,7 +32,7 @@ MembersSelectorBase {
onRejected: {
d.resetTemporaryModel()
}

limitReached: (model.count === membersLimit)
onEntryAccepted: {
if (!root.limitReached) {
d.appendTemporaryModel(suggestionsDelegate._pubKey, suggestionsDelegate.userName)
Expand Down
16 changes: 8 additions & 8 deletions ui/app/AppLayouts/Chat/views/MembersSelectorView.qml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,17 +14,15 @@ import SortFilterProxyModel 0.2
MembersSelectorBase {
id: root

limitReached: model.count >= membersLimit - 1 // -1 because creator is not on the list of members when creating chat

function cleanup() {
root.edit.clear()
d.selectedMembers.clear()
root.edit.clear();
d.selectedMembers.clear();
}

onEntryAccepted: {
if (root.limitReached)
return
if (d.addMember(suggestionsDelegate._pubKey, suggestionsDelegate.userName))
if (d.addMember(suggestionsDelegate._pubKey, suggestionsDelegate.userName, suggestionsDelegate.isAdmin))
root.edit.clear()
}

Expand All @@ -44,7 +42,8 @@ MembersSelectorBase {
readonly property string _pubKey: model.pubKey
height: ListView.view.height
text: model.displayName

isReadonly: model.isAdmin
icon: model.isAdmin ? "crown" : ""
onClicked: root.entryRemoved(this)
}

Expand All @@ -59,15 +58,16 @@ MembersSelectorBase {
root.rootStore.contactsStore.resolveENS(value)
}

function addMember(pubKey, displayName) {
function addMember(pubKey, displayName, isAdmin) {
for (let i = 0; i < d.selectedMembers.count; ++i) {
if (d.selectedMembers.get(i).pubKey === pubKey)
return false
}

d.selectedMembers.append({
"pubKey": pubKey,
"displayName": displayName
"displayName": displayName,
"isAdmin": isAdmin
})
return true
}
Expand Down
2 changes: 1 addition & 1 deletion ui/app/AppLayouts/Chat/views/private/MembersSelectorBase.qml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ InlineSelectorPanel {
property var rootStore

readonly property int membersLimit: 20 // see: https://github.com/status-im/status-mobile/issues/13066
property bool limitReached: model.count >= membersLimit
property bool limitReached: (model.count === (membersLimit-1))

label.text: qsTr("To:")
warningLabel.text: qsTr("%1 USER LIMIT REACHED").arg(membersLimit)
Expand Down

0 comments on commit 019a65a

Please sign in to comment.