Fixed stale dashboard state after state deletion/rename

ui-ngx/src/app/modules/home/components/dashboard-page/states/default-state-controller.component.ts

@@ -77,6 +77,18 @@ export class DefaultStateControllerComponent extends StateControllerComponent im
   }
 
   protected onStatesChanged() {
+    const stateObj = this.stateObject[0];
+    if (stateObj && (!stateObj.id || !this.states[stateObj.id])) {
+      const currentStateId = this.dashboardCtrl.dashboardCtx.state;
+      stateObj.id = currentStateId && this.states[currentStateId]
+        ? currentStateId
+        : this.dashboardUtils.getRootStateId(this.states);
+      this.stateIdSubject.next(stateObj.id);
+      if (this.syncStateWithQueryParam && this.states[stateObj.id]) {
+        this.mobileService.handleDashboardStateName(this.getStateName(stateObj.id, this.states[stateObj.id]));
+      }
+      this.updateStateParam(objToBase64(this.stateObject), true);
+    }
   }
 
   protected onStateChanged() {

ui-ngx/src/app/modules/home/components/dashboard-page/states/entity-state-controller.component.ts

@@ -61,7 +61,7 @@ export class EntityStateControllerComponent extends StateControllerComponent imp
 
   public init() {
     if (this.preservedState) {
-      this.stateObject = this.preservedState;
+      this.stateObject = this.syncPreservedStateWithDashboardState(this.preservedState);
       this.selectedStateIndex = this.stateObject.length - 1;
       setTimeout(() => {
         this.gotoState(this.stateObject[this.stateObject.length - 1].id, true);
@@ -83,6 +83,29 @@ export class EntityStateControllerComponent extends StateControllerComponent imp
   }
 
   protected onStatesChanged() {
+    const prevStateId = this.getStateId();
+    let i = this.stateObject.length;
+    while (i--) {
+      if (!this.stateObject[i].id || !this.states[this.stateObject[i].id]) {
+        this.stateObject.splice(i, 1);
+      }
+    }
+    if (!this.stateObject.length) {
+      const currentStateId = this.dashboardCtrl.dashboardCtx.state;
+      this.stateObject.push({
+        id: currentStateId && this.states[currentStateId] ? currentStateId : this.dashboardUtils.getRootStateId(this.states),
+        params: {}
+      });
+    }
+    this.selectedStateIndex = this.stateObject.length - 1;
+    const newStateId = this.getStateId();
+    if (newStateId !== prevStateId) {
+      this.stateIdSubject.next(newStateId);
+      if (this.syncStateWithQueryParam) {
+        this.mobileService.handleDashboardStateName(this.getStateName(this.stateObject.length - 1));
+      }
+      this.updateLocation(false);
+    }
   }
 
   protected onStateChanged() {
@@ -278,6 +301,24 @@ export class EntityStateControllerComponent extends StateControllerComponent imp
     return result;
   }
 
+  private syncPreservedStateWithDashboardState(preservedState: StateControllerState): StateControllerState {
+    const result = preservedState.filter((stateObj) => stateObj.id && this.states[stateObj.id]);
+    const currentStateId = this.dashboardCtrl.dashboardCtx.state;
+    if (currentStateId && this.states[currentStateId] &&
+        (!result.length || result[result.length - 1].id !== currentStateId)) {
+      const stateIndex = result.map((stateObj) => stateObj.id).lastIndexOf(currentStateId);
+      if (stateIndex > -1) {
+        result.splice(stateIndex + 1);
+      } else {
+        result.push({ id: currentStateId, params: {} });
+      }
+    }
+    if (!result.length) {
+      result.push({ id: this.dashboardUtils.getRootStateId(this.states), params: {} });
+    }
+    return result;
+  }
+
   private gotoState(stateId: string, update: boolean, openRightLayout?: boolean) {
     const isStateIdChanged = this.dashboardCtrl.dashboardCtx.state !== stateId;
     this.dashboardCtrl.openDashboardState(stateId, openRightLayout);