ionic 4/5 avoid multiple alert/popover/modal prompt

Question

Do you know how to avoid multiple prompt alert/popover/modal?

I can't find any example how to do in ionic4/5.

private async alertCtrlDispatchNavigateAfterLogout(msg:string):Promise<HTMLIonAlertElement>{
  let alert = await this.alertCtrl.create({
    cssClass: "ge-session-timeout-alert",
    backdropDismiss: false,
    subHeader: msg,
    buttons: [
      {
        text: 'OK',
        role: 'cancel',
        handler: () => {
          this.store.dispatch(new RouterActions.NavigateAfterLogout(true));
        }
      }
    ],
  });
  await alert.present();
  return alert;
}

Answer 1

You can refer to below sample code written in ionic 3, Same idea will work in Ionic 4/5, where alertPresented flag prevents more than one instance from being presented

import { Injectable } from '@angular/core';

import { AlertController } from 'ionic-angular';

@Injectable()
export class Alert {
  public alertPresented: any;
  constructor(public alertCtrl: AlertController) {
    this.alertPresented = false
  }

  present(title, subTitle) {
    let vm = this
    if(!vm.alertPresented) {
      vm.alertPresented = true
      vm.alertCtrl.create({
        title: title,
        subTitle: subTitle,
        buttons: [{
          text: 'OK',
          handler: () => {
            vm.alertPresented = false
          }
        }],
      }).present();
    }
  }
}

Answer 2

you need to check first any alert/popover/modal is appeared then dismiss

const checkPropmt = await this.alertCtrl.getTop();
if(checkPropmt){
  this.alertCtrl.dismiss();
}

above code dismiss the alert or model.