diff --git a/ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-page.component.html b/ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-page.component.html index 5ba7f2f01c..77e6047d8a 100644 --- a/ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-page.component.html +++ b/ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-page.component.html @@ -53,6 +53,7 @@ [isMobile]="isMobile" [state]="dashboardCtx.state" [currentState]="currentState" + [syncStateWithQueryParam]="syncStateWithQueryParam" [states]="dashboardConfiguration.states"> diff --git a/ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-page.component.ts b/ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-page.component.ts index 31fb065a83..5385913842 100644 --- a/ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-page.component.ts +++ b/ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-page.component.ts @@ -123,6 +123,9 @@ export class DashboardPageComponent extends PageComponent implements IDashboardC @Input() hideToolbar: boolean; + @Input() + syncStateWithQueryParam = true; + @Input() dashboard: Dashboard; dashboardConfiguration: DashboardConfiguration; diff --git a/ui-ngx/src/app/modules/home/components/dashboard-page/states/state-controller.component.ts b/ui-ngx/src/app/modules/home/components/dashboard-page/states/state-controller.component.ts index 61eaa6ae5c..cd54ec7558 100644 --- a/ui-ngx/src/app/modules/home/components/dashboard-page/states/state-controller.component.ts +++ b/ui-ngx/src/app/modules/home/components/dashboard-page/states/state-controller.component.ts @@ -88,6 +88,8 @@ export abstract class StateControllerComponent implements IStateControllerCompon currentState: string; + syncStateWithQueryParam: boolean; + private rxSubscriptions = new Array(); private inited = false; @@ -99,18 +101,20 @@ export abstract class StateControllerComponent implements IStateControllerCompon } ngOnInit(): void { - this.rxSubscriptions.push(this.route.queryParamMap.subscribe((paramMap) => { - const dashboardId = this.route.snapshot.params.dashboardId || ''; - if (this.dashboardId === dashboardId) { - const newState = this.decodeStateParam(paramMap.get('state')); - if (this.currentState !== newState) { - this.currentState = newState; - if (this.inited) { - this.onStateChanged(); + if (this.syncStateWithQueryParam) { + this.rxSubscriptions.push(this.route.queryParamMap.subscribe((paramMap) => { + const dashboardId = this.route.snapshot.params.dashboardId || ''; + if (this.dashboardId === dashboardId) { + const newState = this.decodeStateParam(paramMap.get('state')); + if (this.currentState !== newState) { + this.currentState = newState; + if (this.inited) { + this.onStateChanged(); + } } } - } - })); + })); + } this.init(); this.inited = true; } @@ -124,16 +128,18 @@ export abstract class StateControllerComponent implements IStateControllerCompon protected updateStateParam(newState: string) { this.currentState = newState; - const queryParams: Params = { state: this.currentState }; - this.ngZone.run(() => { - this.router.navigate( - [], - { - relativeTo: this.route, - queryParams, - queryParamsHandling: 'merge', - }); - }); + if (this.syncStateWithQueryParam) { + const queryParams: Params = {state: this.currentState}; + this.ngZone.run(() => { + this.router.navigate( + [], + { + relativeTo: this.route, + queryParams, + queryParamsHandling: 'merge', + }); + }); + } } public openRightLayout(): void { diff --git a/ui-ngx/src/app/modules/home/components/dashboard-page/states/state-controller.models.ts b/ui-ngx/src/app/modules/home/components/dashboard-page/states/state-controller.models.ts index 730f31dd0b..6a21ac564f 100644 --- a/ui-ngx/src/app/modules/home/components/dashboard-page/states/state-controller.models.ts +++ b/ui-ngx/src/app/modules/home/components/dashboard-page/states/state-controller.models.ts @@ -24,6 +24,7 @@ export interface IStateControllerComponent extends IStateController { stateControllerInstanceId: string; state: string; currentState: string; + syncStateWithQueryParam: boolean; isMobile: boolean; states: {[id: string]: DashboardState }; dashboardId: string; diff --git a/ui-ngx/src/app/modules/home/components/dashboard-page/states/states-component.directive.ts b/ui-ngx/src/app/modules/home/components/dashboard-page/states/states-component.directive.ts index e377f77fff..b6911ed9d8 100644 --- a/ui-ngx/src/app/modules/home/components/dashboard-page/states/states-component.directive.ts +++ b/ui-ngx/src/app/modules/home/components/dashboard-page/states/states-component.directive.ts @@ -53,6 +53,9 @@ export class StatesComponentDirective implements OnInit, OnDestroy, OnChanges { @Input() currentState: string; + @Input() + syncStateWithQueryParam: boolean; + @Input() isMobile: boolean; @@ -89,6 +92,8 @@ export class StatesComponentDirective implements OnInit, OnDestroy, OnChanges { this.stateControllerComponent.state = this.state; } else if (propName === 'currentState') { this.stateControllerComponent.currentState = this.currentState; + } else if (propName === 'syncStateWithQueryParam') { + this.stateControllerComponent.syncStateWithQueryParam = this.syncStateWithQueryParam; } } } @@ -119,6 +124,7 @@ export class StatesComponentDirective implements OnInit, OnDestroy, OnChanges { this.stateControllerComponent.stateControllerInstanceId = stateControllerInstanceId; this.stateControllerComponent.state = this.state; this.stateControllerComponent.currentState = this.currentState; + this.stateControllerComponent.syncStateWithQueryParam = this.syncStateWithQueryParam; this.stateControllerComponent.isMobile = this.isMobile; this.stateControllerComponent.states = this.states; this.stateControllerComponent.dashboardId = this.dashboardId; diff --git a/ui-ngx/src/app/modules/home/components/widget/dialog/embed-dashboard-dialog.component.html b/ui-ngx/src/app/modules/home/components/widget/dialog/embed-dashboard-dialog.component.html index 04bc5708b6..ca4f2a56b7 100644 --- a/ui-ngx/src/app/modules/home/components/widget/dialog/embed-dashboard-dialog.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/dialog/embed-dashboard-dialog.component.html @@ -27,7 +27,8 @@
- +