wip: Move request payment delegate

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

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
+                        album: model.contentType === StatusMessage.ContentType.Image ? d.exampleAlbum : []
-                               || model.contentType === StatusMessage.ContentType.Attachment ? d.exampleAlbum : []
+                        albumCount: model.contentType === StatusMessage.ContentType.Image ? d.exampleAlbum.length : 0
-                        albumCount: model.contentType === StatusMessage.ContentType.Image
-                                    || model.contentType === StatusMessage.ContentType.Attachment ? d.exampleAlbum.length : 0
-                        requestPaymentModel: model.contentType === StatusMessage.ContentType.Attachment ? d.requestPaymentModel : null
                     }
 
                     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")
                 }
             }

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)
-        }
     }
 }

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,
+        BridgeMessage = 18
-        Attachment = 19
     }
 
     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

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
 }

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

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 {

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

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

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

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 {