fix(stark-ui): remove all overlays by destroying the Angular CDK Over…

…layContainer when navigating to the SessionExpired state

ISSUES CLOSED: NationalBankBelgium#1570

packages/stark-ui/src/modules/session-ui/routes.ts

@@ -1,4 +1,6 @@
+import { HookResult, Transition } from "@uirouter/core";
 import { Ng2StateDeclaration } from "@uirouter/angular";
+import { OverlayContainer } from "@angular/cdk/overlay";
 import {
 	starkLoginStateName,
 	starkLoginStateUrl,
@@ -16,6 +18,20 @@ import {
 	StarkSessionLogoutPageComponent
 } from "./pages";
 
+/**
+ * Hook to destroy the OverlayContainer inside which all overlays are rendered (i.e. stark-dropdown options)
+ * fixes https://github.com/NationalBankBelgium/stark/issues/1570
+ */
+export function destroyOverlaysOnEnterFn(transition: Transition): HookResult {
+	// inject the OverlayContainer
+	const overlayContainer: OverlayContainer = transition.injector().get<OverlayContainer>(OverlayContainer);
+	// destroy the container by calling its own "ngOnDestroy" method
+	// see https://github.com/angular/components/pull/5378/files
+	/* tslint:disable-next-line:no-lifecycle-call*/
+	overlayContainer.ngOnDestroy();
+	return true;
+}
+
 /**
  * States defined by Session-UI Module
  */
@@ -46,7 +62,8 @@ export const SESSION_UI_STATES: Ng2StateDeclaration[] = [
 			"initOrExit@": {
 				component: StarkSessionExpiredPageComponent
 			}
-		}
+		},
+		onEnter: destroyOverlaysOnEnterFn
 	},
 	{
 		name: starkSessionLogoutStateName, // the parent is defined in the state's name (contains a dot)