status-im
/
status-desktop
mirror of https://github.com/status-im/status-desktop.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

fix(Community/InvitationBubble): Community invitation doesn't look good 

Bubble redesign by using `ColumnLayout`.

Fixes #5987
This commit is contained in:
Noelia 2022-06-08 16:43:46 +02:00 committed by Noelia
parent 524c91dbab
commit 16dec86cef
1 changed files with 145 additions and 162 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

101
ui/imports/shared/views/chat/InvitationBubbleView.qml
View File

@ -1,5 +1,6 @@
import QtQuick 2.3
import QtQuick.Dialogs 1.3
import QtQuick.Layouts 1.14
import utils 1.0
@ -101,14 +102,7 @@ Item {
property alias button: joinBtn
property bool isPendingRequest: root.store.isCommunityRequestPending(communityId)
width: 270
height: title.height + title.anchors.topMargin +
invitedYou.height + invitedYou.anchors.topMargin +
sep1.height + sep1.anchors.topMargin +
communityName.height + communityName.anchors.topMargin +
communityDesc.height + communityDesc.anchors.topMargin +
communityNbMembers.height + communityNbMembers.anchors.topMargin +
sep2.height + sep2.anchors.topMargin +
btnItemId.height + btnItemId.anchors.topMargin
height: column.implicitHeight
radius: 16
color: Style.current.background
border.color: Style.current.border
@ -193,6 +187,11 @@ Item {
// }
// }
ColumnLayout {
id: column
width: parent.width
spacing: Style.current.halfPadding
// TODO add check if verified
StatusBaseText {
id: title
@ -203,59 +202,51 @@ Item {
//% "Community invitation"
qsTrId("community-invitation")
font.weight: Font.Medium
anchors.top: parent.top
anchors.topMargin: Style.current.halfPadding
anchors.left: parent.left
anchors.leftMargin: root.innerMargin
Layout.topMargin: Style.current.halfPadding
Layout.leftMargin: root.innerMargin
font.pixelSize: 13
}
StatusBaseText {
id: invitedYou
visible: text != ""
text: {
// Not Refactored Yet
return ""
// if (root.store.chatsModelInst.channelView.activeChannel.chatType === Constants.chatType.oneToOne) {
// return isCurrentUser ?
// //% "You invited %1 to join a community"
// qsTrId("you-invited--1-to-join-a-community").arg(root.store.chatsModelInst.userNameOrAlias(root.store.chatsModelInst.channelView.activeChannel.id))
// //% "%1 invited you to join a community"
// : qsTrId("-1-invited-you-to-join-a-community").arg(displayUserName)
// } else {
// return isCurrentUser ?
// //% "You shared a community"
// qsTrId("you-shared-a-community")
// //% "A community has been shared"
// : qsTrId("a-community-has-been-shared")
// }
// if (root.store.chatsModelInst.channelView.activeChannel.chatType === Constants.chatType.oneToOne) {
// return isCurrentUser ?
// //% "You invited %1 to join a community"
// qsTrId("you-invited--1-to-join-a-community").arg(root.store.chatsModelInst.userNameOrAlias(root.store.chatsModelInst.channelView.activeChannel.id))
// //% "%1 invited you to join a community"
// : qsTrId("-1-invited-you-to-join-a-community").arg(displayUserName)
// } else {
// return isCurrentUser ?
// //% "You shared a community"
// qsTrId("you-shared-a-community")
// //% "A community has been shared"
// : qsTrId("a-community-has-been-shared")
// }
}
anchors.top: title.bottom
anchors.topMargin: 4
anchors.left: parent.left
anchors.leftMargin: root.innerMargin
anchors.right: parent.right
anchors.rightMargin: root.innerMargin
Layout.leftMargin: root.innerMargin
Layout.rightMargin: root.innerMargin
Layout.fillWidth: true
wrapMode: Text.WordWrap
font.pixelSize: 15
color: Theme.palette.directColor1
}
Separator {
id: sep1
anchors.top: invitedYou.bottom
anchors.topMargin: Style.current.halfPadding
Layout.fillWidth: true
}
// TODO add image when it's supported
StatusBaseText {
id: communityName
text: invitedCommunity.name
anchors.top: sep1.bottom
anchors.topMargin: root.innerMargin
anchors.left: parent.left
anchors.leftMargin: root.innerMargin
anchors.right: parent.right
anchors.rightMargin: root.innerMargin
Layout.topMargin: 2
Layout.leftMargin: root.innerMargin
Layout.fillWidth: true
Layout.rightMargin: root.innerMargin
font.weight: Font.Bold
wrapMode: Text.WrapAtWordBoundaryOrAnywhere
font.pixelSize: 17
@ -265,12 +256,9 @@ Item {
StatusBaseText {
id: communityDesc
text: invitedCommunity.description
anchors.top: communityName.bottom
anchors.topMargin: 2
anchors.left: parent.left
anchors.leftMargin: root.innerMargin
anchors.right: parent.right
anchors.rightMargin: root.innerMargin
Layout.leftMargin: root.innerMargin
Layout.rightMargin: root.innerMargin
Layout.fillWidth: true
wrapMode: Text.WrapAtWordBoundaryOrAnywhere
font.pixelSize: 15
color: Theme.palette.directColor1
@ -281,33 +269,27 @@ Item {
// TODO add the plural support
//% "%1 members"
text: qsTrId("-1-members").arg(invitedCommunity.nbMembers)
anchors.top: communityDesc.bottom
anchors.topMargin: 2
anchors.left: parent.left
anchors.leftMargin: root.innerMargin
Layout.leftMargin: root.innerMargin
font.pixelSize: 13
font.weight: Font.Medium
color: Theme.palette.baseColor1
}
Separator {
id: sep2
anchors.top: communityNbMembers.bottom
anchors.topMargin: Style.current.halfPadding
Layout.fillWidth: true
}
Item {
id: btnItemId
width: parent.width
Layout.topMargin: -column.spacing
Layout.fillWidth: true
height: 44
anchors.bottom: parent.bottom
clip: true
StatusFlatButton {
id: joinBtn
anchors.top: parent.top
anchors.topMargin: -Style.current.smallPadding
anchors.fill: parent
anchors.verticalCenter: parent.verticalCenter
radius: 16
width: parent.width
height: 54
enabled: true
text: qsTr("Unsupported state")
onClicked: {
@ -361,4 +343,5 @@ Item {
}
}
}
}
}