refactor: adjust code after upgrade of ionic from v4 to v5

Note: used observables instead of events service which
doesn't exist in ionic 5 anymore.

Dockerfile

@@ -9,7 +9,7 @@ LABEL version="2.0.0" \
 ENV	ANDROID_APIS="android-26" \
   ANDROID_BUILD_TOOLS_VERSION="26.0.2" \
   NPM_VERSION="latest" \
-  IONIC_VERSION="^4.0.0" \
+  IONIC_VERSION="^5.0.0" \
   CORDOVA_VERSION="^8.0.0" \
   ### Configure download URLs
   ANDROID_SDK_TOOLS_DOWNLOAD_URL="https://dl.google.com/android/repository/sdk-tools-linux-3859397.zip" \

package.json

@@ -7,7 +7,8 @@
   "author": "Karl-Philipp Wulfert <krlwlfrt@gmail.com>",
   "contributors": [
     "Jovan Krunić <jovan.krunic@gmail.com>",
-    "Sebastian Lange <sebastianlange87@gmail.com>"
+    "Sebastian Lange <sebastianlange87@gmail.com>",
+    "Rainer Killinger <mail-openstapps@killinger.co>"
   ],
   "scripts": {
     "build": "ng build",
@@ -40,16 +41,16 @@
     "@angular/platform-browser": "9.1.12",
     "@angular/platform-browser-dynamic": "9.1.12",
     "@angular/router": "9.1.12",
-    "@ionic-native/core": "5.4.0",
+    "@ionic-native/core": "5.29.0",
-    "@ionic-native/geolocation": "5.4.0",
+    "@ionic-native/geolocation": "5.29.0",
-    "@ionic-native/splash-screen": "5.4.0",
+    "@ionic-native/splash-screen": "5.29.0",
-    "@ionic-native/status-bar": "5.4.0",
+    "@ionic-native/status-bar": "5.29.0",
     "@ionic/angular": "5.4.1",
     "@ionic/storage": "2.2.0",
     "@ngx-translate/core": "11.0.1",
     "@ngx-translate/http-loader": "4.0.0",
     "@openstapps/api": "0.22.0",
-    "@openstapps/configuration": "0.22.0",
+    "@openstapps/configuration": "0.25.0",
     "@openstapps/core": "0.36.0",
     "@openstapps/logger": "0.4.0",
     "cordova-android": "8.0.0",
@@ -68,12 +69,12 @@
     "ngx-markdown": "9.1.1",
     "ngx-moment": "3.4.0",
     "rxjs": "6.6.3",
-    "tslib": "^1.10.0",
+    "tslib": "1.14.1",
-    "zone.js": "~0.10.2"
+    "zone.js": "0.11.2"
   },
   "devDependencies": {
     "@angular-devkit/architect": "0.13.10",
-    "@angular-devkit/build-angular": "~0.901.12",
+    "@angular-devkit/build-angular": "0.901.12",
     "@angular-devkit/core": "9.1.12",
     "@angular-devkit/schematics": "9.1.12",
     "@angular/cli": "9.1.12",
@@ -86,8 +87,8 @@
     "@types/form-data": "2.5.0",
     "@types/jasmine": "3.3.12",
     "@types/jasminewd2": "2.0.6",
-    "@types/node": "^12.11.1",
+    "@types/node": "10.17.44",
-    "codelyzer": "^5.1.2",
+    "codelyzer": "5.1.2",
     "conventional-changelog-cli": "2.0.12",
     "is-docker": "1.1.0",
     "jasmine-core": "3.5.0",
@@ -101,7 +102,7 @@
     "protractor": "5.4.2",
     "surge": "0.21.3",
     "ts-node": "8.0.3",
-    "tslint": "5.15.0",
+    "tslint": "6.1.3",
     "typescript": "3.8.3"
   },
   "cordova": {

src/app/modules/data/data.module.ts

@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2018, 2019 StApps
+ * Copyright (C) 2018, 2019, 2020 StApps
  * This program is free software: you can redistribute it and/or modify it
  * under the terms of the GNU General Public License as published by the Free
  * Software Foundation, version 3.
@@ -16,7 +16,7 @@ import {CommonModule} from '@angular/common';
 import {HttpClientModule} from '@angular/common/http';
 import {NgModule} from '@angular/core';
 import {FormsModule} from '@angular/forms';
-import {Events, IonicModule} from '@ionic/angular';
+import {IonicModule} from '@ionic/angular';
 import {TranslateModule} from '@ngx-translate/core';
 import {MarkdownModule} from 'ngx-markdown';
 import {MomentModule} from 'ngx-moment';
@@ -129,7 +129,6 @@ import {VideoListItem} from './types/video/video-list-item.component';
   providers: [
     DataProvider,
     DataFacetsProvider,
-    Events,
     StAppsWebHttpClient,
   ],
 })

src/app/modules/data/list/data-list.component.ts

@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2018, 2019 StApps
+ * Copyright (C) 2018, 2019, 2020 StApps
  * This program is free software: you can redistribute it and/or modify it
  * under the terms of the GNU General Public License as published by the Free
  * Software Foundation, version 3.
@@ -13,20 +13,19 @@
  * this program. If not, see <https://www.gnu.org/licenses/>.
  */
 import {Component, OnInit} from '@angular/core';
-import {AlertController, Events} from '@ionic/angular';
+import {AlertController} from '@ionic/angular';
 import {
   SCFacet,
   SCSearchFilter,
   SCSearchQuery,
   SCSearchSort,
-  SCSettingValue,
-  SCSettingValues,
   SCThing,
 } from '@openstapps/core';
 import {Logger} from '@openstapps/logger';
 import {Subject} from 'rxjs';
 import {debounceTime, distinctUntilChanged} from 'rxjs/operators';
 import {MenuService} from '../../menu/menu.service';
