MOBILE-3954 storage: Move space usage from preferences

src/addons/storagemanager/pages/courses-storage/courses-storage.html

@@ -10,12 +10,31 @@
 </ion-header>
 <ion-content>
     <core-loading [hideUntil]="loaded">
+
+        <ion-card>
+            <ion-item class="ion-text-wrap">
+                <ion-label>{{ 'addon.storagemanager.info' | translate }}</ion-label>
+            </ion-item>
+            <ion-item class="ion-text-wrap" *ngIf="spaceUsage">
+                <ion-label>
+                    <p class="item-heading ion-text-wrap">{{ 'core.settings.spaceusage' | translate }}</p>
+                    <ion-badge color="light" *ngIf="spaceUsage.spaceUsage">{{ spaceUsage.spaceUsage | coreBytesToSize }}</ion-badge>
+                    <p>
+                        {{ 'core.settings.spaceusagehelp' | translate }}
+                    </p>
+                </ion-label>
+                <ion-button fill="clear" color="danger" slot="end" (click)="deleteSiteStorage()"
+                    [hidden]="spaceUsage.spaceUsage! + spaceUsage.cacheEntries! <= 0"
+                    [attr.aria-label]="'core.settings.deletesitefilestitle' | translate">
+                    <ion-icon name="fas-trash" slot="icon-only" aria-hidden="true"></ion-icon>
+                </ion-button>
+            </ion-item>
+        </ion-card>
+
         <ion-card>
             <ion-card-header>
-                <p class="ion-text-wrap">{{ 'addon.storagemanager.info' | translate }}</p>
                 <ion-card-title class="ion-text-wrap">{{ 'core.courses.courses' | translate }}</ion-card-title>
                 <ion-item class="size ion-text-wrap ion-no-padding" lines="none">
-                    <ion-icon name="fas-archive" slot="start" aria-hidden="true"></ion-icon>
                     <ion-label>
                         <h2 class="ion-text-wrap">{{ 'addon.storagemanager.storageused' | translate }}</h2>
                         <ion-badge color="light">{{ totalSize | coreBytesToSize }}</ion-badge>
@@ -28,10 +47,11 @@
                 </ion-item>
             </ion-card-header>
         </ion-card>
+
         <ion-card *ngIf="downloadedCourses.length">
             <ion-card-content class="ion-no-padding">
                 <ion-list>
-                    <ion-item *ngFor="let course of downloadedCourses" class="course" (click)="openCourse(course.id)" button>
+                    <ion-item *ngFor="let course of downloadedCourses" class="course" (click)="openCourse(course.id, course.title)" button>
                         <ion-label class="ion-text-wrap">
                             <p class="item-heading">{{ course.title }}</p>
                             <p class="item-heading item-heading-secondary" *ngIf="course.isDownloading">

src/addons/storagemanager/pages/courses-storage/courses-storage.ts

@@ -18,6 +18,7 @@ import { CoreCourse, CoreCourseProvider } from '@features/course/services/course
 import { CoreCourseHelper } from '@features/course/services/course-helper';
 import { CoreCourseModulePrefetchDelegate } from '@features/course/services/module-prefetch-delegate';
 import { CoreCourses, CoreEnrolledCourseData } from '@features/courses/services/courses';
+import { CoreSettingsHelper, CoreSiteSpaceUsage } from '@features/settings/services/settings-helper';
 import { CoreSiteHome } from '@features/sitehome/services/sitehome';
 import { CoreNavigator } from '@services/navigator';
 import { CoreSites } from '@services/sites';
@@ -41,8 +42,17 @@ export class AddonStorageManagerCoursesStoragePage implements OnInit, OnDestroy
     completelyDownloadedCourses: DownloadedCourse[] = [];
     totalSize = 0;
     loaded = false;
+    spaceUsage: CoreSiteSpaceUsage = {
+        cacheEntries: 0,
+        spaceUsage: 0,
+    };
 
     courseStatusObserver?: CoreEventObserver;
