1 files changed, 31 insertions, 0 deletions
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/directives/stateful-tab.directive.ts b/src/pybind/mgr/dashboard/frontend/src/app/shared/directives/stateful-tab.directive.ts
new file mode 100644
index 000000000..cf6f27e95
--- /dev/null
+++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/directives/stateful-tab.directive.ts
@@ -0,0 +1,31 @@
+import { Directive, Host, HostListener, Input, OnInit, Optional } from '@angular/core';
+
+import { NgbNav, NgbNavChangeEvent } from '@ng-bootstrap/ng-bootstrap';
+
+@Directive({
+  selector: '[cdStatefulTab]'
+})
+export class StatefulTabDirective implements OnInit {
+  @Input()
+  cdStatefulTab: string;
+
+  private localStorage = window.localStorage;
+
+  constructor(@Optional() @Host() private nav: NgbNav) {}
+
+  ngOnInit() {
+    // Is an activate tab identifier stored in the local storage?
+    const activeId = this.localStorage.getItem(`tabset_${this.cdStatefulTab}`);
+    if (activeId) {
+      this.nav.select(activeId);
+    }
+  }
+
+  @HostListener('navChange', ['$event'])
+  onNavChange(event: NgbNavChangeEvent) {
+    // Store the current active tab identifier in the local storage.
+    if (this.cdStatefulTab && event.nextId) {
+      this.localStorage.setItem(`tabset_${this.cdStatefulTab}`, event.nextId);
+    }
+  }
+}