diff --git a/frontend/src/ts/modules/mfe/mfe-webbpm.module.ts b/frontend/src/ts/modules/mfe/mfe-webbpm.module.ts index 2124752..e6321ad 100644 --- a/frontend/src/ts/modules/mfe/mfe-webbpm.module.ts +++ b/frontend/src/ts/modules/mfe/mfe-webbpm.module.ts @@ -4,7 +4,7 @@ import {BrowserAnimationsModule} from "@angular/platform-browser/animations"; import {FormsModule} from "@angular/forms"; import {AgGridModule} from "ag-grid-angular"; import {NgbModule} from "@ng-bootstrap/ng-bootstrap"; -import {ToastNoAnimationModule} from "ngx-toastr"; +import {OverlayContainer, ToastNoAnimationModule} from "ngx-toastr"; import {AppModule} from "../app/app.module"; import { AppConfigService, @@ -27,6 +27,7 @@ import {MfeRolesGuard} from "./guard/MfeRolesGuard"; import {TokenProvider} from "../app/provider/token.provider"; import {MfeTokenProvider} from "./provider/mfe-token.provider"; import {AccessDeniedComponent} from "../app/component/access-denied.component"; +import {MfeOverlayContainer} from "./overlay/mfe-overlay-container.service"; let IMPORTS = [ BrowserAnimationsModule, @@ -58,6 +59,7 @@ let IMPORTS = [ {provide: ProgressIndicationService, useClass: MfeProgressIndicationService}, {provide: RolesGuard, useClass: MfeRolesGuard}, {provide: TokenProvider, useClass: MfeTokenProvider}, + {provide: OverlayContainer, useClass: MfeOverlayContainer}, DEFAULT_HTTP_INTERCEPTOR_PROVIDERS ], bootstrap: [ diff --git a/frontend/src/ts/modules/mfe/overlay/mfe-overlay-container.service.ts b/frontend/src/ts/modules/mfe/overlay/mfe-overlay-container.service.ts new file mode 100644 index 0000000..e038a7e --- /dev/null +++ b/frontend/src/ts/modules/mfe/overlay/mfe-overlay-container.service.ts @@ -0,0 +1,35 @@ +import {OverlayContainer} from "ngx-toastr"; +import {Inject, Injectable} from "@angular/core"; +import {DOCUMENT} from "@angular/common"; + +@Injectable({ providedIn: 'root' }) +export class MfeOverlayContainer extends OverlayContainer { + + constructor(@Inject(DOCUMENT) _document: any) { + super(_document); + } + + ngOnDestroy() { + super.ngOnDestroy(); + } + + protected _createContainer(): void { + super._createContainer(); + this.appendToRootComponent(); + } + + private appendToRootComponent(): void { + if (!this._containerElement) { + return; + } + + const rootElement = this.getRootElement(); + const parent = rootElement || this._document.body; + parent.appendChild(this._containerElement); + } + + private getRootElement(): Element { + return this._document.querySelector('mfe-webbpm') + .shadowRoot.querySelector('[webbpm]'); + } +}