small improvements, pwa update

src/app/ui/main/main.ui.ts

@@ -11,6 +11,7 @@ import { I18nService } from '../../services/i18n.service';
 import { SettingsService } from '../../services/settings.service';
 
 import packageJson from '../../../../package.json';
+import { SwUpdate } from '@angular/service-worker';
 
 @Component({
   selector: 'ui-main',
@@ -28,6 +29,7 @@ export class UiMain {
   authenticated: boolean = false;
   moderator: boolean = false;
   searchFocus: boolean = false;
+  hasUpdate: boolean = false;
 
   touchThresh: number = 150;
   touchStartX: number;
@@ -43,8 +45,23 @@ export class UiMain {
     private router: Router,
     private iconRegistry: MatIconRegistry,
     private sanitizer: DomSanitizer,
-    private _adapter: DateAdapter<any>) {
+    private _adapter: DateAdapter<any>, private swUpdate: SwUpdate) {
     iconRegistry.addSvgIcon('logo', sanitizer.bypassSecurityTrustResourceUrl('assets/icons/logo.svg'));
+
+    this.swUpdate.versionUpdates.subscribe(evt => {
+      if (evt.type == 'VERSION_READY') {
+        this.hasUpdate = true;
+      } else if (evt.type == 'VERSION_INSTALLATION_FAILED') {
+        console.error(`Failed to install version '${evt.version.hash}': ${evt.error}`);
+      }
+    })
+
+    if (this.swUpdate.isEnabled) {
+      // check for PWA update every 30s
+      setInterval(() => {
+        this.swUpdate.checkForUpdate();
+      }, 30000);
+    }
   }
 
   async ngOnInit() {
@@ -98,6 +115,7 @@ export class UiMain {
 
   close() {
     this.opened = false;
+    this.searchFocus = false;
   }
 
   preventClose(event) {
@@ -193,5 +211,28 @@ export class UiMain {
     })
   }
 
+  updateSw(force: boolean = false): void {
+    if (this.hasUpdate || force) {
+      if (this.swUpdate.isEnabled) {
+        this.swUpdate.activateUpdate().then(() => {
+          this.clearAndRefresh();
+        });
+      } else {
+        this.clearAndRefresh();
+      }
+    }
+  }
+
+  clearAndRefresh() {
+    if ('caches' in window) {
+      caches.keys()
+        .then(function (keyList) {
+          return Promise.all(keyList.map(function (key) {
+            return caches.delete(key);
+          }));
+        })
+    }
+    window.location.reload()
+  }
 }