From ee6ac186716de57a553f8f8ad25e3b3bf51fc7de Mon Sep 17 00:00:00 2001
From: miruka <miruka@disroot.org>
Date: Thu, 19 Mar 2020 20:33:46 -0400
Subject: [PATCH] Show pages headers to go back to pane when needed

---
 TODO.md                                       |  1 -
 src/gui/Base/HPageHeader.qml                  | 50 +++++++++++++++++++
 src/gui/PageLoader.qml                        |  4 +-
 .../Pages/AccountSettings/AccountSettings.qml |  2 +
 src/gui/Pages/AddAccount/AddAccount.qml       |  3 ++
 src/gui/Pages/AddChat/AddChat.qml             |  2 +
 src/themes/Midnight.qpl                       |  4 +-
 7 files changed, 62 insertions(+), 4 deletions(-)
 create mode 100644 src/gui/Base/HPageHeader.qml

diff --git a/TODO.md b/TODO.md
index 64d95261..4d52884a 100644
--- a/TODO.md
+++ b/TODO.md
@@ -2,7 +2,6 @@
 
 ## Before release
 
-- page back buttons
 - Add Gentoo instructions
 - Build final AppImage and test media opening
 
diff --git a/src/gui/Base/HPageHeader.qml b/src/gui/Base/HPageHeader.qml
new file mode 100644
index 00000000..36041609
--- /dev/null
+++ b/src/gui/Base/HPageHeader.qml
@@ -0,0 +1,50 @@
+// SPDX-License-Identifier: LGPL-3.0-or-later
+
+import QtQuick 2.12
+import QtQuick.Layouts 1.12
+
+Rectangle {
+    width: page.width
+    height: show ? theme.baseElementsHeight : 0
+    visible: height > 0
+    color: theme.controls.header.background
+
+
+    property HPage page: parent
+    property bool show: mainUI.mainPane.collapse
+
+
+    Behavior on height { HNumberAnimation {} }
+
+    HRowLayout {
+        anchors.fill: parent
+
+        HButton {
+            id: goToMainPaneButton
+            padded: false
+            backgroundColor: "transparent"
+            icon.name: "go-back-to-main-pane"
+            toolTip.text: qsTr("Go back to main pane")
+
+            onClicked: mainUI.mainPane.toggleFocus()
+
+            Layout.preferredWidth: theme.baseElementsHeight
+            Layout.fillHeight: true
+        }
+
+        HLabel {
+            text: page.title
+            elide: Text.ElideRight
+            horizontalAlignment: Qt.AlignHCenter
+            verticalAlignment: Qt.AlignVCenter
+
+            Layout.fillWidth: true
+            Layout.fillHeight: true
+        }
+
+        Item {
+            Layout.preferredWidth: goToMainPaneButton.width
+            Layout.fillHeight: true
+        }
+    }
+}
diff --git a/src/gui/PageLoader.qml b/src/gui/PageLoader.qml
index 148ff472..cbddb9dc 100644
--- a/src/gui/PageLoader.qml
+++ b/src/gui/PageLoader.qml
@@ -16,7 +16,9 @@ HLoader {
 
     Component.onCompleted: {
         if (! py.startupAnyAccountsSaved) {
-            pageLoader.showPage("AddAccount/AddAccount")
+            pageLoader.showPage(
+                "AddAccount/AddAccount", {"header.show": false},
+            )
             return
         }
 
diff --git a/src/gui/Pages/AccountSettings/AccountSettings.qml b/src/gui/Pages/AccountSettings/AccountSettings.qml
index e0a0a2a3..cda105ce 100644
--- a/src/gui/Pages/AccountSettings/AccountSettings.qml
+++ b/src/gui/Pages/AccountSettings/AccountSettings.qml
@@ -8,6 +8,8 @@ import "../../Base"
 
 HFlickableColumnPage {
     id: accountSettings
+    title: qsTr("Account settings")
+    header: HPageHeader {}
 
 
     property int avatarPreferredSize: 256 * theme.uiScale
diff --git a/src/gui/Pages/AddAccount/AddAccount.qml b/src/gui/Pages/AddAccount/AddAccount.qml
index 10b91cfc..8809636b 100644
--- a/src/gui/Pages/AddAccount/AddAccount.qml
+++ b/src/gui/Pages/AddAccount/AddAccount.qml
@@ -5,6 +5,9 @@ import QtQuick.Layouts 1.12
 import "../../Base"
 
 HFlickableColumnPage {
+    title: qsTr("Add an account")
+    header: HPageHeader {}
+
     HTabContainer {
         tabModel: [
             qsTr("Sign in"), qsTr("Register"), qsTr("Reset"),
diff --git a/src/gui/Pages/AddChat/AddChat.qml b/src/gui/Pages/AddChat/AddChat.qml
index c3264ea4..b8bebf93 100644
--- a/src/gui/Pages/AddChat/AddChat.qml
+++ b/src/gui/Pages/AddChat/AddChat.qml
@@ -7,6 +7,8 @@ import "../../Base"
 
 HFlickableColumnPage {
     id: addChatPage
+    title: qsTr("Add new chat")
+    header: HPageHeader {}
 
 
     property string userId
diff --git a/src/themes/Midnight.qpl b/src/themes/Midnight.qpl
index 313ab8ed..fb37a394 100644
--- a/src/themes/Midnight.qpl
+++ b/src/themes/Midnight.qpl
@@ -107,7 +107,7 @@ controls:
         color windowOverlay: hsluv(0, 0, 0, 0.7)
 
     header:
-        color background: colors.mediumBackground
+        color background: colors.strongBackground
 
     button:
         color background: colors.strongBackground
@@ -306,7 +306,7 @@ mainPane:
 
 chat:
     roomHeader:
-        color background: colors.strongBackground
+        color background: controls.header.background
         color name:       colors.text
         color topic:      colors.dimText