fix(@desktop/community): add online status to invite modal

Replace Contact component with StatusMemberListItem.
Add missing Nim functions to fill models with onlineStatus.
Adjust components paddings to match design.

Fixes #6985
This commit is contained in:
PavelS 2022-08-23 17:57:37 +03:00 committed by PavelS
parent 6bd1cfde72
commit 3bd6fe0fdf
10 changed files with 95 additions and 23 deletions

View File

@ -319,6 +319,9 @@ proc getContactById*(self: Controller, id: string): ContactsDto =
proc getContactDetails*(self: Controller, id: string): ContactDetails =
return self.contactService.getContactDetails(id)
proc getStatusForContactWithId*(self: Controller, publicKey: string): StatusUpdateDto =
return self.contactService.getStatusForContactWithId(publicKey)
proc acceptContactRequest*(self: Controller, publicKey: string) =
self.contactService.acceptContactRequest(publicKey)

View File

@ -213,6 +213,7 @@ proc createItemFromPublicKey(self: Module, publicKey: string): UserItem =
pubKey = contactDetails.details.id,
displayName = contactDetails.displayName,
icon = contactDetails.icon,
onlineStatus = toOnlineStatus(self.controller.getStatusForContactWithId(publicKey).statusType),
isContact = contactDetails.details.isContact(),
isVerified = contactDetails.details.isContactVerified(),
isUntrustworthy = contactDetails.details.isContactUntrustworthy(),

View File

@ -151,5 +151,8 @@ proc declineVerificationRequest*(self: Controller, publicKey: string) =
proc getReceivedVerificationRequests*(self: Controller): seq[VerificationRequest] =
self.contactsService.getReceivedVerificationRequests()
proc getStatusForContactWithId*(self: Controller, publicKey: string): StatusUpdateDto =
return self.contactsService.getStatusForContactWithId(publicKey)
proc hasReceivedVerificationRequestFrom*(self: Controller, fromId: string): bool =
self.contactsService.hasReceivedVerificationRequestFrom(fromId)

View File

@ -47,6 +47,7 @@ proc createItemFromPublicKey(self: Module, publicKey: string): UserItem =
pubKey = contact.id,
displayName = name,
icon = image,
onlineStatus = toOnlineStatus(self.controller.getStatusForContactWithId(publicKey).statusType),
isContact = contact.isContact(),
isBlocked = contact.isBlocked(),
isVerified = contact.isContactVerified(),

View File

