MOBILE-4245 Dev: Add confirmation modal before reload app

src/core/features/settings/pages/dev/dev.html

@@ -30,11 +30,11 @@
             </ion-label>
             <ion-toggle [(ngModel)]="forceSafeAreaMargins" (ionChange)="safeAreaChanged()"></ion-toggle>
         </ion-item>
-        <ion-item class="ion-text-wrap" *ngIf="stagingSites.length">
+        <ion-item class="ion-text-wrap" *ngIf="stagingSitesCount && enableStagingSites !== undefined">
             <ion-label>
-                <h2>Enable staging sites</h2>
+                <h2>Enable staging sites ({{stagingSitesCount}})</h2>
             </ion-label>
-            <ion-toggle [(ngModel)]="enableStagingSites" (ionChange)="setEnabledStagingSites()"></ion-toggle>
+            <ion-toggle [checked]="enableStagingSites" (ionChange)="setEnabledStagingSites($event.detail.checked)"></ion-toggle>
         </ion-item>
         <ng-container *ngIf="siteId">
             <ion-item class="ion-text-wrap">

src/core/features/settings/pages/dev/dev.ts

@@ -14,13 +14,13 @@
 
 import { CoreConstants } from '@/core/constants';
 import { Component, OnInit } from '@angular/core';
-import { CoreLoginHelperProvider } from '@features/login/services/login-helper';
+import { CoreLoginHelper, CoreLoginHelperProvider } from '@features/login/services/login-helper';
 import { CoreSettingsHelper } from '@features/settings/services/settings-helper';
 import { CoreSitePlugins } from '@features/siteplugins/services/siteplugins';
 import { CoreUserTours } from '@features/usertours/services/user-tours';
 import { CoreConfig } from '@services/config';
 import { CorePlatform } from '@services/platform';
-import { CoreLoginSiteInfo, CoreSites } from '@services/sites';
+import { CoreSites } from '@services/sites';
 import { CoreDomUtils } from '@services/utils/dom';
 import { CoreUtils } from '@services/utils/utils';
 
@@ -43,8 +43,8 @@ export class CoreSettingsDevPage implements OnInit {
     pluginStylesCount = 0;
     sitePlugins: CoreSitePluginsBasicInfo[] = [];
     userToursEnabled = true;
-    stagingSites: CoreLoginSiteInfo[] = [];
-    enableStagingSites = false;
+    stagingSitesCount = 0;
+    enableStagingSites?: boolean;
 
     disabledFeatures: string[] = [];
 
@@ -59,9 +59,9 @@ export class CoreSettingsDevPage implements OnInit {
 
         this.siteId = CoreSites.getCurrentSite()?.getId();
 
-        this.stagingSites = CoreConstants.CONFIG.stagingsites;
+        this.stagingSitesCount = CoreConstants.CONFIG.sites.filter((site) => site.staging).length;
 
-        if (this.stagingSites.length) {
+        if (this.stagingSitesCount) {
             this.enableStagingSites = await CoreSettingsHelper.hasEnabledStagingSites();
         }
 
@@ -167,8 +167,8 @@ export class CoreSettingsDevPage implements OnInit {
         CoreDomUtils.showToast('User tours have been reseted');
     }
 
-    async setEnabledStagingSites(): Promise<void> {
-        await CoreSettingsHelper.setEnabledStagingSites(this.enableStagingSites);
+    async setEnabledStagingSites(enabled: boolean): Promise<void> {
+        await CoreSettingsHelper.setEnabledStagingSites(enabled);
     }
 
 }

src/core/features/settings/services/settings-helper.ts

@@ -30,6 +30,7 @@ import { makeSingleton, Translate } from '@singletons';
 import { CoreError } from '@classes/errors/error';
 import { Observable, Subject } from 'rxjs';
 import { CoreTextUtils } from '@services/utils/text';
+import { CoreNavigator } from '@services/navigator';
 
 /**
  * Object with space usage and cache entries that can be erased.
@@ -477,15 +478,32 @@ export class CoreSettingsHelperProvider {
         return this.darkModeObservable;
     }
 
+    /**
+     * Get if user enabled staging sites or not.
+     *
+     * @returns Staging sites.
+     */
     async hasEnabledStagingSites(): Promise<boolean> {
-        const staging = await CoreConfig.get<string>('staging_sites', 'false');
+        const staging = await CoreConfig.get<number>('stagingSites', 0);
 
-        return CoreUtils.isTrueOrOne(staging);
+        return !!staging;
     }
 
+    /**
+     * Persist staging sites enabled status and refresh app to apply changes.
+     *
+     * @param enabled Enabled or disabled staging sites.
+     */
     async setEnabledStagingSites(enabled: boolean): Promise<void> {
-        await CoreConfig.set('staging_sites', `${enabled}`);
-        CoreEvents.trigger(CoreEvents.STAGING_SITES_CHANGE, { enabled });
+        try {
+            await CoreConfig.set('stagingSites', enabled ? 1 : 0);
+            await CoreDomUtils.showConfirm('Are you sure that you want to enable/disable staging sites?');
+        } catch {
+            return;
+        }
+
+        await CoreNavigator.navigate('/');
+        window.location.reload();
     }
 
 }