Fixed the ghost icon issue and moved to Controls2.StackView

The icon stemmed from the people-view toolbar.
I suppose because the item was not properly hidden but still existing.

2 files changed, 47 insertions, 30 deletions

diff --git a/components/kube/contents/ui/Kube.qml b/components/kube/contents/ui/Kube.qml
index 54a81112..92f12f6c 100644
--- a/components/kube/contents/ui/Kube.qml
+++ b/components/kube/contents/ui/Kube.qml
@@ -159,7 +159,7 @@ Controls2.ApplicationWindow {
                 }
             }
         }
-        StackView {
+        Controls2.StackView {
             id: kubeViews
 
             anchors {
@@ -174,38 +174,52 @@ Controls2.ApplicationWindow {
                 onMessageReceived: kubeViews.pop({immediate: true})
             }
 
+            //TODO replacing here while a composer is open is destructive
             function setPeopleView() {
-                //TODO replacing here while a composer is open is destructive
-                kubeViews.push({item: peopleView, replace: true, immediate: true})
+                if (currentItem != peopleView) {
+                    kubeViews.replace(null, peopleView, Controls2.StackView.Immediate)
+                }
             }
             function setMailView() {
-                //TODO replacing here while a composer is open is destructive
-                kubeViews.push({item: mailView, replace: true, immediate: true})
+                if (currentItem != mailView) {
+                    kubeViews.replace(null, mailView, Controls2.StackView.Immediate)
+                }
             }
             function setAccountsView() {
-                kubeViews.push({item: accountsView, replace: true, immediate: true})
+                if (currentItem != accountsView) {
+                    kubeViews.replace(null, accountsView, Controls2.StackView.Immediate)
+                }
             }
             function setLogView() {
-                kubeViews.push({item: logView, replace: true, immediate: true})
+                if (currentItem != logView) {
+                    kubeViews.replace(null, logView, Controls2.StackView.Immediate)
+                }
             }
 
             function openComposer(newMessage) {
-                kubeViews.push({item: composerView, immediate: true, properties: {newMessage: newMessage}})
+                kubeViews.push(composerView, {newMessage: newMessage}, Controls2.StackView.Immediate)
             }
             function openComposerWithMail(mail, openAsDraft) {
-                kubeViews.push({item: composerView, immediate: true, properties: {message: mail, loadAsDraft: openAsDraft}})
-            }
-            //Not components so we maintain state
-            MailView {
-                id: mailView
-            }
-            PeopleView {
-                id: peopleView
-            }
-            //Not a component because otherwise we can't log stuff
-            LogView {
-                id: logView
+                kubeViews.push(composerView, {message: mail, loadAsDraft: openAsDraft}, Controls2.StackView.Immediate)
             }
+
+            //These items are not visible until pushed onto the stack, so we keep them in resources instead of items
+            resources: [
+                //Not components so we maintain state
+                MailView {
+                    id: mailView
+                    anchors.fill: parent
+                },
+                PeopleView {
+                    id: peopleView
+                    anchors.fill: parent
+                },
+                //Not a component because otherwise we can't log stuff
+                LogView {
+                    id: logView
+                    anchors.fill: parent
+                }
+            ]
             //A component so it's always destroyed when we're done
             Component {
                 id: composerView
diff --git a/framework/qml/People.qml b/framework/qml/People.qml
index 58aa340c..fc41ceaf 100644
--- a/framework/qml/People.qml
+++ b/framework/qml/People.qml
@@ -44,33 +44,36 @@ Item {
 
         Item {
             id: toolbar
+            anchors {
+                top: parent.top
+                horizontalCenter: parent.horizontalCenter
+            }
 
             height: searchBar.height + Kube.Units.smallSpacing
             width: parent.width
 
-            Controls.ToolButton {
+            Kube.IconButton {
+                anchors {
+                    top: parent.top
+                    left: parent.left
+                    leftMargin: Kube.Units.smallSpacing
+                }
+                visible: stack.depth > 1
                 iconName: Kube.Icons.goBack
-
                 onClicked: stack.pop()
-
-                visible: stack. depth > 1
             }
-
             Kube.TextField {
                 id: searchBar
-
                 anchors.horizontalCenter: parent.horizontalCenter
                 width: parent.width * 0.5
-
                 placeholderText: "Search..."
             }
-
-            Controls.ToolButton {
+            Kube.IconButton {
                 anchors {
+                    top: parent.top
                     right: parent.right
                     rightMargin: Kube.Units.smallSpacing
                 }
-
                 iconName: Kube.Icons.addNew
             }
         }