From 87b9b3e369114e034ba4c4b5d65b7f0785967492 Mon Sep 17 00:00:00 2001 From: Emil Sawicki Date: Mon, 11 Nov 2024 08:56:54 +0100 Subject: [PATCH] feat: Move request payment delegate --- storybook/pages/LinksMessageViewPage.qml | 7 ++ storybook/pages/StatusMessagePage.qml | 21 +----- .../qmlTests/tests/tst_StatusMessage.qml | 65 ----------------- .../src/StatusQ/Components/StatusMessage.qml | 70 +------------------ .../Components/StatusMessageDetails.qml | 1 - ui/imports/shared/controls/chat/qmldir | 1 - .../RequestPaymentCardDelegate.qml | 2 + ui/imports/shared/controls/delegates/qmldir | 1 + .../shared/views/chat/LinksMessageView.qml | 21 ++++++ ui/imports/shared/views/chat/MessageView.qml | 4 +- ui/imports/utils/Constants.qml | 1 - 11 files changed, 38 insertions(+), 156 deletions(-) rename ui/imports/shared/controls/{chat => delegates}/RequestPaymentCardDelegate.qml (99%) diff --git a/storybook/pages/LinksMessageViewPage.qml b/storybook/pages/LinksMessageViewPage.qml index cf5c540548..a7694c1beb 100644 --- a/storybook/pages/LinksMessageViewPage.qml +++ b/storybook/pages/LinksMessageViewPage.qml @@ -13,6 +13,10 @@ SplitView { id: mockedLinkPreviewModel } + RequestPaymentModel { + id: mockedRequestPaymentModel + } + Pane { id: messageViewWrapper SplitView.fillWidth: true @@ -27,6 +31,9 @@ SplitView { playAnimations: true linkPreviewModel: mockedLinkPreviewModel gifLinks: [ "https://media.tenor.com/qN_ytiwLh24AAAAC/cold.gif" ] + requestPaymentModel: mockedRequestPaymentModel + + senderName: "Alice" gifUnfurlingEnabled: false canAskToUnfurlGifs: true diff --git a/storybook/pages/StatusMessagePage.qml b/storybook/pages/StatusMessagePage.qml index cb84cb9ac5..41668e7971 100644 --- a/storybook/pages/StatusMessagePage.qml +++ b/storybook/pages/StatusMessagePage.qml @@ -18,7 +18,6 @@ SplitView { id: d readonly property var exampleAlbum: [ModelsData.banners.coinbase, ModelsData.icons.status] - readonly property var requestPaymentModel: RequestPaymentModel {} readonly property var messagesModel: ListModel { ListElement { @@ -33,6 +32,7 @@ SplitView { isAReply: false trustIndicator: StatusContactVerificationIcons.TrustedType.Verified outgoingStatus: StatusMessage.OutgoingStatus.Delivered + requeestPaymentModel: [] } ListElement { timestamp: 1657937930135 @@ -166,17 +166,6 @@ SplitView { trustIndicator: StatusContactVerificationIcons.TrustedType.None outgoingStatus: StatusMessage.OutgoingStatus.Delivered } - ListElement { - timestamp: 1667937830123 - senderId: "zq123456790" - senderDisplayName: "Alice" - contentType: StatusMessage.ContentType.Attachment - message: "This message contains attachments" - isContact: true - isAReply: false - trustIndicator: StatusContactVerificationIcons.TrustedType.None - outgoingStatus: StatusMessage.OutgoingStatus.Delivered - } } readonly property var colorHash: ListModel { ListElement { colorId: 13; segmentLength: 5 } @@ -227,11 +216,8 @@ SplitView { colorId: index colorHash: d.colorHash } - album: model.contentType === StatusMessage.ContentType.Image - || model.contentType === StatusMessage.ContentType.Attachment ? d.exampleAlbum : [] - albumCount: model.contentType === StatusMessage.ContentType.Image - || model.contentType === StatusMessage.ContentType.Attachment ? d.exampleAlbum.length : 0 - requestPaymentModel: model.contentType === StatusMessage.ContentType.Attachment ? d.requestPaymentModel : null + album: model.contentType === StatusMessage.ContentType.Image ? d.exampleAlbum : [] + albumCount: model.contentType === StatusMessage.ContentType.Image ? d.exampleAlbum.length : 0 } replyDetails { @@ -252,7 +238,6 @@ SplitView { onReplyMessageClicked: logs.logEvent("StatusMessage::replyMessageClicked") onResendClicked: logs.logEvent("StatusMessage::resendClicked") onLinkActivated: logs.logEvent("StatusMessage::linkActivated" + link) - onRequestPaymentClicked: logs.logEvent("StatusMessage::requestPaymentActivated") onImageClicked: logs.logEvent("StatusMessage::imageClicked") } } diff --git a/storybook/qmlTests/tests/tst_StatusMessage.qml b/storybook/qmlTests/tests/tst_StatusMessage.qml index 1f7063320a..09c388b447 100644 --- a/storybook/qmlTests/tests/tst_StatusMessage.qml +++ b/storybook/qmlTests/tests/tst_StatusMessage.qml @@ -86,70 +86,5 @@ Item { compare(actualLinkCount, data.validAddressEnsCount, "TextEdit should contain a link %1".arg(data.messageText)) } - - function test_attachment_empty() { - verify(!!controlUnderTest) - controlUnderTest.messageDetails.contentType = StatusMessage.ContentType.Attachment - controlUnderTest.messageDetails.messageText = "" - waitForRendering(controlUnderTest) - - const statusTextMessage = findChild(controlUnderTest, "StatusMessage_textMessage") - verify(!statusTextMessage) - const imageAlbum = findChild(controlUnderTest, "StatusMessage_imageAlbum") - verify(!!imageAlbum) - compare(imageAlbum.albumCount, 0) - const image = findChild(imageAlbum, "album_image_loader_0") - verify(!image) - const requestPaymentItem = findChild(controlUnderTest, "StatusMessage_requestPaymentDelegate_0") - verify(!requestPaymentItem) - } - - function test_attachment_only_text() { - verify(!!controlUnderTest) - controlUnderTest.messageDetails.contentType = StatusMessage.ContentType.Attachment - controlUnderTest.messageDetails.messageText = "test message" - waitForRendering(controlUnderTest) - - const statusTextMessage = findChild(controlUnderTest, "StatusMessage_textMessage") - verify(!!statusTextMessage) - verify(statusTextMessage.textField.text.indexOf("test message") > 0) - const imageAlbum = findChild(controlUnderTest, "StatusMessage_imageAlbum") - verify(!!imageAlbum) - compare(imageAlbum.albumCount, 0) - const image = findChild(imageAlbum, "album_image_loader_0") - verify(!image) - const requestPaymentItem = findChild(controlUnderTest, "StatusMessage_requestPaymentDelegate_0") - verify(!requestPaymentItem) - } - - function test_attachment_multiple_attachments() { - verify(!!controlUnderTest) - controlUnderTest.messageDetails.contentType = StatusMessage.ContentType.Attachment - controlUnderTest.messageDetails.messageText = "test message with attachments" - controlUnderTest.messageDetails.album = [ "image0", "image1", "image2" ] - controlUnderTest.messageDetails.albumCount = 3 - controlUnderTest.messageDetails.requestPaymentModel = [ - {amount: "0.1", currency: "ETH", address: "0x1234567890abcdef1234567890abcdef12345678", chainId: 1}, - {amount: "0.2", currency: "DAI", address: "0xAbCdEf1234567890abcdef1234567890AbCdEf12", chainId: 10}, - ] - waitForRendering(controlUnderTest) - - const statusTextMessage = findChild(controlUnderTest, "StatusMessage_textMessage") - verify(!!statusTextMessage) - verify(statusTextMessage.textField.text.indexOf("test message with attachments") > 0) - const imageAlbum = findChild(controlUnderTest, "StatusMessage_imageAlbum") - verify(!!imageAlbum) - compare(imageAlbum.albumCount, 3) - for (let i = 0 ; i < 3 ; i++) { - const image = findChild(imageAlbum, "album_image_loader_"+i) - verify(!!image) - } - const requestPaymentItem0 = findChild(controlUnderTest, "StatusMessage_requestPaymentDelegate_0") - verify(!!requestPaymentItem0) - const requestPaymentItem1 = findChild(controlUnderTest, "StatusMessage_requestPaymentDelegate_1") - verify(!!requestPaymentItem1) - const requestPaymentItem2 = findChild(controlUnderTest, "StatusMessage_requestPaymentDelegate_2") - verify(!requestPaymentItem2) - } } } diff --git a/ui/StatusQ/src/StatusQ/Components/StatusMessage.qml b/ui/StatusQ/src/StatusQ/Components/StatusMessage.qml index e8695c8c96..8441995a04 100644 --- a/ui/StatusQ/src/StatusQ/Components/StatusMessage.qml +++ b/ui/StatusQ/src/StatusQ/Components/StatusMessage.qml @@ -7,8 +7,6 @@ import StatusQ.Core.Theme 0.1 import StatusQ.Core.Utils 0.1 import StatusQ.Controls 0.1 -import shared.controls.chat 1.0 - import "./private/statusMessage" Control { @@ -28,8 +26,7 @@ Control { SystemMessageMutualEventSent = 15, SystemMessageMutualEventAccepted = 16, SystemMessageMutualEventRemoved = 17, - BridgeMessage = 18, - Attachment = 19 + BridgeMessage = 18 } enum OutgoingStatus { @@ -92,7 +89,6 @@ Control { signal addReactionClicked(var sender, var mouse) signal toggleReactionClicked(int emojiId) signal imageClicked(var image, var mouse, var imageSource) - signal requestPaymentClicked(var symbol, var amount, var address, var chainId) signal stickerClicked() signal resendClicked() @@ -303,7 +299,7 @@ Control { } } Loader { - active: root.messageDetails.contentType === StatusMessage.ContentType.Image && !editMode + active: root.messageDetails.contentType === StatusMessage.ContentType.Image && !editMode visible: active Layout.fillWidth: true @@ -343,68 +339,6 @@ Control { } } - Loader { - active: root.messageDetails.contentType === StatusMessage.ContentType.Attachment && !editMode - visible: active - Layout.fillWidth: true - - sourceComponent: Column { - id: attachmentsColumn - spacing: 8 - Loader { - active: root.messageDetails.messageText !== "" - anchors.left: parent.left - anchors.right: parent.right - visible: active - sourceComponent: StatusTextMessage { - objectName: "StatusMessage_textMessage" - messageDetails: root.messageDetails - isEdited: root.isEdited - allowShowMore: !root.isInPinnedPopup - textField.anchors.rightMargin: root.isInPinnedPopup ? Theme.xlPadding : 0 // margin for the "Unpin" floating button - highlightedLink: root.highlightedLink - onLinkActivated: { - root.linkActivated(link); - } - } - } - - Flow { - width: messageLayout.width - height: childrenRect.height + Theme.smallPadding - Loader { - active: true - sourceComponent: StatusMessageImageAlbum { - objectName: "StatusMessage_imageAlbum" - album: root.messageDetails.albumCount > 0 ? root.messageDetails.album : [root.messageDetails.messageContent] - albumCount: root.messageDetails.albumCount > 0 ? root.messageDetails.albumCount : 0 - imageWidth: Math.min(messageLayout.width / root.messageDetails.albumCount - 9 * (root.messageDetails.albumCount - 1), 144) - shapeType: StatusImageMessage.ShapeType.LEFT_ROUNDED - onImageClicked: root.imageClicked(image, mouse, imageSource) - } - } - Loader { - active: true - sourceComponent: RowLayout { - Repeater { - model: root.messageDetails.requestPaymentModel - delegate: RequestPaymentCardDelegate { - objectName: "StatusMessage_requestPaymentDelegate_" + model.index - required property var model - amount: model.amount - symbol: model.symbol - address: model.address - senderName: root.messageDetails.sender.displayName - senderImageAssetSettings: root.messageDetails.sender.profileImage.assetSettings - onClicked: root.requestPaymentClicked(model.symbol, model.amount, model.address, model.chainId) - } - } - } - } - } - } - } - Loader { active: root.messageAttachments && !editMode visible: active diff --git a/ui/StatusQ/src/StatusQ/Components/StatusMessageDetails.qml b/ui/StatusQ/src/StatusQ/Components/StatusMessageDetails.qml index a880864fd2..939b93acd3 100644 --- a/ui/StatusQ/src/StatusQ/Components/StatusMessageDetails.qml +++ b/ui/StatusQ/src/StatusQ/Components/StatusMessageDetails.qml @@ -15,5 +15,4 @@ QtObject { property bool messageDeleted: false property var album: [] property int albumCount: 0 - property var requestPaymentModel: null } diff --git a/ui/imports/shared/controls/chat/qmldir b/ui/imports/shared/controls/chat/qmldir index 04772acb80..60106adacf 100644 --- a/ui/imports/shared/controls/chat/qmldir +++ b/ui/imports/shared/controls/chat/qmldir @@ -10,7 +10,6 @@ LinkPreviewCard 1.0 LinkPreviewCard.qml LinkPreviewMiniCard 1.0 LinkPreviewMiniCard.qml LinkPreviewSettingsCard 1.0 LinkPreviewSettingsCard.qml LinkPreviewSettingsCardMenu 1.0 LinkPreviewSettingsCardMenu.qml -RequestPaymentCardDelegate 1.0 RequestPaymentCardDelegate.qml RequestPaymentMiniCardDelegate 1.0 RequestPaymentMiniCardDelegate.qml MessageMouseArea 1.0 MessageMouseArea.qml MessageReactionsRow 1.0 MessageReactionsRow.qml diff --git a/ui/imports/shared/controls/chat/RequestPaymentCardDelegate.qml b/ui/imports/shared/controls/delegates/RequestPaymentCardDelegate.qml similarity index 99% rename from ui/imports/shared/controls/chat/RequestPaymentCardDelegate.qml rename to ui/imports/shared/controls/delegates/RequestPaymentCardDelegate.qml index 665d154b8b..5fc0bdc960 100644 --- a/ui/imports/shared/controls/chat/RequestPaymentCardDelegate.qml +++ b/ui/imports/shared/controls/delegates/RequestPaymentCardDelegate.qml @@ -8,6 +8,8 @@ import QtGraphicalEffects 1.15 import StatusQ.Core.Theme 0.1 import StatusQ.Components 0.1 +import shared.controls.chat 1.0 + import utils 1.0 CalloutCard { diff --git a/ui/imports/shared/controls/delegates/qmldir b/ui/imports/shared/controls/delegates/qmldir index 45e2a69f02..e81ea58eaf 100644 --- a/ui/imports/shared/controls/delegates/qmldir +++ b/ui/imports/shared/controls/delegates/qmldir @@ -2,4 +2,5 @@ ContactListItemDelegate 1.0 ContactListItemDelegate.qml LinkPreviewCardDelegate 1.0 LinkPreviewCardDelegate.qml LinkPreviewGifDelegate 1.0 LinkPreviewGifDelegate.qml LinkPreviewMiniCardDelegate 1.0 LinkPreviewMiniCardDelegate.qml +RequestPaymentCardDelegate 1.0 RequestPaymentCardDelegate.qml InfoCard 1.0 InfoCard.qml diff --git a/ui/imports/shared/views/chat/LinksMessageView.qml b/ui/imports/shared/views/chat/LinksMessageView.qml index 8d7787d4b9..24b26bfec1 100644 --- a/ui/imports/shared/views/chat/LinksMessageView.qml +++ b/ui/imports/shared/views/chat/LinksMessageView.qml @@ -25,15 +25,21 @@ Flow { required property var linkPreviewModel required property var gifLinks + required property var requestPaymentModel + required property bool gifUnfurlingEnabled required property bool canAskToUnfurlGifs + property string senderName + property var senderImageAssetSettings + readonly property alias hoveredLink: linksRepeater.hoveredUrl property string highlightLink: "" signal imageClicked(var image, var mouse, string imageSource, string url) signal openContextMenu(var item, string url, string domain) signal setNeverAskAboutUnfurlingAgain(bool neverAskAgain) + signal requestPaymentClicked(var symbol, var amount, var address, var chainId) function resetLocalAskAboutUnfurling() { d.localAskAboutUnfurling = true @@ -56,6 +62,21 @@ Flow { sourceComponent: enableLinkComponent } + Repeater { + id: requestPaymentRepeater + model: root.requestPaymentModel + delegate: RequestPaymentCardDelegate { + required property var model + objectName: "RrequestPaymentDelegate_" + model.index + amount: model.amount + symbol: model.symbol + address: model.address + senderName: root.senderName + senderImageAssetSettings: root.senderImageAssetSettings + onClicked: root.requestPaymentClicked(model.symbol, model.amount, model.address, model.chainId) + } + } + Repeater { id: tempRepeater visible: root.canAskToUnfurlGifs diff --git a/ui/imports/shared/views/chat/MessageView.qml b/ui/imports/shared/views/chat/MessageView.qml index 624d61769c..40febc7149 100644 --- a/ui/imports/shared/views/chat/MessageView.qml +++ b/ui/imports/shared/views/chat/MessageView.qml @@ -70,6 +70,7 @@ Loader { property string messagePinnedBy: "" property var reactionsModel: [] property var linkPreviewModel + property var requestPaymentModel property string messageAttachments: "" property var transactionParams property var emojiReactionsModel @@ -350,8 +351,6 @@ Loader { return StatusMessage.ContentType.SystemMessageMutualEventAccepted; case Constants.messageContentType.systemMessageMutualEventRemoved: return StatusMessage.ContentType.SystemMessageMutualEventRemoved; - case Constants.messageContentType.attachmentType: - return StatusMessage.ContentType.Attachment; case Constants.messageContentType.fetchMoreMessagesButton: case Constants.messageContentType.chatIdentifier: case Constants.messageContentType.unknownContentType: @@ -961,6 +960,7 @@ Loader { linkPreviewModel: root.linkPreviewModel gifLinks: root.gifLinks + requestPaymentModel: root.requestPaymentModel playAnimations: root.Window.active && root.messageStore.isChatActive isOnline: root.rootStore.mainModuleInst.isOnline highlightLink: delegate.hoveredLink diff --git a/ui/imports/utils/Constants.qml b/ui/imports/utils/Constants.qml index 0db6827699..9f04a462b2 100644 --- a/ui/imports/utils/Constants.qml +++ b/ui/imports/utils/Constants.qml @@ -476,7 +476,6 @@ QtObject { readonly property int systemMessageMutualEventAccepted: 16 readonly property int systemMessageMutualEventRemoved: 17 readonly property int bridgeMessageType: 18 - readonly property int attachmentType: 19 } readonly property QtObject messageModelRoles: QtObject {