@ -85,7 +85,7 @@ proc initUserItem*(
icon: string,
colorId: int = 0,
colorHash: string = "",
onlineStatus: OnlineStatus = OnlineStatus.Inactive,
onlineStatus: OnlineStatus,
isContact: bool,
isVerified: bool,
isUntrustworthy: bool,

View File

@ -23,13 +23,15 @@ ColumnLayout {
property var pubKeys: ([])
spacing: Style.current.padding
spacing: Style.current.bigPadding
StyledText {
id: headline
text: qsTr("Contacts")
font.pixelSize: Style.current.primaryTextFontSize
color: Style.current.secondaryText
Layout.leftMargin: Style.current.padding
Layout.rightMargin: Style.current.padding
}
StatusInput {
@ -38,6 +40,11 @@ ColumnLayout {
input.icon.name: "search"
input.clearable: true
Layout.fillWidth: true
Layout.leftMargin: Style.current.padding
Layout.rightMargin: Style.current.padding
maximumHeight: 36
topPadding: 0
bottomPadding: 0
}
ExistingContacts {
@ -62,13 +69,13 @@ ColumnLayout {
}
root.pubKeys = pubKeysCopy
}
Layout.rightMargin: -Style.current.padding
Layout.fillWidth: true
Layout.fillHeight: true
Layout.leftMargin: Style.current.halfPadding
Layout.rightMargin: Style.current.halfPadding
}
StatusModalDivider {
bottomPadding: Style.current.padding
Layout.fillWidth: true
}

View File

@ -8,6 +8,7 @@ import StatusQ.Popups 0.1
import utils 1.0
import shared 1.0
import shared.panels 1.0
import shared.views 1.0
import shared.status 1.0
@ -40,6 +41,19 @@ ColumnLayout {
input.verticalAlignment: TextEdit.AlignTop
Layout.minimumHeight: 150 // TODO: implicitHeight is not calculated well from input.implicitHeight
Layout.fillWidth: true
Layout.leftMargin: Style.current.padding
Layout.rightMargin: Style.current.padding
}
StatusModalDivider {
Layout.fillWidth: true
}
StyledText {
text: qsTr("Invites will be sent to:")
font.pixelSize: Style.current.primaryTextFontSize
Layout.leftMargin: Style.current.padding
Layout.rightMargin: Style.current.padding
}
PickedContacts {
@ -49,5 +63,7 @@ ColumnLayout {
pubKeys: root.pubKeys
Layout.fillWidth: true
Layout.fillHeight: true
Layout.leftMargin: Style.current.halfPadding
Layout.rightMargin: Style.current.halfPadding
}
}

View File

@ -45,6 +45,8 @@ StatusStackModal {
stackTitle: qsTr("Invite Contacts to %1").arg(community.name)
width: 640
height: 700
leftPadding: 0
rightPadding: 0
nextButton: StatusButton {
text: qsTr("Next")
@ -68,8 +70,8 @@ StatusStackModal {
visible: root.validationError !== "" || root.successMessage !== ""
font.pixelSize: 13
color: !!root.validationError ? Style.current.danger : Style.current.success
Layout.alignment: Qt.AlignHCenter
Layout.preferredHeight: visible ? contentHeight : 0
horizontalAlignment: Text.AlignHCenter
height: visible ? contentHeight : 0
}
stackItems: [

View File

@ -3,6 +3,9 @@ import QtQuick.Controls 2.14
import QtQuick.Layouts 1.14
import StatusQ.Core 0.1
import StatusQ.Controls 0.1
import StatusQ.Components 0.1
import StatusQ.Core.Theme 0.1
import utils 1.0
import shared.status 1.0
@ -38,20 +41,32 @@ Item {
id: contactListView
anchors.fill: parent
rightMargin: 0
spacing: 0
leftMargin: 0
spacing: Style.current.padding
model: root.contactsStore.myContactsModel
delegate: Contact {
delegate: StatusMemberListItem {
width: contactListView.availableWidth
showCheckbox: root.showCheckbox
isChecked: root.pubKeys.indexOf(model.pubKey) > -1
pubKey: model.pubKey
pubKey: Utils.getCompressedPk(model.pubKey)
isContact: model.isContact
isUser: false
name: model.displayName
image: model.icon
isVisible: {
if (isChecked)
status: model.onlineStatus
height: visible ? implicitHeight : 0
color: sensor.containsMouse ? Style.current.backgroundHover : Style.current.transparent
userName: model.displayName
image.source: model.icon
image.isIdenticon: false
image.width: 40
image.height: 40
icon.color: Utils.colorForPubkey(model.pubKey)
icon.height: 40
icon.width: 40
ringSettings.ringSpecModel: Utils.getColorHashAsJson(model.pubKey)
statusListItemIcon.badge.border.color: Theme.palette.baseColor4
statusListItemIcon.badge.implicitHeight: 14 // 10 px + 2 px * 2 borders
statusListItemIcon.badge.implicitWidth: 14 // 10 px + 2 px * 2 borders
visible: {
if (contactCheckbox.checked)
return true;
return model.isContact && !model.isBlocked && (root.filterText === "" ||
@ -63,9 +78,20 @@ Item {
(!root.hideCommunityMembers ||
!root.community.hasMember(model.pubKey));
}
onContactClicked: function () {
onClicked: {
root.contactClicked(model);
}
StatusCheckBox {
id: contactCheckbox
anchors.verticalCenter: parent.verticalCenter
anchors.right: parent.right
checked: root.pubKeys.indexOf(model.pubKey) > -1
onClicked: {
root.contactClicked(model);
}
}
}
}
}

View File

@ -3,6 +3,8 @@ import QtQuick.Controls 2.14
import QtQuick.Layouts 1.14
import StatusQ.Core 0.1
import StatusQ.Components 0.1
import StatusQ.Core.Theme 0.1
import utils 1.0
import shared.status 1.0
@ -36,6 +38,7 @@ Item {
anchors.fill: parent
rightMargin: 0
cellWidth: parent.width / 2
cellHeight: 2 * Style.current.xlPadding + Style.current.halfPadding
model: SortFilterProxyModel {
sourceModel: root.contactsStore.myContactsModel
@ -43,14 +46,24 @@ Item {
ExpressionFilter { expression: root.pubKeys.indexOf(model.pubKey) > -1 }
]
}
delegate: Contact {
delegate: StatusMemberListItem {
width: contactGridView.cellWidth
showCheckbox: false
pubKey: model.pubKey
pubKey: Utils.getCompressedPk(model.pubKey)
isContact: model.isContact
isUser: false
name: model.displayName
image: model.icon
status: model.onlineStatus
userName: model.displayName
image.source: model.icon
image.width: 40
image.height: 40
color: "transparent"
icon.color: Utils.colorForPubkey(model.pubKey)
icon.height: 40
icon.width: 40
ringSettings.ringSpecModel: Utils.getColorHashAsJson(model.pubKey)
statusListItemIcon.badge.border.color: Theme.palette.baseColor4
statusListItemIcon.badge.implicitHeight: 14 // 10 px + 2 px * 2 borders
statusListItemIcon.badge.implicitWidth: 14 // 10 px + 2 px * 2 borders
}
}
}