From fc3daa14518719761e39515d711bbe302b93cfe7 Mon Sep 17 00:00:00 2001
From: Alexandra Betouni <alexandra.betouni@protonmail.com>
Date: Tue, 13 Sep 2022 19:17:54 +0300
Subject: [PATCH] (StatusSectionLayout): removed big space between header and
 content

Closes 7312
---
 .../src/StatusQ/Components/StatusToolBar.qml  |  8 ++-
 .../Chat/layouts/SettingsPageLayout.qml       | 30 +++-----
 .../CommunityOverviewSettingsPanel.qml        | 17 +++--
 .../CommunityPermissionsSettingsPanel.qml     | 17 ++---
 .../Chat/views/ChatHeaderContentView.qml      |  7 +-
 .../Chat/views/CommunitySettingsView.qml      | 18 +++--
 .../CommunitiesPortalLayout.qml               |  9 +--
 ui/app/AppLayouts/Profile/ProfileLayout.qml   | 29 +++++---
 .../Profile/stores/ProfileSectionStore.qml    |  1 +
 .../AppLayouts/Profile/views/ContactsView.qml |  1 -
 .../Profile/views/EnsWelcomeView.qml          |  1 -
 .../Profile/views/SettingsContentBase.qml     | 35 +---------
 .../AppLayouts/Profile/views/WalletView.qml   | 16 ++---
 ui/app/AppLayouts/Wallet/WalletLayout.qml     | 10 ++-
 .../controls/CollectibleDetailsHeader.qml     | 14 ----
 .../Wallet/controls/NetworkFilter.qml         | 68 ++++++++++---------
 .../AppLayouts/Wallet/panels/WalletHeader.qml |  9 +--
 ui/app/AppLayouts/Wallet/stores/RootStore.qml |  1 +
 .../AppLayouts/Wallet/views/RightTabView.qml  | 14 ++--
 .../collectibles/CollectibleDetailView.qml    |  3 -
 ui/imports/shared/views/AssetsDetailView.qml  | 15 ----
 21 files changed, 140 insertions(+), 183 deletions(-)

