feat: introduce StatusChatCommandButton

This is a new version of our `ChatCommandButton` so it is an actual
`Button` element.

ui/app/AppLayouts/Chat/ChatColumn/ChatComponents/ChatCommandsPopup.qml

@@ -3,6 +3,7 @@ import QtQuick.Controls 2.13
 import QtGraphicalEffects 1.13
 import "../../../../../imports"
 import "../../../../../shared"
+import "../../../../../shared/status"
 
 Popup {
     id: root
@@ -52,12 +53,13 @@ Popup {
         padding: Style.current.halfPadding
         spacing: Style.current.halfPadding
 
-
-        ChatCommandButton {
-            iconColor: Style.current.purple
-            iconSource: "../../../../img/send.svg"
+        StatusChatCommandButton {
             //% "Send transaction"
             text: qsTrId("send-transaction")
+            icon.color: Style.current.purple
+            icon.name: "send"
+            icon.width: 16
+            icon.height: 18
             onClicked: function () {
                 chatCommandModal.sendChatCommand = root.requestAddressForTransaction
                 chatCommandModal.isRequested = false
@@ -78,12 +80,14 @@ Popup {
         }
 
 
-        ChatCommandButton {
-            iconColor: Style.current.orange
-            iconSource: "../../../../img/send.svg"
-            rotatedImage: true
+        StatusChatCommandButton {
             //% "Request transaction"
             text: qsTrId("request-transaction")
+            icon.color: Style.current.orange
+            icon.name: "send"
+            icon.width: 16
+            icon.height: 18
+            iconRotation: 180
             onClicked: function () {
                 chatCommandModal.sendChatCommand = root.requestTransaction
                 chatCommandModal.isRequested = true

ui/shared/status/StatusChatCommandButton.qml

@@ -0,0 +1,71 @@
+import QtQuick 2.13
+import QtQuick.Controls 2.13
+import QtGraphicalEffects 1.13
+import "../../imports"
+import "../../shared"
+
+Button {
+    id: control
+    property int iconRotation: 0
+    implicitWidth: 168
+    implicitHeight: 95
+    icon.width: 12
+    icon.height: 12
+
+    onIconChanged: {
+        icon.source = icon.name ? "../../app/img/" + icon.name + ".svg" : ""
+    }
+
+    contentItem: Item {
+        anchors.fill: parent
+        Rectangle {
+            radius: 50
+            width: 40
+            height: 40
+            color: control.icon.color
+            anchors.top: parent.top
+            anchors.topMargin: Style.current.smallPadding
+            anchors.left: parent.left
+            anchors.leftMargin: Style.current.smallPadding
+
+            SVGImage {
+                id: iconImage
+                source: control.icon.source
+                anchors.horizontalCenter: parent.horizontalCenter
+                anchors.verticalCenter: parent.verticalCenter
+                width: control.icon.width
+                height: control.icon.height
+                fillMode: Image.PreserveAspectFit
+                rotation: control.iconRotation
+                antialiasing: true
+            }
+
+            ColorOverlay {
+                anchors.fill: iconImage
+                source: iconImage
+                color: Style.current.white
+                rotation: control.iconRotation
+                antialiasing: true
+            }
+        }
+        StyledText {
+            text: control.text
+            anchors.left: parent.left
+            anchors.leftMargin: Style.current.smallPadding
+            anchors.bottom: parent.bottom
+            anchors.bottomMargin: Style.current.smallPadding
+            font.weight: Font.Medium
+            font.pixelSize: 13
+        }
+    }
+    background: Rectangle {
+        radius: 16
+        color: Utils.setColorAlpha(icon.color, 0.2)
+    }
+
+    MouseArea {
+        cursorShape: Qt.PointingHandCursor
+        anchors.fill: parent
+        onPressed: mouse.accepted = false
+    }
+}

ui/shared/status/qmldir

@@ -1,4 +1,5 @@
 StatusButton 1.0 StatusButton.qml
+StatusChatCommandButton 1.0 StatusChatCommandButton.qml
 StatusChatInfo 1.0 StatusChatInfo.qml
 StatusChatInfoButton 1.0 StatusChatInfoButton.qml
 StatusIconButton 1.0 StatusIconButton.qml