added PWA prompt

added prompt to install PWA app

src/app/app.component.html

@@ -24,7 +24,7 @@
     </div>
   </div>
 </mat-toolbar>
-
+<button mat-button id="installApp" hidden>{{'install_app'|tr:'Install APP'}}</button>
 <mat-toolbar class="mobile-toolbar" color="primary">
   <ng-container *ngTemplateOutlet="toolbarItems"/>
 </mat-toolbar>

src/app/app.component.scss

@@ -138,6 +138,12 @@ footer {
     width: 100%;
 }
 
+#installApp {
+    position: absolute;
+    bottom: 50px; right: 0;
+    width: 100%;
+}
+
 [class*='dark-theme'] {
     
 }

src/app/app.component.ts

@@ -16,6 +16,7 @@ import { generateId } from 'angularlib/base.service';
 import { Store } from '@ngxs/store';
 import config from '../config/config.json';
 import { UIAuthActions } from 'angularlib/login/state/login.actions';
+import { Platform } from '@angular/cdk/platform';
 
 @Component({
   selector: 'app-root',
@@ -69,7 +70,8 @@ export class AppComponent extends BaseComponent implements OnInit {
     /**Platform Browser title */
     protected pbTitle: Title,
     protected cs: ComponentService,
-    private route: ActivatedRoute
+    private route: ActivatedRoute,
+    private platform: Platform
   ) {
     super(store,cs);
   }
@@ -106,6 +108,8 @@ export class AppComponent extends BaseComponent implements OnInit {
         this.notificationCount = state.notifications.length;
       }
     });
+
+    if (this.platform.ANDROID || this.platform.IOS) this.pwaPrompt();
   }
 
   /**
@@ -121,4 +125,31 @@ export class AppComponent extends BaseComponent implements OnInit {
       message:{title:generateId(),desc:generateId(),timestamp: new Date()}
     }));
   }
+
+  /**prompt to install PWA App */
+  private pwaPrompt() {
+    let installPrompt = null;
+    const installButton = document.querySelector("#installApp");
+
+    const disableInAppInstallPrompt = () =>  {
+      installPrompt = null;
+      installButton.setAttribute("hidden","");
+    }
+
+    window.addEventListener("beforeinstallprompt",(event) => {
+      event.preventDefault();
+      installPrompt = event;
+      installButton.removeAttribute("hidden");
+    });
+
+    installButton.addEventListener("click", async () => {
+      if (!installPrompt) return;
+      const result = await installPrompt.prompt();
+      disableInAppInstallPrompt();
+    });
+
+    window.addEventListener("appinstalled", () => {
+      disableInAppInstallPrompt();
+    });
+  }
 }