chore(AppMain): use Loaders more aggressively, unloading any previous unused section

- another bit on the road to reduce startup time and be more conservative
towards RAM usage
- remove more imperative JS code
- only preload/prepare the currently active community, not all of them on
startup

Fixes #8782

ui/app/mainui/AppMain.qml

@@ -67,11 +67,11 @@ Item {
             keycardPopup.active = false
         }
 
-        function onMailserverNotWorking() {
+        onMailserverNotWorking: {
             Global.openPopup(mailserverNotWorkingPopupComponent)
         }
 
-        function onActiveSectionChanged() {
+        onActiveSectionChanged: {
             createChatView.opened = false
         }
     }
@@ -91,9 +91,8 @@ Item {
     Connections {
         target: Global
         onOpenLinkInBrowser: {
-            if (!browserLayoutContainer.active)
+            changeAppSectionBySectionId(Constants.appSection.browser)
-                browserLayoutContainer.active = true;
+            Qt.callLater(() => browserLayoutContainer.item.openUrlInNewTab(link));
-            browserLayoutContainer.item.openUrlInNewTab(link);
         }
         onOpenChooseBrowserPopup: {
             Global.openPopup(chooseBrowserPopupComponent, {link: link});
@@ -402,17 +401,17 @@ Item {
                     changeAppSectionBySectionId(model.id)
                 }
 
-                popupMenu: StatusMenu {
+                popupMenu: Component {
+                    StatusMenu {
                         id: communityContextMenu
 
                         property var chatCommunitySectionModule
 
                         openHandler: function () {
-                        // // we cannot return QVariant if we pass another parameter in a function call
+                            // we cannot return QVariant if we pass another parameter in a function call
-                        // // that's why we're using it this way
+                            // that's why we're using it this way
                             appMain.rootStore.mainModuleInst.prepareCommunitySectionModuleForCommunityId(model.id)
                             communityContextMenu.chatCommunitySectionModule = appMain.rootStore.mainModuleInst.getCommunitySectionModule()
-
                         }
 
                         StatusAction {
@@ -446,6 +445,7 @@ Item {
                         }
                     }
                 }
+            }
 
             regularItemsModel: SortFilterProxyModel {
                 sourceModel: appMain.rootStore.mainModuleInst.sectionsModel
@@ -803,20 +803,16 @@ Item {
                         if (activeSectionType === Constants.appSection.chat)
                             return Constants.appViewStackIndex.chat
                         if (activeSectionType === Constants.appSection.community) {
-
+                            for (let i = this.children.length - 1; i >=0; i--) {
-                            for(let i = this.children.length - 1; i >=0; i--)
-                            {
                                 var obj = this.children[i]
-                                if (obj && obj.sectionId && obj.sectionId === appMain.rootStore.mainModuleInst.activeSection.id)
+                                if (obj && obj.sectionId && obj.sectionId === appMain.rootStore.mainModuleInst.activeSection.id) {
-                                {
-                                    obj.active = true
                                     return i
                                 }
                             }
 
                             // Should never be here, correct index must be returned from the for loop above
-                            console.error("Wrong section type: ", appMain.rootStore.mainModuleInst.activeSection.sectionType,
+                            console.error("Wrong section type:", appMain.rootStore.mainModuleInst.activeSection.sectionType,
-                                        " or section id: ", appMain.rootStore.mainModuleInst.activeSection.id)
+                                          "or section id: ", appMain.rootStore.mainModuleInst.activeSection.id)
                             return Constants.appViewStackIndex.community
                         }
                         if (activeSectionType === Constants.appSection.communitiesPortal)
@@ -834,35 +830,6 @@ Item {
                         console.error("AppMain: Unknown section type")
                     }
 
-                    onCurrentIndexChanged: {
-                        var obj = this.children[currentIndex]
-                        if (!obj)
-                            return
-
-                        createChatView.opened = false
-
-                        if (obj === browserLayoutContainer && browserLayoutContainer.active == false) {
-                            browserLayoutContainer.active = true;
-                        }
-
-                        if (obj === walletLayoutContainer && !walletLayoutContainer.active) {
-                            walletLayoutContainer.active = true
-                            walletLayoutContainer.item.showSigningPhrasePopup()
-                        }
-
-                        if (obj === profileLayoutContainer && !profileLayoutContainer.active) {
-                            profileLayoutContainer.active = true
-                        }
-
-                        if (obj === nodeLayoutContainer && !nodeLayoutContainer.active) {
-                            nodeLayoutContainer.active = true
-                        }
-
-                        if (obj.onActivated && typeof obj.onActivated === "function") {
-                            this.children[currentIndex].onActivated()
-                        }
-                    }
-
                     // NOTE:
                     // If we ever change stack layout component order we need to updade
                     // Constants.appViewStackIndex accordingly
@@ -903,8 +870,7 @@ Item {
                     }
 
                     Loader {
-                        id: walletLayoutContainer
+                        active: appView.currentIndex === Constants.appViewStackIndex.wallet
-                        active: false
                         asynchronous: true
                         sourceComponent: WalletLayout {
                             store: appMain.rootStore
@@ -912,11 +878,12 @@ Item {
                             emojiPopup: statusEmojiPopup
                             sendModalPopup: sendModal
                         }
+                        onLoaded: item.showSigningPhrasePopup()
                     }
 
                     Loader {
                         id: browserLayoutContainer
-                        active: false
+                        active: appView.currentIndex === Constants.appViewStackIndex.browser
                         asynchronous: true
                         sourceComponent: BrowserLayout {
                             globalStore: appMain.rootStore
@@ -934,8 +901,7 @@ Item {
                     }
 
                     Loader {
-                        id: profileLayoutContainer
+                        active: appView.currentIndex === Constants.appViewStackIndex.profile
-                        active: false
                         asynchronous: true
                         sourceComponent: ProfileLayout {
                             store: appMain.rootStore.profileSectionStore
@@ -946,8 +912,7 @@ Item {
                     }
 
                     Loader {
-                        id: nodeLayoutContainer
+                        active: appView.currentIndex === Constants.appViewStackIndex.node
-                        active: false
                         asynchronous: true
                         sourceComponent: NodeLayout {}
                     }
@@ -961,8 +926,8 @@ Item {
                                 roleValue: Constants.appSection.community
 
                                 delegate: Loader {
-                                    property string sectionId: model.id
+                                    readonly property string sectionId: model.id
-                                    active: false
+                                    active: sectionId === appMain.rootStore.mainModuleInst.activeSection.id
                                     asynchronous: true
                                     Layout.fillWidth: true
                                     Layout.alignment: Qt.AlignLeft | Qt.AlignTop