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: Gradient mask of replied message doesn't work 

- improve the respective storybook page
- some minor cleanups/fixes

Fixes #11385
This commit is contained in:
Lukáš Tinkl 2023-09-19 10:25:48 +02:00 committed by Lukáš Tinkl
parent 87c16b26bf
commit c97e9c4ffc
5 changed files with 49 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
storybook/pages/FeeRowPage.qml
View File

@ -71,7 +71,7 @@ SplitView {
} }
RadioButton { RadioButton {
readonly property string title: ModelsData.descriptions.medium readonly property string title: ModelsData.descriptions.mediumLoremIpsum
text: "Very Long" text: "Very Long"
} }

62
storybook/pages/StatusMessagePage.qml
View File

@ -17,27 +17,41 @@ SplitView {
QtObject { QtObject {
id: d id: d
property var messagesModel: ListModel { readonly property var messagesModel: ListModel {
ListElement { ListElement {
timestamp: 1656937930 timestamp: 1656937930123
senderId: "zq123456789"
senderDisplayName: "simon" senderDisplayName: "simon"
profileImage: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAlklEQVR4nOzW0QmDQBAG4SSkl7SUQlJGCrElq9F3QdjjVhh/5nv3cFhY9vUIYQiNITSG0BhCExPynn1gWf9bx498P7/ profileImage: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAlklEQVR4nOzW0QmDQBAG4SSkl7SUQlJGCrElq9F3QdjjVhh/5nv3cFhY9vUIYQiNITSG0BhCExPynn1gWf9bx498P7/
nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2ImYgiNITTlTdG1nUZ5a92VITQxITFiJmIIjSE0htAYQrMHAAD//+wwFVpz+yqXAAAAAElFTkSuQmCC" nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2ImYgiNITTlTdG1nUZ5a92VITQxITFiJmIIjSE0htAYQrMHAAD//+wwFVpz+yqXAAAAAElFTkSuQmCC"
contentType: StatusMessage.ContentType.Text contentType: StatusMessage.ContentType.Text
message: "Hello, this is awesome! Feels like decentralized Discord!" message: "Hello, this is awesome! Feels like decentralized Discord! And it even supports HTML markup, like <b>bold</b>, <i>italics</i> or <u>underline</u>"
isContact: true isContact: true
isAReply: false
trustIndicator: StatusContactVerificationIcons.TrustedType.Verified trustIndicator: StatusContactVerificationIcons.TrustedType.Verified
} }
ListElement { ListElement {
timestamp: 1657937930 timestamp: 1657937930135
senderId: "zqABCDEFG"
senderDisplayName: "Mark Cuban" senderDisplayName: "Mark Cuban"
contentType: StatusMessage.ContentType.Text contentType: StatusMessage.ContentType.Text
message: "I know a lot of you really seem to get off or be validated by arguing with strangers online but please know it's a complete waste of your time and energy" message: "I know a lot of you really seem to get off or be validated by arguing with strangers online but please know it's a complete waste of your time and energy"
isContact: false isContact: false
isAReply: false
trustIndicator: StatusContactVerificationIcons.TrustedType.Untrustworthy trustIndicator: StatusContactVerificationIcons.TrustedType.Untrustworthy
} }
ListElement {
timestamp: 1667937930159
senderId: "zqdeadbeef"
senderDisplayName: "replicator.stateofus.eth"
contentType: StatusMessage.ContentType.Text
message: "Test reply; the original text above should have a horizontal gradient mask"
isContact: true
isAReply: true
trustIndicator: StatusContactVerificationIcons.TrustedType.None
} }
property var colorHash: ListModel { }
readonly property var colorHash: ListModel {
ListElement { colorId: 13; segmentLength: 5 } ListElement { colorId: 13; segmentLength: 5 }
ListElement { colorId: 31; segmentLength: 5 } ListElement { colorId: 31; segmentLength: 5 }
ListElement { colorId: 10; segmentLength: 1 } ListElement { colorId: 10; segmentLength: 1 }
@ -59,29 +73,46 @@ SplitView {
color: Theme.palette.statusAppLayout.rightPanelBackgroundColor color: Theme.palette.statusAppLayout.rightPanelBackgroundColor
ListView { ListView {
anchors.margins: 50 anchors.margins: 16
anchors.fill: parent anchors.fill: parent
spacing: 16 spacing: 16
model: d.messagesModel model: d.messagesModel
delegate: StatusMessage { delegate: StatusMessage {
width: ListView.view.width width: ListView.view.width
timestamp: model.timestamp timestamp: model.timestamp
messageDetails: StatusMessageDetails { messageDetails {
readonly property bool isEnsVerified: model.senderDisplayName.endsWith(".eth")
messageText: model.message messageText: model.message
contentType: model.contentType contentType: model.contentType
sender.id: isEnsVerified ? "" : model.senderId
sender.displayName: model.senderDisplayName sender.displayName: model.senderDisplayName
sender.isContact: model.isContact sender.isContact: model.isContact
sender.trustIndicator: model.trustIndicator sender.trustIndicator: model.trustIndicator
sender.profileImage: StatusProfileImageSettings { sender.isEnsVerified: isEnsVerified
width: 40 sender.profileImage {
height: 40
name: model.profileImage || "" name: model.profileImage || ""
colorId: 1 colorId: index
colorHash: d.colorHash colorHash: d.colorHash
} }
} }
onSenderNameClicked: logs.logEvent("StatusMessage::onSenderNameClicked(): ")
onProfilePictureClicked: logs.logEvent("StatusMessage::profilePictureClicked(): ") isAReply: model.isAReply
replyDetails {
amISender: true
sender.id: "0xdeadbeef"
sender.profileImage {
width: 20
height: 20
name: ModelsData.icons.dribble
colorHash: d.colorHash
}
messageText: ModelsData.descriptions.mediumLoremIpsum
}
onSenderNameClicked: logs.logEvent("StatusMessage::senderNameClicked")
onProfilePictureClicked: logs.logEvent("StatusMessage::profilePictureClicked")
onReplyProfileClicked: logs.logEvent("StatusMessage::replyProfileClicked")
onReplyMessageClicked: logs.logEvent("StatusMessage::replyMessageClicked")
} }
} }
} }
@ -95,11 +126,6 @@ SplitView {
logsView.logText: logs.logText logsView.logText: logs.logText
} }
} }
Pane {
SplitView.minimumWidth: 300
SplitView.preferredWidth: 300
}
} }
// category: Components // category: Components

