MOBILE-3325 settings: Move sync site on site settings

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

@@ -12,12 +12,12 @@
         </ion-refresher>
         <core-loading [hideUntil]="loaded">
             <ion-list>
-                 <a  *ngIf="siteInfo" ion-item core-user-link [userId]="siteInfo.userid" text-wrap>
+                 <ion-item *ngIf="siteInfo" text-wrap>
                     <ion-avatar core-user-avatar [user]="siteInfo" item-start></ion-avatar>
                     <h2>{{siteInfo.fullname}}</h2>
                     <ion-note class="core-note-block"><core-format-text [text]="siteName" contextLevel="system" [contextInstanceId]="0" [wsNotFiltered]="true"></core-format-text></ion-note>
                     <ion-note class="core-note-block">{{ siteUrl }}</ion-note>
-                </a>
+                </ion-item>
 
                 <ion-item text-wrap *ngIf="spaceUsage">
                     <ion-icon name="stats" item-start></ion-icon>
@@ -30,10 +30,14 @@
                         <ion-icon name="trash"></ion-icon>
                     </button>
                 </ion-item>
-                <a ion-item (click)="openHandler('CoreSettingsSynchronizationPage')" [title]="'core.settings.synchronization' | translate" [class.core-split-item-selected]="'CoreSettingsSynchronizationPage' == selectedPage" detail-push>
+                <ion-item text-wrap>
                     <ion-icon name="sync" item-start></ion-icon>
-                    <p>{{ 'core.settings.synchronization' | translate }}</p>
-                </a>
+                    <h2>{{ 'core.settings.synchronization' | translate }}</h2>
+                    <button ion-button icon-only clear item-end *ngIf="!isSynchronizing()" (click)="synchronize()" [title]="siteName" [attr.aria-label]="'core.settings.synchronizenow' | translate">
+                        <ion-icon name="sync"></ion-icon>
+                    </button>
+                    <ion-spinner item-end *ngIf="isSynchronizing()"></ion-spinner>
+                </ion-item>
                 <a ion-item *ngIf="isIOS" (click)="openHandler('CoreSharedFilesListPage', {manage: true})" [title]="'core.sharedfiles.sharedfiles' | translate" [class.core-split-item-selected]="'CoreSharedFilesListPage' == selectedPage" detail-push>
                     <ion-icon name="folder" item-start></ion-icon>
                     <p>{{ 'core.sharedfiles.sharedfiles' | translate }}</p>

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

@@ -16,9 +16,11 @@ import { Component, ViewChild } from '@angular/core';
 import { IonicPage, NavParams, Platform } from 'ionic-angular';
 import { CoreSettingsDelegate, CoreSettingsHandlerData } from '../../providers/delegate';
 import { CoreSite } from '@classes/site';
-import { CoreSitesProvider } from '@providers/sites';
-import { CoreSettingsHelper, CoreSiteSpaceUsage } from '../../providers/helper';
+import { CoreEventsProvider } from '@providers/events';
+import { CoreSitesProvider, CoreSiteBasicInfo } from '@providers/sites';
+import { CoreDomUtilsProvider } from '@providers/utils/dom';
 import { CoreSplitViewComponent } from '@components/split-view/split-view';
+import { CoreSettingsHelper, CoreSiteSpaceUsage } from '../../providers/helper';
 
 /**
  * Page that displays the list of site settings pages.
@@ -35,7 +37,7 @@ export class CoreSiteSettingsPage {
     isIOS: boolean;
     selectedPage: string;
     currentSite: CoreSite;
-    siteInfo: any;
+    siteInfo: CoreSiteBasicInfo[] = [];
     siteName: string;
     siteUrl: string;
     spaceUsage: CoreSiteSpaceUsage = {
@@ -43,10 +45,14 @@ export class CoreSiteSettingsPage {
         spaceUsage: 0
     };
     loaded = false;
+     protected sitesObserver: any;
+    protected isDestroyed = false;
 
     constructor(protected settingsDelegate: CoreSettingsDelegate,
             protected settingsHelper: CoreSettingsHelper,
             protected sitesProvider: CoreSitesProvider,
+            protected domUtils: CoreDomUtilsProvider,
+            protected eventsProvider: CoreEventsProvider,
             platorm: Platform,
             navParams: NavParams) {
 
@@ -54,6 +60,11 @@ export class CoreSiteSettingsPage {
 
         this.selectedPage = navParams.get('page') || false;
 
+        this.sitesObserver = this.eventsProvider.on(CoreEventsProvider.SITE_UPDATED, (data) => {
+            if (data.siteId == this.currentSite.id) {
+                this.refreshData();
+            }
+        });
     }
 
     /**
@@ -70,28 +81,54 @@ export class CoreSiteSettingsPage {
     }
 
     /**
-     * View loaded.
+     * Fetch Data.
      */