diff --git a/ui/StatusQ/src/StatusQ/Components/StatusToolBar.qml b/ui/StatusQ/src/StatusQ/Components/StatusToolBar.qml
index 74cb768d04..8428d79503 100644
--- a/ui/StatusQ/src/StatusQ/Components/StatusToolBar.qml
+++ b/ui/StatusQ/src/StatusQ/Components/StatusToolBar.qml
@@ -18,19 +18,20 @@ ToolBar {
     signal notificationButtonClicked()
 
     implicitWidth: visible ? 518 : 0
-    implicitHeight: visible ? 60 : 0
-    padding: 8
+    implicitHeight: visible ? 56 : 0
+    padding: 4
     background: null
 
     RowLayout {
         anchors.fill: parent
+        anchors.rightMargin: 4
         spacing: 0
         StatusFlatButton {
             icon.name: "arrow-left"
             icon.width: 20
             icon.height: 20
             Layout.alignment: Qt.AlignLeft | Qt.AlignVCenter
-            Layout.leftMargin: 12
+            Layout.leftMargin: 18
             visible: !!root.backButtonName
             text: root.backButtonName
             size: StatusBaseButton.Size.Large
@@ -41,6 +42,7 @@ ToolBar {
             id: headerContentItem
             Layout.fillWidth: !!headerContent
             Layout.fillHeight: !!headerContent
+            Layout.leftMargin: 8
             background: null
             contentItem: (!!headerContent) ? headerContent : null
         }
diff --git a/ui/app/AppLayouts/Chat/layouts/SettingsPageLayout.qml b/ui/app/AppLayouts/Chat/layouts/SettingsPageLayout.qml
index 1a07908d08..1b97493642 100644
--- a/ui/app/AppLayouts/Chat/layouts/SettingsPageLayout.qml
+++ b/ui/app/AppLayouts/Chat/layouts/SettingsPageLayout.qml
@@ -17,7 +17,6 @@ Item {
     property Component content
 
     // optional
-    property string previousPage
     property bool dirty: false
     property bool editable: false
 
@@ -26,7 +25,6 @@ Item {
         Qt.size(settingsDirtyToastMessage.implicitWidth,
                 settingsDirtyToastMessage.implicitHeight + settingsDirtyToastMessage.anchors.bottomMargin)
 
-    signal previousPageClicked
     signal saveChangesClicked
     signal resetChangesClicked
 
@@ -48,25 +46,17 @@ Item {
         anchors.fill: parent
         spacing: 16
 
-        StatusIconTextButton {
-            implicitHeight: 32
-            visible: root.previousPage
-            spacing: 8
-            statusIcon: "arrow"
-            icon.width: 24
-            icon.height: 24
-            text: root.previousPage
-            font.pixelSize: 15
-            onClicked: root.previousPageClicked()
-        }
-
-        StatusBaseText {
+        Item {
+            width: parent.width
+            Layout.preferredHeight: 56
             Layout.leftMargin: 36
-
-            text: root.title
-            color: Theme.palette.directColor1
-            font.pixelSize: 26
-            font.bold: true
+            StatusBaseText {
+                anchors.verticalCenter: parent.verticalCenter
+                text: root.title
+                color: Theme.palette.directColor1
+                font.pixelSize: 26
+                font.bold: true
+            }
         }
 
         Loader {
diff --git a/ui/app/AppLayouts/Chat/panels/communities/CommunityOverviewSettingsPanel.qml b/ui/app/AppLayouts/Chat/panels/communities/CommunityOverviewSettingsPanel.qml
index a3b8e04b67..e6539c33ea 100644
--- a/ui/app/AppLayouts/Chat/panels/communities/CommunityOverviewSettingsPanel.qml
+++ b/ui/app/AppLayouts/Chat/panels/communities/CommunityOverviewSettingsPanel.qml
@@ -34,6 +34,14 @@ StackLayout {
     property bool editable: false
     property bool owned: false
 
+    function updateState() {
+        if (editCommunityPage.dirty) {
+            editCommunityPage.notifyDirty();
+        } else {
+            root.currentIndex = 0;
+        }
+    }
+
     signal edited(Item item) // item containing edited fields (name, description, logoImagePath, color, options, etc..)
 
     signal inviteNewPeopleClicked
@@ -160,7 +168,6 @@ StackLayout {
     SettingsPageLayout {
         id: editCommunityPage
 
-        previousPage: qsTr("Overview")
         title: qsTr("Edit Community")
         editable: true
 
@@ -205,14 +212,6 @@ StackLayout {
             }
         }
 
-        onPreviousPageClicked: {
-            if (dirty) {
-                notifyDirty()
-            } else {
-                root.currentIndex = 0
-            }
-        }
-
         onSaveChangesClicked: {
             root.currentIndex = 0
             root.edited(contentItem)
diff --git a/ui/app/AppLayouts/Chat/panels/communities/CommunityPermissionsSettingsPanel.qml b/ui/app/AppLayouts/Chat/panels/communities/CommunityPermissionsSettingsPanel.qml
index c446ddf6fa..9af79bd01b 100644
--- a/ui/app/AppLayouts/Chat/panels/communities/CommunityPermissionsSettingsPanel.qml
+++ b/ui/app/AppLayouts/Chat/panels/communities/CommunityPermissionsSettingsPanel.qml
@@ -6,6 +6,13 @@ import "../../views/communities"
 SettingsPageLayout {
     id: root
 
+    property string previousPageName
+    function updateState() {
+        if (root.state === d.newPermissionViewState) {
+            root.state = d.welcomeViewState;
+        }
+    }
+
     QtObject {
         id: d
 
@@ -18,23 +25,17 @@ SettingsPageLayout {
         State {
             name: d.welcomeViewState
             PropertyChanges {target: root; title: qsTr("Permissions")}
-            PropertyChanges {target: root; previousPage: ""}
+            PropertyChanges {target: root; previousPageName: ""}
             PropertyChanges {target: root; content: welcomeView}
         },
         State {
             name: d.newPermissionViewState
             PropertyChanges {target: root; title: qsTr("New permission")}
-            PropertyChanges {target: root; previousPage: qsTr("Permissions")}
+            PropertyChanges {target: root; previousPageName: qsTr("Permissions")}
             PropertyChanges {target: root; content: newPermissionView}
         }
     ]
 
-    onPreviousPageClicked: {
-        if(root.state === d.newPermissionViewState) {
-            root.state = d.welcomeViewState
-        }
-    }
-
     // Community Permissions possible view contents:
     Component {
         id: welcomeView
diff --git a/ui/app/AppLayouts/Chat/views/ChatHeaderContentView.qml b/ui/app/AppLayouts/Chat/views/ChatHeaderContentView.qml
index d2d3444643..8cee3cefeb 100644
--- a/ui/app/AppLayouts/Chat/views/ChatHeaderContentView.qml
+++ b/ui/app/AppLayouts/Chat/views/ChatHeaderContentView.qml
@@ -37,12 +37,8 @@ RowLayout {
 
     Loader {
         id: loader
-        Layout.fillWidth: true
+        Layout.fillWidth: d.selectingMembers
         Layout.fillHeight: true
-        Layout.alignment: Qt.AlignLeft
-        Layout.leftMargin: padding
-        Layout.rightMargin: Style.current.padding
-
         sourceComponent: {
             if (d.selectingMembers) return membersSelector
             return statusChatInfoButton
@@ -52,7 +48,6 @@ RowLayout {
     RowLayout {
         id: actionButtons
         Layout.alignment: Qt.AlignRight
-        Layout.rightMargin: padding
         spacing: 8
         visible: !d.selectingMembers
 
diff --git a/ui/app/AppLayouts/Chat/views/CommunitySettingsView.qml b/ui/app/AppLayouts/Chat/views/CommunitySettingsView.qml
index e0c2672c63..bacc7edc56 100644
--- a/ui/app/AppLayouts/Chat/views/CommunitySettingsView.qml
+++ b/ui/app/AppLayouts/Chat/views/CommunitySettingsView.qml
@@ -57,14 +57,17 @@ StatusSectionLayout {
     signal backToCommunityClicked
     signal openLegacyPopupClicked // TODO: remove me when migration to new settings is done
 
-    leftPanel: Item {
+    onBackButtonClicked: {
+        centerPanelContentLoader.item.children[d.currentIndex].updateState();
+    }
+
+    leftPanel: ColumnLayout {
         anchors.fill: parent
 
         ColumnLayout {
             anchors {
                 top: parent.top
                 bottom: footer.top
-                topMargin: 16
                 bottomMargin: 16
                 horizontalCenter: parent.horizontalCenter
             }
@@ -138,6 +141,7 @@ StatusSectionLayout {
     }
 
     centerPanel: Loader {
+        id: centerPanelContentLoader
         anchors.fill: parent
         //anchors.margins: 32
         anchors {
@@ -163,7 +167,9 @@ StatusSectionLayout {
                 archiveSupportEnabled: root.community.historyArchiveSupportEnabled
                 requestToJoinEnabled: root.community.access === Constants.communityChatOnRequestAccess
                 pinMessagesEnabled: root.community.pinMessageAllMembersEnabled
-
+                onCurrentIndexChanged: {
+                    root.backButtonName = (currentIndex === 1) ? qsTr("Overview") : "";
+                }
                 archiveSupportOptionVisible: root.rootStore.isCommunityHistoryArchiveSupportEnabled
                 editable: root.community.amISectionAdmin
 
@@ -218,7 +224,11 @@ StatusSectionLayout {
                 onDeclineRequestToJoin: root.rootStore.declineRequestToJoinCommunity(id)
             }
 
-            CommunityPermissionsSettingsPanel {}
+            CommunityPermissionsSettingsPanel {
+                onStateChanged: {
+                    root.backButtonName = previousPageName;
+                }
+            }
         }
     }
 
diff --git a/ui/app/AppLayouts/CommunitiesPortal/CommunitiesPortalLayout.qml b/ui/app/AppLayouts/CommunitiesPortal/CommunitiesPortalLayout.qml
index fb91ff7694..b051fc9edd 100644
--- a/ui/app/AppLayouts/CommunitiesPortal/CommunitiesPortalLayout.qml
+++ b/ui/app/AppLayouts/CommunitiesPortal/CommunitiesPortalLayout.qml
@@ -47,6 +47,8 @@ StatusSectionLayout {
     centerPanel: Item {
         implicitWidth: parent.width
         implicitHeight: parent.height
+        anchors.left: parent.left
+        anchors.leftMargin: d.layoutHMargin
         clip: true
 
         StatusScrollView {
@@ -60,7 +62,6 @@ StatusSectionLayout {
                 spacing: 18
 
                 StatusBaseText {
-                    Layout.leftMargin: d.layoutHMargin
                     text: qsTr("Find community")
                     font.weight: Font.Bold
                     font.pixelSize: d.titlePixelSize
@@ -75,7 +76,6 @@ StatusSectionLayout {
                     StatusInput {
                         id: searcher
                         implicitWidth: 327
-                        Layout.leftMargin: d.layoutHMargin
                         Layout.alignment: Qt.AlignVCenter
                         enabled: false // Out of scope
                         placeholderText: qsTr("Search")
@@ -123,12 +123,10 @@ StatusSectionLayout {
 
                 CommunityTagsRow {
                     tags: root.communitiesStore.communityTags
-                    Layout.leftMargin: d.layoutHMargin
                     Layout.fillWidth: true
                 }
 
                 StatusBaseText {
-                    Layout.leftMargin: d.layoutHMargin
                     Layout.topMargin: 20
                     text: qsTr("Featured")
                     font.weight: Font.Bold
@@ -138,7 +136,6 @@ StatusSectionLayout {
 
                 GridLayout {
                     id: featuredGrid
-                    Layout.leftMargin: d.layoutHMargin
                     columns: 3
                     columnSpacing: Style.current.padding
                     rowSpacing: Style.current.padding
@@ -163,7 +160,6 @@ StatusSectionLayout {
                 }
 
                 StatusBaseText {
-                    Layout.leftMargin: d.layoutHMargin
                     Layout.topMargin: 20
                     text: qsTr("Popular")
                     font.weight: Font.Bold
@@ -172,7 +168,6 @@ StatusSectionLayout {
                 }
 
                 GridLayout {
-                    Layout.leftMargin: d.layoutHMargin
                     columns: 3
                     columnSpacing: Style.current.padding
                     rowSpacing: Style.current.padding
diff --git a/ui/app/AppLayouts/Profile/ProfileLayout.qml b/ui/app/AppLayouts/Profile/ProfileLayout.qml
index c45d92a658..e033a7e855 100644
--- a/ui/app/AppLayouts/Profile/ProfileLayout.qml
+++ b/ui/app/AppLayouts/Profile/ProfileLayout.qml
@@ -21,8 +21,20 @@ StatusSectionLayout {
     property var systemPalette
     property var emojiPopup
 
+    backButtonName: root.store.backButtonName
     notificationCount: root.store.unreadNotificationsCount
     onNotificationButtonClicked: Global.openActivityCenterPopup()
+    onBackButtonClicked: {
+        switch (profileContainer.currentIndex) {
+        case 1:
+            Global.changeAppSectionBySectionType(Constants.appSection.profile, Constants.settingsSubsection.messaging)
+            break;
+        case 4:
+            walletView.resetStack();
+            break;
+        }
+    }
+
     Component.onCompleted: {
         Global.privacyModuleInst = store.privacyStore.privacyModule
     }
@@ -32,8 +44,8 @@ StatusSectionLayout {
 
         readonly property int topMargin: 0
         readonly property int bottomMargin: 56
-        readonly property int leftMargin: 48
-        readonly property int rightMargin: 48
+        readonly property int leftMargin: 64
+        readonly property int rightMargin: 64
 
         readonly property int contentWidth: 560
     }
@@ -73,6 +85,11 @@ StatusSectionLayout {
                 if(visibleChildren[0] === ensContainer){
                     ensContainer.goToStart();
                 }
+                if (currentIndex === 1) {
+                    root.store.backButtonName = root.store.getNameForSubsection(Constants.settingsSubsection.messaging);
+                } else {
+                    root.store.backButtonName = "";
+                }
             }
 
             MyProfileView {
@@ -92,11 +109,6 @@ StatusSectionLayout {
                 contactsStore: root.store.contactsStore
                 sectionTitle: qsTr("Contacts")
                 contentWidth: d.contentWidth
-                backButtonName: root.store.getNameForSubsection(Constants.settingsSubsection.messaging)
-
-                onBackButtonClicked: {
-                    Global.changeAppSectionBySectionType(Constants.appSection.profile, Constants.settingsSubsection.messaging)
-                }
             }
 
             EnsView {
@@ -125,9 +137,10 @@ StatusSectionLayout {
             }
 
             WalletView {
+                id: walletView
                 implicitWidth: parent.width
                 implicitHeight: parent.height
-
+                rootStore: root.store
                 walletStore: root.store.walletStore
                 emojiPopup: root.emojiPopup
                 sectionTitle: root.store.getNameForSubsection(Constants.settingsSubsection.wallet)
diff --git a/ui/app/AppLayouts/Profile/stores/ProfileSectionStore.qml b/ui/app/AppLayouts/Profile/stores/ProfileSectionStore.qml
index 629edec3cf..5dd8c2cd42 100644
--- a/ui/app/AppLayouts/Profile/stores/ProfileSectionStore.qml
+++ b/ui/app/AppLayouts/Profile/stores/ProfileSectionStore.qml
@@ -5,6 +5,7 @@ import AppLayouts.Chat.stores 1.0
 
 QtObject {
     id: root
+    property string backButtonName
     property int unreadNotificationsCount: activityCenterList.unreadCount
 
     property var aboutModuleInst: aboutModule
diff --git a/ui/app/AppLayouts/Profile/views/ContactsView.qml b/ui/app/AppLayouts/Profile/views/ContactsView.qml
index 28da77c8bf..dab22d2fb3 100644
--- a/ui/app/AppLayouts/Profile/views/ContactsView.qml
+++ b/ui/app/AppLayouts/Profile/views/ContactsView.qml
@@ -66,7 +66,6 @@ SettingsContentBase {
         SearchBox {
             id: searchBox
             anchors.left: parent.left
-            anchors.leftMargin: Style.current.padding
             anchors.right: parent.right
             placeholderText: qsTr("Search by a display name or chat key")
         }
diff --git a/ui/app/AppLayouts/Profile/views/EnsWelcomeView.qml b/ui/app/AppLayouts/Profile/views/EnsWelcomeView.qml
index 1082f5f3a6..ee8cb15688 100644
--- a/ui/app/AppLayouts/Profile/views/EnsWelcomeView.qml
+++ b/ui/app/AppLayouts/Profile/views/EnsWelcomeView.qml
@@ -20,7 +20,6 @@ Item {
         id: sview
         ScrollBar.horizontal.policy: ScrollBar.AlwaysOff
         anchors.top: parent.top
-        anchors.topMargin: 24
         anchors.bottom: startBtn.top
         anchors.bottomMargin: Style.current.padding
         anchors.left: parent.left
diff --git a/ui/app/AppLayouts/Profile/views/SettingsContentBase.qml b/ui/app/AppLayouts/Profile/views/SettingsContentBase.qml
index 6d5f7413a2..2002490d65 100644
--- a/ui/app/AppLayouts/Profile/views/SettingsContentBase.qml
+++ b/ui/app/AppLayouts/Profile/views/SettingsContentBase.qml
@@ -16,8 +16,6 @@ Item {
     property int contentWidth
     readonly property int contentHeight: (root.height - d.topHeaderHeight - d.titleRowHeight)
 
-    property string backButtonName: ""
-
     property alias titleRowComponentLoader: loader
     property list<Item> headerComponents
     default property Item content
@@ -25,7 +23,6 @@ Item {
     property bool dirty: false
     property bool saveChangesButtonEnabled: false
 
-    signal backButtonClicked()
     signal baseAreaClicked()
     signal saveChangesClicked()
     signal resetChangesClicked()
@@ -56,35 +53,10 @@ Item {
         }
     }
 
-    Item {
-        id: topHeader
-        anchors.left: parent.left
-        anchors.top: parent.top
-        anchors.leftMargin: -Style.current.padding
-        width: root.contentWidth + Style.current.padding
-        height: d.topHeaderHeight
-
-        StatusFlatButton {
-            anchors.top: parent.top
-            anchors.left: parent.left
-            anchors.topMargin: Style.current.halfPadding
-            visible: root.backButtonName != ""
-            icon.name: "arrow-left"
-            icon.width: 20
-            icon.height: 20
-            text: root.backButtonName
-            size: StatusBaseButton.Size.Large
-            onClicked: root.backButtonClicked()
-        }
-    }
-
     RowLayout {
         id: titleRow
-        anchors.left: parent.left
-        anchors.top: topHeader.bottom
-        anchors.leftMargin: Style.current.padding
-        width: root.contentWidth - Style.current.padding
-        height: d.titleRowHeight
+        width: visible ? root.contentWidth : 0
+        height: visible ? d.titleRowHeight : 0
         visible: root.sectionTitle !== ""
 
         StatusBaseText {
@@ -103,9 +75,8 @@ Item {
     StatusScrollView {
         id: scrollView
         objectName: "settingsContentBaseScrollView"
-        anchors.top: titleRow.visible ? titleRow.bottom : topHeader.bottom
+        anchors.top: titleRow.visible ? titleRow.bottom : parent.top
         anchors.bottom: parent.bottom
-        anchors.left: parent.left
         anchors.topMargin: Style.current.bigPadding
         padding: 0
         width: root.contentWidth
diff --git a/ui/app/AppLayouts/Profile/views/WalletView.qml b/ui/app/AppLayouts/Profile/views/WalletView.qml
index 94262f5993..cd6848e7f1 100644
--- a/ui/app/AppLayouts/Profile/views/WalletView.qml
+++ b/ui/app/AppLayouts/Profile/views/WalletView.qml
@@ -11,7 +11,6 @@ import shared.panels 1.0
 import shared.popups 1.0
 import shared.status 1.0
 
-import "../stores"
 import "../controls"
 import "../popups"
 import "../panels"
@@ -21,15 +20,16 @@ SettingsContentBase {
     id: root
 
     property var emojiPopup
-    property WalletStore walletStore
+    property var rootStore
+    property var walletStore
 
     readonly property int mainViewIndex: 0;
     readonly property int networksViewIndex: 1;
     readonly property int accountViewIndex: 2;
     readonly property int dappPermissionViewIndex: 3;
 
-    onBackButtonClicked: {
-        stackContainer.currentIndex = mainViewIndex
+    function resetStack() {
+        stackContainer.currentIndex = mainViewIndex;
     }
 
     StackLayout {
@@ -39,22 +39,22 @@ SettingsContentBase {
         currentIndex: mainViewIndex
 
         onCurrentIndexChanged: {
-            root.backButtonName = ""
+            root.rootStore.backButtonName = ""
             root.sectionTitle = qsTr("Wallet")
             root.titleRowComponentLoader.sourceComponent = undefined
 
             if(currentIndex == root.networksViewIndex) {
-                root.backButtonName = qsTr("Wallet")
+                root.rootStore.backButtonName = qsTr("Wallet")
                 root.sectionTitle = qsTr("Networks")
 
                 root.titleRowComponentLoader.sourceComponent = testnetModeSwitchComponent
             }
             else if(currentIndex == root.accountViewIndex) {
-                root.backButtonName = qsTr("Wallet")
+                root.rootStore.backButtonName = qsTr("Wallet")
                 root.sectionTitle = ""
             }
             else if(currentIndex == root.dappPermissionViewIndex) {
-                root.backButtonName = qsTr("Wallet")
+                root.rootStore.backButtonName = qsTr("Wallet")
                 root.sectionTitle = qsTr("DApp Permissions")
             }
         }
diff --git a/ui/app/AppLayouts/Wallet/WalletLayout.qml b/ui/app/AppLayouts/Wallet/WalletLayout.qml
index 237106a840..09f1995be4 100644
--- a/ui/app/AppLayouts/Wallet/WalletLayout.qml
+++ b/ui/app/AppLayouts/Wallet/WalletLayout.qml
@@ -64,9 +64,13 @@ Item {
         anchors.top: seedPhraseWarning.bottom
         height: root.height - seedPhraseWarning.height
         width: root.width
-
+        backButtonName: RootStore.backButtonName
         notificationCount: RootStore.unreadNotificationsCount
         onNotificationButtonClicked: Global.openActivityCenterPopup()
+        onBackButtonClicked: {
+            rightPanelStackView.currentItem.resetStack();
+        }
+
         Component.onCompleted: {
             // Read in RootStore
 //            if(RootStore.firstTimeLogin){
@@ -105,8 +109,8 @@ Item {
         centerPanel: StackView {
             id: rightPanelStackView
             anchors.fill: parent
-            anchors.leftMargin: 49
-            anchors.rightMargin: 49
+            anchors.leftMargin: 64
+            anchors.rightMargin: 64
             initialItem: walletContainer
             replaceEnter: Transition {
                 NumberAnimation { property: "opacity"; from: 0; to: 1; duration: 400; easing.type: Easing.OutCubic }
diff --git a/ui/app/AppLayouts/Wallet/controls/CollectibleDetailsHeader.qml b/ui/app/AppLayouts/Wallet/controls/CollectibleDetailsHeader.qml
index 24e58729fb..b436174fac 100644
--- a/ui/app/AppLayouts/Wallet/controls/CollectibleDetailsHeader.qml
+++ b/ui/app/AppLayouts/Wallet/controls/CollectibleDetailsHeader.qml
@@ -11,8 +11,6 @@ import StatusQ.Controls 0.1
 ColumnLayout {
     id: root
 
-    signal goBack()
-
     property alias primaryText: collectibleName.text
     property alias secondaryText: collectibleId.text
     property StatusAssetSettings asset: StatusAssetSettings {
@@ -21,18 +19,6 @@ ColumnLayout {
         isImage: true
     }
 
-    StatusFlatButton {
-        Layout.topMargin: -Style.current.xlPadding
-        Layout.leftMargin: -Style.current.xlPadding
-        visible: root.backButtonName != ""
-        icon.name: "arrow-left"
-        icon.width: 20
-        icon.height: 20
-        text: qsTr("Assets")
-        size: StatusBaseButton.Size.Large
-        onClicked: root.goBack()
-    }
-
     RowLayout {
         spacing: 8
         StatusSmartIdenticon {
diff --git a/ui/app/AppLayouts/Wallet/controls/NetworkFilter.qml b/ui/app/AppLayouts/Wallet/controls/NetworkFilter.qml
index 8537e4f426..7c3cdf39e5 100644
--- a/ui/app/AppLayouts/Wallet/controls/NetworkFilter.qml
+++ b/ui/app/AppLayouts/Wallet/controls/NetworkFilter.qml
@@ -13,46 +13,50 @@ import "../popups"
 
 Item {
     id: root
-    implicitWidth: selectRectangle.width
+    implicitWidth: 130
     implicitHeight: childrenRect.height
 
     property var store
 
-    // FIXME this should be a (styled) ComboBox
-    StatusListItem {
-        id: selectRectangle
-        implicitWidth: 130
-        implicitHeight: 40
-        border.width: 1
-        border.color: Theme.palette.directColor7
-        color: "transparent"
-        objectName: "networkSelectorButton"
-        leftPadding: 12
-        rightPadding: 12
-        statusListItemTitle.font.pixelSize: 13
-        statusListItemTitle.font.weight: Font.Medium
-        statusListItemTitle.color: Theme.palette.baseColor1
-        title: store.enabledNetworks.count === store.allNetworks.count ? qsTr("All networks") : qsTr("%n network(s)", "", store.enabledNetworks.count)
-        components:[
-            StatusIcon {
-                width: 16
-                height: 16
-                icon: "chevron-down"
-                color: Theme.palette.baseColor1
-            }
-        ]
-        onClicked: {
-            if (selectPopup.opened) {
-                selectPopup.close();
-            } else {
-                selectPopup.open();
+    Item {
+        id: selectRectangleItem
+        width: parent.width
+        height: 56
+        // FIXME this should be a (styled) ComboBox
+        StatusListItem {
+            implicitWidth: parent.width
+            implicitHeight: 40
+            anchors.verticalCenter: parent.verticalCenter
+            border.width: 1
+            border.color: Theme.palette.directColor7
+            color: "transparent"
+            objectName: "networkSelectorButton"
+            leftPadding: 12
+            rightPadding: 12
+            statusListItemTitle.font.pixelSize: 13
+            statusListItemTitle.font.weight: Font.Medium
+            statusListItemTitle.color: Theme.palette.baseColor1
+            title: store.enabledNetworks.count === store.allNetworks.count ? qsTr("All networks") : qsTr("%n network(s)", "", store.enabledNetworks.count)
+            components:[
+                StatusIcon {
+                    width: 16
+                    height: 16
+                    icon: "chevron-down"
+                    color: Theme.palette.baseColor1
+                }
+            ]
+            onClicked: {
+                if (selectPopup.opened) {
+                    selectPopup.close();
+                } else {
+                    selectPopup.open();
+                }
             }
         }
     }
 
     Row {
-        anchors.top: selectRectangle.bottom
-        anchors.topMargin: Style.current.halfPadding
+        anchors.bottom: parent.bottom
         anchors.right: parent.right
         spacing: Style.current.smallPadding
         visible: chainRepeater.count > 0
@@ -71,7 +75,7 @@ Item {
     NetworkSelectPopup {
         id: selectPopup
         x: (parent.width - width + 5)
-        y: (selectRectangle.height + 5)
+        y: (selectRectangleItem.height + 5)
         layer1Networks: store.layer1Networks
         layer2Networks: store.layer2Networks
         testNetworks: store.testNetworks
diff --git a/ui/app/AppLayouts/Wallet/panels/WalletHeader.qml b/ui/app/AppLayouts/Wallet/panels/WalletHeader.qml
index 2581710025..72ec761279 100644
--- a/ui/app/AppLayouts/Wallet/panels/WalletHeader.qml
+++ b/ui/app/AppLayouts/Wallet/panels/WalletHeader.qml
@@ -24,23 +24,25 @@ Item {
     property var store
     property var walletStore
 
-    implicitHeight: childrenRect.height
+    implicitHeight: 88
 
     GridLayout {
         width: parent.width
-        rowSpacing: Style.current.halfPadding
         columns: 2
 
         // account + balance
-        Row {
+        RowLayout {
+            Layout.preferredHeight: 56
             spacing: Style.current.halfPadding
             StatusBaseText {
                 objectName: "accountName"
+                Layout.alignment: Qt.AlignVCenter
                 font.pixelSize: 28
                 font.bold: true
                 text: currentAccount.name
             }
             StatusBaseText {
+                Layout.alignment: Qt.AlignVCenter
                 font.pixelSize: 28
                 font.bold: true
                 color: Theme.palette.baseColor1
@@ -52,7 +54,6 @@ Item {
         NetworkFilter {
             id: networkFilter
             Layout.alignment: Qt.AlignTrailing
-            Layout.fillHeight: true
             Layout.rowSpan: 2
             store: root.walletStore
         }
diff --git a/ui/app/AppLayouts/Wallet/stores/RootStore.qml b/ui/app/AppLayouts/Wallet/stores/RootStore.qml
index fa5292861f..7d78810a1c 100644
--- a/ui/app/AppLayouts/Wallet/stores/RootStore.qml
+++ b/ui/app/AppLayouts/Wallet/stores/RootStore.qml
@@ -8,6 +8,7 @@ import shared.stores 1.0 as SharedStore
 QtObject {
     id: root
 
+    property string backButtonName: ""
     property int unreadNotificationsCount: activityCenterList.unreadCount
     property var currentAccount: Constants.isCppApp ? walletSectionAccounts.currentAccount: walletSectionCurrent
     property var accounts: walletSectionAccounts.model
diff --git a/ui/app/AppLayouts/Wallet/views/RightTabView.qml b/ui/app/AppLayouts/Wallet/views/RightTabView.qml
index fc041f7a26..eb06e011a0 100644
--- a/ui/app/AppLayouts/Wallet/views/RightTabView.qml
+++ b/ui/app/AppLayouts/Wallet/views/RightTabView.qml
@@ -20,6 +20,10 @@ Item {
     property var contactsStore
     property var sendModal
 
+    function resetStack() {
+        stack.currentIndex = 0;
+    }
+
     ColumnLayout {
         anchors.fill: parent
 
@@ -27,13 +31,14 @@ Item {
             id: stack
             Layout.fillWidth: true
             Layout.preferredHeight: parent.height - footer.height
+            onCurrentIndexChanged: {
+                RootStore.backButtonName = ((currentIndex === 1) || (currentIndex === 2)) ? qsTr("Assets") : "";
+            }
 
             ColumnLayout {
                 anchors.fill: parent
                 WalletHeader {
                     Layout.fillWidth: true
-                    Layout.leftMargin: Style.current.padding
-                    Layout.rightMargin: Style.current.padding
                     locale: RootStore.locale
                     currency: RootStore.currentCurrency
                     currentAccount: RootStore.currentAccount
@@ -65,7 +70,8 @@ Item {
                 StackLayout {
                     Layout.fillWidth: true
                     Layout.fillHeight: true
-                    Layout.margins: Style.current.padding
+                    Layout.topMargin: Style.current.padding
+                    Layout.bottomMargin: Style.current.padding
                     currentIndex: walletTabBar.currentIndex
 
                     AssetsView {
@@ -93,13 +99,11 @@ Item {
             CollectibleDetailView {
                 Layout.fillWidth: true
                 Layout.fillHeight: true
-                onGoBack: stack.currentIndex = 0
             }
             AssetsDetailView {
                 id: assetDetailView
                 Layout.fillWidth: true
                 Layout.fillHeight: true
-                onGoBack: stack.currentIndex = 0
                 visible: (stack.currentIndex === 2)
             }
             TransactionDetailView {
diff --git a/ui/app/AppLayouts/Wallet/views/collectibles/CollectibleDetailView.qml b/ui/app/AppLayouts/Wallet/views/collectibles/CollectibleDetailView.qml
index 00738d2fcf..0f403ac196 100644
--- a/ui/app/AppLayouts/Wallet/views/collectibles/CollectibleDetailView.qml
+++ b/ui/app/AppLayouts/Wallet/views/collectibles/CollectibleDetailView.qml
@@ -15,8 +15,6 @@ import "../../controls"
 Item {
     id: root
 
-    signal goBack()
-
     CollectibleDetailsHeader {
         id: collectibleHeader
         anchors.top: parent.top
@@ -26,7 +24,6 @@ Item {
         asset.isImage: true
         primaryText: RootStore.collectiblesStore.name
         secondaryText: RootStore.collectiblesStore.collectibleId
-        onGoBack: root.goBack()
     }
 
     ColumnLayout {
diff --git a/ui/imports/shared/views/AssetsDetailView.qml b/ui/imports/shared/views/AssetsDetailView.qml
index bfc0495f45..f38eeb9b04 100644
--- a/ui/imports/shared/views/AssetsDetailView.qml
+++ b/ui/imports/shared/views/AssetsDetailView.qml
@@ -90,21 +90,6 @@ Item {
         }
     }
 
-    signal goBack()
-    StatusFlatButton {
-        id: backButton
-        anchors.top: parent.top
-        anchors.left: parent.left
-        anchors.topMargin: -Style.current.xlPadding
-        anchors.leftMargin: -Style.current.xlPadding
-        icon.name: "arrow-left"
-        icon.width: 20
-        icon.height: 20
-        text: qsTr("Assets")
-        size: StatusBaseButton.Size.Large
-        onClicked: root.goBack()
-    }
-
     AssetsDetailsHeader {
         id: tokenDetailsHeader
         anchors.top: parent.top