+import {SettingsProvider} from '../../settings/settings.provider';
 import {DataProvider} from '../data.provider';
 
 /**
@@ -82,14 +81,13 @@ export class DataListComponent implements OnInit {
    *
    * @param alertController AlertController
    * @param dataProvider DataProvider
-   * @param events Events
    * @param menuService MenuService
    */
   constructor(
     private readonly alertController: AlertController,
     private dataProvider: DataProvider,
-    private readonly events: Events,
     private readonly menuService: MenuService,
+    private readonly settingsProvider: SettingsProvider,
   ) {
     this.queryTextChanged
       .pipe(
@@ -115,10 +113,12 @@ export class DataListComponent implements OnInit {
     /**
      * Subscribe to 'settings.changed' events
      */
-    this.events.subscribe('stapps.settings.changed',
+    this.settingsProvider.settingsActionChanged$.subscribe(({type, payload}) => {
-      (category: string, name: string, value: SCSettingValue | SCSettingValues) => {
+        if (type === 'stapps.settings.changed') {
-        Logger.log(`received event "settings.changed" with category:
+          const {category, name, value} = payload!;
-         ${category}, name: ${name}, value: ${JSON.stringify(value)}`);
+          Logger.log(`received event "settings.changed" with category:
+            ${category}, name: ${name}, value: ${JSON.stringify(value)}`);
+        }
       },
     );
   }

src/app/modules/settings/settings.module.ts

@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2018, 2019 StApps
+ * Copyright (C) 2018, 2019, 2020 StApps
  * This program is free software: you can redistribute it and/or modify it
  * under the terms of the GNU General Public License as published by the Free
  * Software Foundation, version 3.
@@ -17,7 +17,7 @@ import {NgModule} from '@angular/core';
 import {FormsModule} from '@angular/forms';
 import {RouterModule, Routes} from '@angular/router';
 import {Geolocation} from '@ionic-native/geolocation/ngx';
-import {Events, IonicModule} from '@ionic/angular';
+import {IonicModule} from '@ionic/angular';
 import {TranslateModule} from '@ngx-translate/core';
 
 import {ConfigProvider} from '../config/config.provider';
@@ -49,7 +49,6 @@ const settingsRoutes: Routes = [
   ],
   providers: [
     ConfigProvider,
-    Events,
     Geolocation,
     SettingsProvider,
   ],

src/app/modules/settings/settings.provider.ts

@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2019 StApps
+ * Copyright (C) 2019, 2020 StApps
  * This program is free software: you can redistribute it and/or modify it
  * under the terms of the GNU General Public License as published by the Free
  * Software Foundation, version 3.
@@ -14,13 +14,13 @@
  */
 import {Injectable} from '@angular/core';
 import {Geolocation} from '@ionic-native/geolocation/ngx';
-import {Events} from '@ionic/angular';
 import {
   SCSetting,
   SCSettingValue,
   SCSettingValues,
 } from '@openstapps/core';
 import deepMerge from 'deepmerge';
+import {Subject} from 'rxjs';
 import {ConfigProvider} from '../config/config.provider';
 import {StorageProvider} from '../storage/storage.provider';
 
@@ -63,11 +63,43 @@ export interface SettingValueContainer {
   [key: string]: SCSettingValue | SCSettingValue[] | undefined;
 }
 
+/**
+ * Structure of the settings events
+ */
+export interface SettingsAction {
+  /**
+   * Data related to the action
+   */
+  payload?: {
+    /**
+     * Setting category
+     */
+    category: string;
+    /**
+     * Setting name
+     */
+    name: string;
+    /**
+     * Setting value
+     */
+    value: SCSettingValue | SCSettingValues;
+  };
+
+  /**
+   * Type of the settings action
+   */
+  type: string;
+}
+
 /**
  * Provider for app settings
  */
 @Injectable()
 export class SettingsProvider {
+  /**
+   * Source of settings actions
+   */
+  private settingsActionSource = new Subject<SettingsAction>();
   /**
    * Order of the setting categories
    */
@@ -76,6 +108,10 @@ export class SettingsProvider {
    * Is provider initialized
    */
   initialized = false;
+  /**
+   * Settings actions observable
+   */
+  settingsActionChanged$ = this.settingsActionSource.asObservable();
   /**
    * Cache for the imported settings
    */
@@ -165,12 +201,10 @@ export class SettingsProvider {
    * @param storage TODO
    * @param configProvider TODO
    * @param geoLocation TODO
-   * @param events TODO
    */
   constructor(private readonly storage: StorageProvider,
               private readonly configProvider: ConfigProvider,
-              private readonly geoLocation: Geolocation,
+              private readonly geoLocation: Geolocation) {
-              private readonly events: Events) {
     this.categoriesOrder = [];
     this.settingsCache = {};
   }
@@ -251,7 +285,7 @@ export class SettingsProvider {
     }
     this.initialized = true;
     // publish provider initialised
-    this.events.publish('stapps.settings.initialised');
+    this.settingsActionSource.next({type: 'stapps.settings.initialized'});
   }
 
   /**
@@ -435,7 +469,7 @@ export class SettingsProvider {
         this.settingsCache[category].settings[name].value = value;
         await this.saveSettingValues();
         // publish setting changes
-        this.events.publish('stapps.settings.changed', category, name, value);
+        this.settingsActionSource.next({type: 'stapps.settings.changed', payload: {category, name, value}});
       } else {
         throw new Error(`Value "${value}" of type
           ${typeof value} is not valid for ${setting.inputType}`);