Implement pageLoader history + CreateRoom cancel

TODO.md

@@ -34,6 +34,7 @@
   - When qml syntax highlighting supports ES6 string interpolation, use that
 
 - Fixes
+  - General way to show pages as loading until account is ready
   - `code` not colored in room subtitle
   - In the "Leave me" room, "join > Hi > left" aren't combined
   - Event delegates changing height don't scroll the list

src/qml/Pages/AddChat/CreateRoom.qml

@@ -31,6 +31,16 @@ HBox {
                 pageLoader.showRoom(userId, roomId)
             })
         },
+
+        cancel: button => {
+            nameField.text                    = ""
+            topicField.text                   = ""
+            publicCheckBox.checked            = false
+            encryptCheckBox.checked           = false
+            blockOtherServersCheckBox.checked = false
+
+            pageLoader.showPrevious()
+        }
     })
 
 

src/qml/UI.qml

@@ -85,8 +85,13 @@ Item {
 
         HLoader {
             id: pageLoader
+
             property bool isWide: width > theme.contentIsWideAbove
 
+            // List of previously loaded [componentUrl, {properties}]
+            property var history: []
+            property int historyLength: 20
+
             Component.onCompleted: {
                 if (! py.startupAnyAccountsSaved) {
                     pageLoader.showPage("SignIn")
@@ -104,6 +109,9 @@ Item {
             }
 
             function _show(componentUrl, properties={}) {
+                history.unshift([componentUrl, properties])
+                if (history.length > historyLength) history.pop()
+
                 pageLoader.setSource(componentUrl, properties)
             }
 
@@ -124,6 +132,19 @@ Item {
                 window.uiStateChanged()
             }
 
+            function showPrevious(timesBack=1) {
+                timesBack = Math.min(timesBack, history.length - 1)
+                if (timesBack < 1) return
+
+                let [componentUrl, properties] = history[timesBack]
+
+                _show(componentUrl, properties)
+
+                window.uiState.page           = componentUrl
+                window.uiState.pageProperties = properties
+                window.uiStateChanged()
+            }
+
             onStatusChanged: if (status == Loader.Ready) {
                 item.forceActiveFocus()
                 appearAnimation.start()