diff --git a/projects/rss-reader/ngsw-config.json b/projects/rss-reader/ngsw-config.json index 343d0ff4..bd32622f 100644 --- a/projects/rss-reader/ngsw-config.json +++ b/projects/rss-reader/ngsw-config.json @@ -1,6 +1,35 @@ { "$schema": "../../node_modules/@angular/service-worker/config/schema.json", "index": "/index.html", + "appData": { + "version": "1.5.4" + }, + "dataGroups": [ + { + "name": "time-based-apis", + "urls": [ + "https://newsapi.org/v2/**", + "https://api.rss2json.com/**" + ], + "cacheConfig": { + "maxAge": "1h", + "timeout": "5s", + "strategy": "freshness", + "maxSize": 20 + } + }, + { + "name": "non-time-based-apis", + "urls": [ + "https://restcountries.eu/rest/**" + ], + "cacheConfig": { + "maxAge": "7d", + "maxSize": 8, + "timeout": "2s" + } + } + ], "assetGroups": [ { "name": "app", diff --git a/projects/rss-reader/src/app/app.component.ts b/projects/rss-reader/src/app/app.component.ts index b23f07fd..185f5ad9 100644 --- a/projects/rss-reader/src/app/app.component.ts +++ b/projects/rss-reader/src/app/app.component.ts @@ -172,20 +172,71 @@ export class AppComponent implements OnInit, OnDestroy { if (this.isOffline) { console.log('User is offline'); // tslint:disable-next-line:max-line-length - const snackBarRef = this.shared.openSnackBar({ msg: 'You are currently offline. Some features may not be available.', action: 'Retry', additionalOpts: { panelClass: ['mat-elevation-z2'], horizontalPosition: 'start' } }); + const snackBarRef = this.shared.openSnackBar({ + msg: 'You are currently offline. Some features may not be available.', + action: 'Retry', + additionalOpts: { + panelClass: ['mat-elevation-z2'], + horizontalPosition: 'start' + } + }); snackBarRef.onAction().subscribe(() => { window.location.reload(); }); } + + // SwUpdate functionality + console.log('SwUpdate#isEnabled:', this.swUpdate.isEnabled); + + this.swUpdate.checkForUpdate().then(() => { + console.log('[AppComponent] Successfully checked for updates.'); + }, error => { + console.error('[AppComponent] Could not check for updates:', error); + }); + + this.swUpdate.activated.subscribe(event => { + console.log('[AppComponent] Successfully activated update!'); + this.shared.openSnackBar({ + msg: 'Successfully updated the app!' + }); + console.log('[AppComponent] Current version is:', event.current); + console.log('[AppComponent] Previous version is:', event.previous); + }); + this.swUpdate.available.subscribe(event => { - console.log('[App] Update available: current version is', event.current, 'available version is', event.available); + console.log('[AppComponent] Update available: current version is', event.current, 'available version is', event.available); + + function hasNewerVer(): boolean { + const availableHasVer = 'version' in event.available.appData; + const currentHasVer = 'version' in event.current.appData; + let returnVal = false; + + if ('version' in event.available.appData && currentHasVer) { + // tslint:disable-next-line: no-string-literal + returnVal = event.available.appData['version'] !== event.current.appData['version']; + } + + return returnVal; + } + + const message = hasNewerVer() ? + `A newer version (${event.available.appData['version']}) of the app is available!` : + 'A newer version of the app is available!'; const snackBarRef = this.shared.openSnackBar({ - msg: 'A newer version of this app is available!', - action: 'Update & Refresh' + msg: message, + action: 'Update & Refresh', + additionalOpts: { + // Interesting note: The snackbar code actually checks if the duration is above 0 and only enables auto-hide from that. + duration: 0 + } }); snackBarRef.onAction().subscribe(() => { - this.shared.activateUpdate(); + this.swUpdate.activateUpdate().then(() => { + window.location.reload(); + }, error => { + console.error('[AppComponent] Could not activate update:', error); + }); }); }); diff --git a/projects/rss-reader/src/app/app.module.ts b/projects/rss-reader/src/app/app.module.ts index 430a74f1..d4f66b3b 100644 --- a/projects/rss-reader/src/app/app.module.ts +++ b/projects/rss-reader/src/app/app.module.ts @@ -68,7 +68,8 @@ const PIPES = [ AppRoutingModule, // The scope parameter is specified such that the service worker only // applies to the /rss-reader URL. - ServiceWorkerModule.register(environment.swLocation, { enabled: environment.production, scope: './' }), + // ServiceWorkerModule.register(environment.swLocation, { enabled: environment.production, scope: './' }), + ServiceWorkerModule.register('./ngsw-worker.js', { enabled: environment.production, scope: './' }), DialogsModule, // AngularFireModule.initializeApp(environment.firebase), // AngularFirestoreModule.enablePersistence(), diff --git a/projects/rss-reader/src/environment.base.ts b/projects/rss-reader/src/environment.base.ts index 3ed21977..157c1e53 100644 --- a/projects/rss-reader/src/environment.base.ts +++ b/projects/rss-reader/src/environment.base.ts @@ -57,7 +57,7 @@ export const gitRepoDefaults: GitRepo = { /** Default environment that other enviroments can extend from. */ export const defaultEnvironment: Environment = { production: false, - swLocation: '', + swLocation: '/ngsw-worker.js', latestVersion, gitRepoDefaults }; diff --git a/projects/rss-reader/src/environments/environment.httpserver.ts b/projects/rss-reader/src/environments/environment.httpserver.ts index e96a71c2..8429c15a 100644 --- a/projects/rss-reader/src/environments/environment.httpserver.ts +++ b/projects/rss-reader/src/environments/environment.httpserver.ts @@ -1,6 +1,5 @@ import { mergeWithDefaultEnv } from '../environment.base'; export const environment = mergeWithDefaultEnv({ - production: true, - swLocation: '/ngsw-worker.js' + production: true });