+    siteId: string;
+
+    constructor() {
+        this.siteId = CoreSites.getCurrentSiteId();
+    }
 
     /**
      * @inheritdoc
@@ -77,6 +87,8 @@ export class AddonStorageManagerCoursesStoragePage implements OnInit, OnDestroy
             }
         }
 
+        this.spaceUsage = await CoreSettingsHelper.getSiteSpaceUsage(this.siteId);
+
         this.setDownloadedCourses(downloadedCourses);
 
         this.loaded = true;
@@ -227,6 +239,21 @@ export class AddonStorageManagerCoursesStoragePage implements OnInit, OnDestroy
         CoreNavigator.navigateToSitePath('/storage/' + courseId, { params: { title } });
     }
 
+    /**
+     * Deletes files of a site and the tables that can be cleared.
+     *
+     * @param siteData Site object with space usage.
+     */
+    async deleteSiteStorage(): Promise<void> {
+        try {
+            const siteName = CoreSites.getRequiredCurrentSite().getSiteName();
+
+            this.spaceUsage = await CoreSettingsHelper.deleteSiteStorage(siteName, this.siteId);
+        } catch {
+            // Ignore cancelled confirmation modal.
+        }
+    }
+
 }
 
 /**

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

@@ -27,28 +27,15 @@
                     </ion-label>
                 </ion-item>
             </ion-list>
+
             <ion-card>
-                <ion-item class="ion-text-wrap" *ngIf="spaceUsage">
-                    <ion-label>
-                        <p class="item-heading ion-text-wrap">{{ 'core.settings.spaceusage' | translate }}</p>
-                        <p *ngIf="spaceUsage.spaceUsage">{{ spaceUsage.spaceUsage | coreBytesToSize }}</p>
-                    </ion-label>
-                    <ion-button fill="clear" [attr.aria-label]="'core.info' | translate" (click)="showSpaceInfo()" slot="end">
-                        <ion-icon name="fas-info-circle" color="info" slot="icon-only"></ion-icon>
-                    </ion-button>
-                    <ion-button fill="clear" color="danger" slot="end" (click)="deleteSiteStorage()"
-                        [hidden]="spaceUsage.spaceUsage! + spaceUsage.cacheEntries! <= 0"
-                        [attr.aria-label]="'core.settings.deletesitefilestitle' | translate">
-                        <ion-icon name="fas-trash" slot="icon-only" aria-hidden="true"></ion-icon>
-                    </ion-button>
-                </ion-item>
                 <ion-item class="ion-text-wrap">
                     <ion-label>
                         <p class="item-heading">{{ 'core.settings.synchronizenow' | translate }}</p>
+                        <p>
+                            {{ 'core.settings.synchronizenowhelp' | translate }}
+                        </p>
                     </ion-label>
-                    <ion-button fill="clear" [attr.aria-label]="'core.info' | translate" (click)="showSyncInfo()" slot="end">
-                        <ion-icon name="fas-info-circle" color="info" slot="icon-only"></ion-icon>
-                    </ion-button>
                     <core-button-with-spinner [loading]="isSynchronizing()" slot="end">
                         <ion-button fill="clear" (click)="synchronize()" [attr.aria-label]="'core.settings.synchronizenow' | translate">
                             <ion-icon name="fas-sync-alt" slot="icon-only" aria-hidden="true"></ion-icon>

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

@@ -18,15 +18,13 @@ import { IonRefresher } from '@ionic/angular';
 import { CoreSettingsHandlerToDisplay } from '../../services/settings-delegate';
 import { CoreEventObserver, CoreEvents } from '@singletons/events';
 import { CoreSites } from '@services/sites';
-import { CoreDomUtils } from '@services/utils/dom';
-import { CoreSettingsHelper, CoreSiteSpaceUsage } from '../../services/settings-helper';
-import { CoreApp } from '@services/app';
-import { Translate } from '@singletons';
 import { CoreNavigator } from '@services/navigator';
 import { CoreSplitViewComponent } from '@components/split-view/split-view';
 import { CoreListItemsManager } from '@classes/items-management/list-items-manager';
 import { CoreRoutedItemsManagerSourcesTracker } from '@classes/items-management/routed-items-manager-sources-tracker';
 import { CoreSettingsHandlersSource } from '@features/settings/classes/settings-handlers-source';
+import { CoreSettingsHelper } from '@features/settings/services/settings-helper';
+import { CoreDomUtils } from '@services/utils/dom';
 
 /**
  * Page that displays the list of site settings pages.
@@ -41,18 +39,11 @@ export class CoreSitePreferencesPage implements AfterViewInit, OnDestroy {
 
     handlers: CoreListItemsManager<CoreSettingsHandlerToDisplay>;
 
-    isIOS: boolean;
+    protected siteId: string;
-    siteId: string;
-    spaceUsage: CoreSiteSpaceUsage = {
-        cacheEntries: 0,
-        spaceUsage: 0,
-    };
-
     protected sitesObserver: CoreEventObserver;
     protected isDestroyed = false;
 
     constructor() {
-        this.isIOS = CoreApp.isIOS();
         this.siteId = CoreSites.getCurrentSiteId();
 
         const source = CoreRoutedItemsManagerSourcesTracker.getOrCreateSource(CoreSettingsHandlersSource, []);
@@ -90,8 +81,6 @@ export class CoreSitePreferencesPage implements AfterViewInit, OnDestroy {
      */
     protected async fetchData(): Promise<void> {
         await this.handlers.load();
-
-        this.spaceUsage = await CoreSettingsHelper.getSiteSpaceUsage(this.siteId);
     }
 
     /**
@@ -131,41 +120,6 @@ export class CoreSitePreferencesPage implements AfterViewInit, OnDestroy {
         });
     }
 
-    /**
-     * Deletes files of a site and the tables that can be cleared.
-     *
-     * @param siteData Site object with space usage.
-     */
-    async deleteSiteStorage(): Promise<void> {
-        try {
-            const siteName = CoreSites.getRequiredCurrentSite().getSiteName();
-
-            this.spaceUsage = await CoreSettingsHelper.deleteSiteStorage(siteName, this.siteId);
-        } catch {
-            // Ignore cancelled confirmation modal.
-        }
-    }
-
-    /**
-     * Show information about space usage actions.
-     */
-    showSpaceInfo(): void {
-        CoreDomUtils.showAlert(
-            Translate.instant('core.help'),
-            Translate.instant('core.settings.spaceusagehelp'),
-        );
-    }
-
-    /**
-     * Show information about sync actions.
-     */
-    showSyncInfo(): void {
-        CoreDomUtils.showAlert(
-            Translate.instant('core.help'),
-            Translate.instant('core.settings.synchronizenowhelp'),
-        );
-    }
-
     /**
      * Page destroyed.
      */