feat(@desktop/wallet): Move action buttons to bottom as per new design

fixes #5075

ui/app/AppLayouts/Wallet/WalletLayout.qml

@@ -19,6 +19,7 @@ Item {
     property var store
     property var contactsStore
     property var emojiPopup: null
+    property var sendModal
 
     function showSigningPhrasePopup(){
         if(!hideSignPhraseModal && !RootStore.hideSignPhraseModal){
@@ -54,6 +55,7 @@ Item {
             changeSelectedAccount: leftTab.changeSelectedAccount
             store: walletView.store
             emojiPopup: walletView.emojiPopup
+            sendModal: walletView.sendModal
         }
     }
 

ui/app/AppLayouts/Wallet/panels/WalletFooter.qml

@@ -0,0 +1,73 @@
+import QtQuick 2.14
+import QtQuick.Controls 2.14
+import QtQuick.Layouts 1.13
+
+import StatusQ.Popups 0.1
+import StatusQ.Controls 0.1
+
+import utils 1.0
+
+import "../popups"
+
+Rectangle {
+    id: walletFooter
+
+    property var sendModal
+
+    height: 61
+    color: Theme.palette.statusAppLayout.rightPanelBackgroundColor
+
+    StatusModalDivider {
+        anchors.top: parent.top
+        width: parent.width
+    }
+
+    RowLayout {
+        anchors.centerIn: parent
+        height: sendBtn.height
+        spacing:  Style.current.padding
+
+        StatusFlatButton {
+            icon.name: "send"
+            //% "Send"
+            text: qsTrId("command-button-send")
+            onClicked: function() {
+                sendModal.open()
+            }
+        }
+
+        StatusFlatButton {
+            icon.name: "receive"
+            //% "Receive"
+            text: qsTrId("receive")
+            onClicked: function () {
+                Global.openPopup(receiveModalComponent);
+            }
+        }
+
+        StatusFlatButton {
+            id: buySellBtn
+            icon.name: "token"
+            //% "Buy / Sell"
+            text: qsTrId("Buy / Sell")
+            onClicked: function () {
+                Global.openPopup(buySellModal);
+            }
+        }
+    }
+
+    Component {
+        id: receiveModalComponent
+        ReceiveModal {
+            selectedAccount: walletHeader.walletStore.currentAccount
+            anchors.centerIn: parent
+        }
+    }
+
+    Component {
+        id: buySellModal
+        CryptoServicesModal {}
+    }
+}
+
+

ui/app/AppLayouts/Wallet/panels/WalletHeader.qml

@@ -24,14 +24,6 @@ Item {
     property var emojiPopup
 
     height: walletAddress.y + walletAddress.height
-    anchors.right: parent.right
-    anchors.rightMargin: 0
-    anchors.left: parent.left
-    anchors.leftMargin: 0
-    anchors.top: parent.top
-    anchors.topMargin: 0
-    Layout.fillHeight: true
-    Layout.fillWidth: true
 
     StyledText {
         id: title
@@ -88,17 +80,6 @@ Item {
         store: walletHeader.walletStore
     }
 
-    Component {
-        id: receiveModalComponent
-        ReceiveModal {
-            onClosed: {
-                destroy();
-            }
-            selectedAccount: walletHeader.walletStore.currentAccount
-            anchors.centerIn: parent
-        }
-    }
-
     Component {
         id: setCurrencyModalComponent
         SetCurrencyModal {
@@ -118,56 +99,16 @@ Item {
         }
     }
 
-
-    Component {
-        id: buySellModal
-        CryptoServicesModal {
-            onClosed: destroy()
-        }
-    }
-
     RowLayout {
         id: walletMenu
 
         anchors.top: parent.top
-        anchors.topMargin: 16
+        anchors.topMargin: Style.current.padding
         anchors.right: parent.right
-        anchors.rightMargin: 16
+        anchors.rightMargin: Style.current.padding
 
         spacing:  Style.current.bigPadding
 
-        HeaderButton {
-            id: sendBtn
-            imageSource: Style.svg("send")
-            //% "Send"
-            text: qsTrId("command-button-send")
-            onClicked: function() {
-                sendModal.open()
-            }
-        }
-
-        HeaderButton {
-            id: receiveBtn
-            imageSource: Style.svg("send")
-            flipImage: true
-            //% "Receive"
-            text: qsTrId("receive")
-            onClicked: function () {
-                Global.openPopup(receiveModalComponent);
-            }
-        }
-
-        HeaderButton {
-            id: buySellBtn
-            imageSource: Style.svg("crypto-icon")
-            flipImage: true
-            //% "Buy / Sell"
-            text: qsTrId("Buy / Sell")
-            onClicked: function () {
-                Global.openPopup(buySellModal);
-            }
-        }
-
         HeaderButton {
             id: settingsBtn
             imageSource: Style.svg("settings")

ui/app/AppLayouts/Wallet/views/RightTabView.qml

@@ -20,28 +20,23 @@ Item {
     property alias currentTabIndex: walletTabBar.currentIndex
     property var store
     property var emojiPopup
+    property var sendModal
 
-    WalletHeader {
+    ColumnLayout {
-        id: walletHeader
+        width: parent.width
-        locale: RootStore.locale
+        height: parent.height
-        currency: RootStore.currentCurrency
-        currentAccount: RootStore.currentAccount
-        changeSelectedAccount: walletContainer.changeSelectedAccount
-        store: walletContainer.store
-        walletStore: RootStore
-        emojiPopup: walletContainer.emojiPopup
-    }
 
-    RowLayout {
+        WalletHeader {
-        id: walletInfoContainer
+            id: walletHeader
-        anchors.bottom: parent.bottom
+            Layout.fillWidth: true
-        anchors.bottomMargin: 0
+            locale: RootStore.locale
-        anchors.left: parent.left
+            currency: RootStore.currentCurrency
-        anchors.leftMargin: 0
+            currentAccount: RootStore.currentAccount
-        anchors.right: parent.right
+            changeSelectedAccount: walletContainer.changeSelectedAccount
-        anchors.rightMargin: 0
+            store: walletContainer.store
-        anchors.top: walletHeader.bottom
+            walletStore: RootStore
-        anchors.topMargin: 23
+            emojiPopup: walletContainer.emojiPopup
+        }
 
         Item {
             id: walletInfoContent
@@ -103,5 +98,11 @@ Item {
                 }
             }
         }
+
+        WalletFooter {
+            id: walletFooter
+            Layout.fillWidth: true
+            sendModal: walletContainer.sendModal
+        }
     }
 }

ui/app/mainui/AppMain.qml

@@ -498,6 +498,7 @@ Item {
                     store: appMain.rootStore
                     contactsStore: appMain.rootStore.profileSectionStore.contactsStore
                     emojiPopup: statusEmojiPopup
+                    sendModal: sendModal
                 }
 
                 Component {