4
ui/StatusQ/src/StatusQ/Components/private/statusMessage/StatusMessageReply.qml
View File

@ -106,8 +106,8 @@ Item {
} }
Item { Item {
implicitWidth: messageContentsLayout.implicitWidth Layout.fillWidth: true
implicitHeight: messageContentsLayout.implicitHeight Layout.preferredHeight: messageContentsLayout.implicitHeight
ColumnLayout { ColumnLayout {
id: messageContentsLayout id: messageContentsLayout

2
ui/StatusQ/src/StatusQ/Components/private/statusMessage/StatusTextMessage.qml
View File

@ -91,7 +91,7 @@ Item {
color: d.isQuote ? Theme.palette.baseColor1 : Theme.palette.directColor1 color: d.isQuote ? Theme.palette.baseColor1 : Theme.palette.directColor1
font.family: Theme.palette.baseFont.name font.family: Theme.palette.baseFont.name
font.pixelSize: Theme.primaryTextFontSize font.pixelSize: Theme.primaryTextFontSize
textFormat: Text.RichText textFormat: root.stripHtmlTags ? Text.PlainText : Text.RichText
wrapMode: root.convertToSingleLine ? Text.NoWrap : Text.Wrap wrapMode: root.convertToSingleLine ? Text.NoWrap : Text.Wrap
readOnly: true readOnly: true
selectByMouse: true selectByMouse: true

2
ui/StatusQ/src/StatusQ/Core/StatusIdenticonRingSettings.qml
View File

@ -32,7 +32,7 @@ QtObject {
id: statusIdenticonRingSettings id: statusIdenticonRingSettings
/*! /*!
\qmlproperty ListModel StatusIdenticonRingSettings::ringSpecModel \qmlproperty var StatusIdenticonRingSettings::ringSpecModel
This is a REQUIRED property that contains a ListModel or array of objects that describes each ring segment color and length. This is a REQUIRED property that contains a ListModel or array of objects that describes each ring segment color and length.
Examples: Examples: