Add a pre-load step to the home page

Home page will kick off a migration step to fill in new fields.

wowup-electron/src/app/pages/home/home.component.html

@@ -1,13 +1,15 @@
-<div class="page-container bg-secondary-3" [ngClass]="{ linux: electronService.isLinux }">
+<div *ngIf="appReady === false" class="page-container bg-secondary-3" [ngClass]="{ linux: electronService.isLinux }">
+  <div class="tab-bar-placeholder"></div>
+  <div class="preload-container">
+    <app-progress-spinner [message]="preloadSpinnerKey | translate">
+    </app-progress-spinner>
+  </div>
+</div>
+<div *ngIf="appReady === true" class="page-container bg-secondary-3" [ngClass]="{ linux: electronService.isLinux }">
   <div class="tabs">
-    <mat-tab-group
-      mat-align-tabs="center"
-      animationDuration="0ms"
-      [backgroundColor]="'primary'"
-      [disablePagination]="true"
-      [(selectedIndex)]="selectedIndex"
-      (selectedIndexChange)="onSelectedIndexChange($event)"
-    >
+    <mat-tab-group mat-align-tabs="center" animationDuration="0ms" [backgroundColor]="'primary'"
+      [disablePagination]="true" [(selectedIndex)]="selectedIndex"
+      (selectedIndexChange)="onSelectedIndexChange($event)">
       <mat-tab [disabled]="hasWowClient !== true" [label]="'PAGES.HOME.MY_ADDONS_TAB_TITLE' | translate">
         <app-my-addons [tabIndex]="0"></app-my-addons>
       </mat-tab>
@@ -22,4 +24,4 @@
       </mat-tab>
     </mat-tab-group>
   </div>
-</div>
+</div>

wowup-electron/src/app/pages/home/home.component.scss

@@ -21,3 +21,16 @@
   flex-grow: 1;
   overflow: hidden;
 }
+.preload-container {
+  flex-grow: 1;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  justify-content: center;
+  align-items: center;
+}
+.tab-bar-placeholder {
+  height: 48px;
+  width: 100%;
+  background: $purple-1;
+}

wowup-electron/src/app/pages/home/home.component.ts

@@ -1,7 +1,7 @@
-import { interval, Subscription } from "rxjs";
-import { filter, tap } from "rxjs/operators";
+import { from, interval, Subscription } from "rxjs";
+import { filter, first, switchMap, tap } from "rxjs/operators";
 
-import { AfterViewInit, ChangeDetectionStrategy, Component, OnDestroy } from "@angular/core";
+import { AfterViewInit, ChangeDetectionStrategy, ChangeDetectorRef, Component, NgZone, OnDestroy } from "@angular/core";
 import { TranslateService } from "@ngx-translate/core";
 
 import { AppConfig } from "../../../environments/environment";
@@ -12,6 +12,7 @@ import { WarcraftService } from "../../services/warcraft/warcraft.service";
 import { WowUpService } from "../../services/wowup/wowup.service";
 import { AddonScanError, AddonSyncError, GitHubLimitError } from "../../errors";
 import { MatSnackBar } from "@angular/material/snack-bar";