-    protected async fetchData(): Promise<void> {
+    protected async fetchData(): Promise<void[]> {
+        const promises = [];
+
         this.handlers = this.settingsDelegate.getHandlers();
         this.currentSite = this.sitesProvider.getCurrentSite();
         this.siteInfo = this.currentSite.getInfo();
         this.siteName = this.currentSite.getSiteName();
         this.siteUrl = this.currentSite.getURL();
 
-        return this.settingsHelper.getSiteSpaceUsage(this.sitesProvider.getCurrentSiteId()).then((spaceUsage) => {
+        promises.push(this.settingsHelper.getSiteSpaceUsage(this.sitesProvider.getCurrentSiteId()).then((spaceUsage) => {
             this.spaceUsage = spaceUsage;
+        }));
+
+        return Promise.all(promises);
+    }
+
+    /**
+     * Syncrhonizes the site.
+     */
+    synchronize(siteId: string): void {
+        // Using syncOnlyOnWifi false to force manual sync.
+        this.settingsHelper.synchronizeSite(false, this.currentSite.id).catch((error) => {
+            if (this.isDestroyed) {
+                return;
+            }
+            this.domUtils.showErrorModalDefault(error, 'core.settings.errorsyncsite', true);
         });
     }
 
+    /**
+     * Returns true if site is beeing synchronized.
+     *
+     * @return True if site is beeing synchronized, false otherwise.
+     */
+    isSynchronizing(): boolean {
+        return this.currentSite && !!this.settingsHelper.getSiteSyncPromise(this.currentSite.id);
+    }
+
     /**
      * Refresh the data.
      *
      * @param refresher Refresher.
      */
-    refreshData(refresher: any): void {
+    refreshData(refresher?: any): void {
         this.fetchData().finally(() => {
-            refresher.complete();
+            refresher && refresher.complete();
         });
     }
 
@@ -119,4 +156,11 @@ export class CoreSiteSettingsPage {
         this.splitviewCtrl.push(page, params);
     }
 
+    /**
+     * Page destroyed.
+     */
+    ngOnDestroy(): void {
+        this.isDestroyed = true;
+        this.sitesObserver && this.sitesObserver.off();
+    }
 }

src/core/settings/pages/synchronization/synchronization.ts

@@ -36,11 +36,13 @@ export class CoreSettingsSynchronizationPage implements OnDestroy {
     sitesObserver: any;
     currentSiteId = '';
     syncOnlyOnWifi = false;
-    isDestroyed = false;
+    protected isDestroyed = false;
 
-    constructor(private configProvider: CoreConfigProvider, private eventsProvider: CoreEventsProvider,
-            private sitesProvider: CoreSitesProvider, private domUtils: CoreDomUtilsProvider,
-            private settingsHelper: CoreSettingsHelper) {
+    constructor(protected configProvider: CoreConfigProvider,
+            protected eventsProvider: CoreEventsProvider,
+            protected sitesProvider: CoreSitesProvider,
+            protected domUtils: CoreDomUtilsProvider,
+            protected settingsHelper: CoreSettingsHelper) {
 
         this.currentSiteId = this.sitesProvider.getCurrentSiteId();
 
@@ -85,7 +87,8 @@ export class CoreSettingsSynchronizationPage implements OnDestroy {
      * @param siteId Site ID.
      */
     synchronize(siteId: string): void {
-        this.settingsHelper.synchronizeSite(this.syncOnlyOnWifi, siteId).catch((error) => {
+        // Using syncOnlyOnWifi false to force manual sync.
+        this.settingsHelper.synchronizeSite(false, siteId).catch((error) => {
             if (this.isDestroyed) {
                 return;
             }