+import { WowClientType } from "app/models/warcraft/wow-client-type";
 
 @Component({
   selector: "app-home",
@@ -24,6 +25,8 @@ export class HomeComponent implements AfterViewInit, OnDestroy {
 
   public selectedIndex = 0;
   public hasWowClient = false;
+  public appReady = false;
+  public preloadSpinnerKey = "COMMON.PROGRESS_SPINNER.LOADING";
 
   constructor(
     public electronService: ElectronService,
@@ -32,7 +35,8 @@ export class HomeComponent implements AfterViewInit, OnDestroy {
     private _addonService: AddonService,
     private _warcraftService: WarcraftService,
     private _wowupService: WowUpService,
-    private _snackBar: MatSnackBar
+    private _snackBar: MatSnackBar,
+    private _cdRef: ChangeDetectorRef
   ) {
     this._warcraftService.installedClientTypes$.subscribe((clientTypes) => {
       if (clientTypes === undefined) {
@@ -44,6 +48,16 @@ export class HomeComponent implements AfterViewInit, OnDestroy {
       }
     });
 
+    this._warcraftService.installedClientTypes$
+      .pipe(
+        first((clientTypes) => !!clientTypes),
+        switchMap((clientTypes) => from(this.migrateAddons(clientTypes)))
+      )
+      .subscribe(() => {
+        this.appReady = true;
+        this._cdRef.detectChanges();
+      });
+
     this._addonService.syncError$.subscribe(this.onAddonSyncError);
     this._addonService.scanError$.subscribe(this.onAddonScanError);
 
@@ -65,6 +79,29 @@ export class HomeComponent implements AfterViewInit, OnDestroy {
     this._appUpdateInterval.unsubscribe();
   }
 
+  private async migrateAddons(clientTypes: WowClientType[]) {
+    if (!clientTypes || !this._wowupService.shouldMigrateAddons()) {
+      return clientTypes;
+    }
+
+    this.preloadSpinnerKey = "PAGES.HOME.MIGRATING_ADDONS";
+    this._cdRef.detectChanges();
+
+    console.log("Migrating addons");
+
+    try {
+      for (const clientType of clientTypes) {
+        await this._addonService.migrate(clientType);
+      }
+
+      this._wowupService.setMigrationVersion();
+    } catch (e) {
+      console.error(`Failed to migrate addons`, e);
+    }
+
+    return clientTypes;
+  }
+
   onSelectedIndexChange(index: number) {
     this._sessionService.selectedHomeTab = index;
   }

wowup-electron/src/app/pages/my-addons/my-addons.component.ts

@@ -154,15 +154,7 @@ export class MyAddonsComponent implements OnInit, OnDestroy, AfterViewInit {
     public warcraftService: WarcraftService,
     public wowUpService: WowUpService
   ) {
-    _sessionService.selectedHomeTab$.subscribe((tabIndex) => {
-      this.isSelectedTab = tabIndex === this.tabIndex;
-      if (!this.isSelectedTab) {
-        return;
-      }
-
-      this.setPageContextText();
-      this.lazyLoad();
-    });
+    _sessionService.selectedHomeTab$.subscribe(this.onSelectedTabChange);
 
     const addonInstalledSubscription = this.addonService.addonInstalled$.subscribe(this.onAddonInstalledEvent);
 
@@ -192,6 +184,8 @@ export class MyAddonsComponent implements OnInit, OnDestroy, AfterViewInit {
         col.visible = state.visible;
       }
     });
+
+    this.onSelectedTabChange(this._sessionService.getSelectedHomeTab());
   }
 
   public ngOnDestroy(): void {
@@ -205,6 +199,16 @@ export class MyAddonsComponent implements OnInit, OnDestroy, AfterViewInit {
     });
   }
 
+  public onSelectedTabChange = (tabIndex: number) => {
+    this.isSelectedTab = tabIndex === this.tabIndex;
+    if (!this.isSelectedTab) {
+      return;
+    }
+
+    this.setPageContextText();
+    this.lazyLoad();
+  };
+
   // Get the translated value of the provider name (unknown)
   // If the key is returned there's nothing to translate return the normal name
   public getProviderName(viewModel: AddonViewModel) {

wowup-electron/src/app/services/addons/addon.service.ts

@@ -714,6 +714,10 @@ export class AddonService {
     }
   }
 
+  public async getAllAddons(clientType: WowClientType) {
+    return this._addonStorage.getAllForClientType(clientType);
+  }
+
   public async getAddons(clientType: WowClientType, rescan = false): Promise<Addon[]> {
     if (clientType === WowClientType.None) {
       return [];
@@ -837,6 +841,30 @@ export class AddonService {
     }
   }
 
+  public async migrate(clientType: WowClientType) {
+    const existingAddons = await this.getAllAddons(clientType);
+    if (!existingAddons.length) {
+      console.log(`Skipping client type: ${clientType} no addons found`);
+      return;
+    }
+
+    const scannedAddons = await this.scanAddons(clientType);
+    for (const addon of existingAddons) {
+      const scannedAddon = _.find(
+        scannedAddons,
+        (sa) => sa.externalId === addon.externalId && addon.providerName === sa.providerName
+      );
+
+      if (!scannedAddon) {
+        console.log(`No scanned addon found ${addon.name}`);
+        continue;
+      }
+
+      addon.installedExternalReleaseId = scannedAddon.externalLatestReleaseId;
+      this.saveAddon(addon);
+    }
+  }
+
   private async scanAddons(clientType: WowClientType): Promise<Addon[]> {
     if (clientType === WowClientType.None) {
       return [];

wowup-electron/src/app/services/session/session.service.ts

@@ -81,6 +81,10 @@ export class SessionService {
     this._statusTextSrc.next(text);
   }
 
+  public getSelectedHomeTab() {
+    return this._selectedHomeTabSrc.value;
+  }
+
   public set selectedHomeTab(tabIndex: number) {
     this._pageContextTextSrc.next("");
     this._selectedHomeTabSrc.next(tabIndex);

wowup-electron/src/app/services/wowup/wowup.service.ts

@@ -36,6 +36,7 @@ import {
   ALLIANCE_THEME,
   ALLIANCE_LIGHT_THEME,
   DEFAULT_LIGHT_THEME,
+  ADDON_MIGRATION_VERSION_KEY,
 } from "../../../common/constants";
 import { WowClientType } from "../../models/warcraft/wow-client-type";
 import { AddonChannelType } from "../../models/wowup/addon-channel-type";
@@ -321,6 +322,15 @@ export class WowUpService {
     return `${typeName}${DEFAULT_CHANNEL_PREFERENCE_KEY_SUFFIX}`.toLowerCase();
   }
 
+  public shouldMigrateAddons() {
+    const migrateVersion = this._preferenceStorageService.get(ADDON_MIGRATION_VERSION_KEY);
+    return migrateVersion !== this._electronService.getVersionNumber();
+  }
+
+  public setMigrationVersion() {
+    this._preferenceStorageService.set(ADDON_MIGRATION_VERSION_KEY, this._electronService.getVersionNumber());
+  }
+
   public getDefaultAddonChannel(clientType: WowClientType): AddonChannelType {
     const key = this.getClientDefaultAddonChannelKey(clientType);
     const preference = this._preferenceStorageService.findByKey(key);

wowup-electron/src/assets/i18n/de.json

@@ -193,6 +193,7 @@
     "HOME": {
       "ABOUT_TAB_TITLE": "Über WowUp",
       "GET_ADDONS_TAB_TITLE": "Addons installieren",
+      "MIGRATING_ADDONS": "Migrating addons...",
       "MY_ADDONS_TAB_TITLE": "Meine Addons",
       "OPTIONS_TAB_TITLE": "Einstellungen"
     },

wowup-electron/src/assets/i18n/en.json

@@ -193,6 +193,7 @@
     "HOME": {
       "ABOUT_TAB_TITLE": "About",
       "GET_ADDONS_TAB_TITLE": "Get Addons",
+      "MIGRATING_ADDONS": "Migrating addons...",
       "MY_ADDONS_TAB_TITLE": "My Addons",
       "OPTIONS_TAB_TITLE": "Options"
     },

wowup-electron/src/assets/i18n/es.json

@@ -193,6 +193,7 @@
     "HOME": {
       "ABOUT_TAB_TITLE": "Acerca de",
       "GET_ADDONS_TAB_TITLE": "Obtener Addons",
+      "MIGRATING_ADDONS": "Migrating addons...",
       "MY_ADDONS_TAB_TITLE": "Mis Addons",
       "OPTIONS_TAB_TITLE": "Opciones"
     },

wowup-electron/src/assets/i18n/fr.json

@@ -193,6 +193,7 @@
     "HOME": {
       "ABOUT_TAB_TITLE": "À propos de",
       "GET_ADDONS_TAB_TITLE": "Obtenir des Addons",
+      "MIGRATING_ADDONS": "Migrating addons...",
       "MY_ADDONS_TAB_TITLE": "Mes Addons",
       "OPTIONS_TAB_TITLE": "Options"
     },

wowup-electron/src/assets/i18n/it.json

@@ -193,6 +193,7 @@
     "HOME": {
       "ABOUT_TAB_TITLE": "Informazioni",
       "GET_ADDONS_TAB_TITLE": "Ottieni Addons",
+      "MIGRATING_ADDONS": "Migrating addons...",
       "MY_ADDONS_TAB_TITLE": "I Miei Addons",
       "OPTIONS_TAB_TITLE": "Opzioni"
     },

wowup-electron/src/assets/i18n/ko.json

@@ -193,6 +193,7 @@
     "HOME": {
       "ABOUT_TAB_TITLE": "프로그램 소개",
       "GET_ADDONS_TAB_TITLE": "애드온 찾기",
+      "MIGRATING_ADDONS": "Migrating addons...",
       "MY_ADDONS_TAB_TITLE": "내 애드온",
       "OPTIONS_TAB_TITLE": "설정"
     },

wowup-electron/src/assets/i18n/nb.json

@@ -193,6 +193,7 @@
     "HOME": {
       "ABOUT_TAB_TITLE": "Om",
       "GET_ADDONS_TAB_TITLE": "Få Utvidelser",
+      "MIGRATING_ADDONS": "Migrating addons...",
       "MY_ADDONS_TAB_TITLE": "Mine Utvidelser",
       "OPTIONS_TAB_TITLE": "Alternativer"
     },

wowup-electron/src/assets/i18n/pt.json

@@ -193,6 +193,7 @@
     "HOME": {
       "ABOUT_TAB_TITLE": "Sobre",
       "GET_ADDONS_TAB_TITLE": "Obtenha Addons",
+      "MIGRATING_ADDONS": "Migrating addons...",
       "MY_ADDONS_TAB_TITLE": "Meus Addons",
       "OPTIONS_TAB_TITLE": "Opções"
     },

wowup-electron/src/assets/i18n/ru.json

@@ -193,6 +193,7 @@
     "HOME": {
       "ABOUT_TAB_TITLE": "О программе",
       "GET_ADDONS_TAB_TITLE": "Получить модификации",
+      "MIGRATING_ADDONS": "Migrating addons...",
       "MY_ADDONS_TAB_TITLE": "Мои модификации",
       "OPTIONS_TAB_TITLE": "Настройки"
     },

wowup-electron/src/assets/i18n/zh-TW.json

@@ -193,6 +193,7 @@
     "HOME": {
       "ABOUT_TAB_TITLE": "關於",
       "GET_ADDONS_TAB_TITLE": "獲取插件",
+      "MIGRATING_ADDONS": "Migrating addons...",
       "MY_ADDONS_TAB_TITLE": "我的插件",
       "OPTIONS_TAB_TITLE": "選項"
     },

wowup-electron/src/assets/i18n/zh.json

@@ -193,6 +193,7 @@
     "HOME": {
       "ABOUT_TAB_TITLE": "关于",
       "GET_ADDONS_TAB_TITLE": "获取插件",
+      "MIGRATING_ADDONS": "Migrating addons...",
       "MY_ADDONS_TAB_TITLE": "我的插件",
       "OPTIONS_TAB_TITLE": "选项"
     },

wowup-electron/src/common/constants.ts

@@ -58,6 +58,7 @@ export const TELEMETRY_ENABLED_KEY = "telemetry_enabled";
 export const BLIZZARD_AGENT_PATH_KEY = "blizzard_agent_path";
 export const ZOOM_FACTOR_KEY = "zoom_factor";
 export const SELECTED_DETAILS_TAB_KEY = "selected_details_tab";
+export const ADDON_MIGRATION_VERSION_KEY = "addon_migration_version";
 
 // APP UPDATER
 export const APP_UPDATE_ERROR = "app-update-error";