Skip to content

Commit 9961b51

Browse files
HejdaJakubHejdaJakub
committed
fix: preserve query parameters during the routing
* Programmatic navigation in all ts files was fixed by merging or preserving query parameters. * Correct navigation with all query params by <a> tag and <tr> tag via [routerLink] is managed by the new directive. * Special use cases were handled like navigation between the same entities (e.g. hierarchical organizations) and do NOT preserve query params by redirecting from the preview page, where the query parameters are used for the definition of application items.
1 parent f14e1ed commit 9961b51

File tree

54 files changed

+179
-115
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

54 files changed

+179
-115
lines changed

‎apps/admin-gui/src/app/admin/pages/admin-page/admin-services/service-detail-page/service-detail-page.component.html

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,8 +17,7 @@
1717
[perunWebAppsMiddleClickRouterLink]="['/admin/services', service.id.toString()]"
1818
(auxclick)="$event.preventDefault()"
1919
[routerLink]="['/admin/services', service.id]"
20-
class="service-link"
21-
queryParamsHandling="merge">
20+
class="service-link">
2221
{{service.name}}
2322
</a>
2423
<span class="text-muted"> &nbsp; #{{service.id}} </span>

‎apps/admin-gui/src/app/admin/pages/admin-page/admin-services/service-detail-page/service-detail-page.component.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -82,7 +82,7 @@ export class ServiceDetailPageComponent implements OnInit {
8282

8383
dialogRef.afterClosed().subscribe((result) => {
8484
if (result) {
85-
void this.router.navigate(['/admin/services']);
85+
void this.router.navigate(['/admin/services'], { queryParamsHandling: 'preserve' });
8686
}
8787
});
8888
}

‎apps/admin-gui/src/app/admin/pages/admin-page/admin-visualizer/user-destination-relationship/user-destination-relationship.component.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -141,6 +141,7 @@ export class UserDestinationRelationshipComponent implements OnInit {
141141
destination: this.destination,
142142
service: 'noService',
143143
},
144+
queryParamsHandling: 'merge',
144145
});
145146
} else {
146147
void this.router.navigate(['admin/visualizer/userDestinationRelationship/graph'], {
@@ -149,6 +150,7 @@ export class UserDestinationRelationshipComponent implements OnInit {
149150
destination: this.destination,
150151
service: this.chosenService,
151152
},
153+
queryParamsHandling: 'merge',
152154
});
153155
}
154156
}

‎apps/admin-gui/src/app/admin/pages/admin-user-detail-page/admin-user-detail-page.component.html

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -10,11 +10,7 @@
1010
</mat-icon>
1111
<div class="page-title-block">
1212
<div class="page-title-headline d-flex align-items-center">
13-
<a
14-
[routerLink]="['/admin/users', user.id]"
15-
class="user-link"
16-
queryParamsHandling="merge"
17-
data-cy="user-name-link">
13+
<a [routerLink]="['/admin/users', user.id]" class="user-link" data-cy="user-name-link">
1814
{{user | userFullName}}
1915
</a>
2016
<span class="text-muted"> &nbsp;#{{user.id}} </span>

‎apps/admin-gui/src/app/facilities/pages/facility-detail-page/facility-detail-page.component.html

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,6 @@
1616
[perunWebAppsMiddleClickRouterLink]="['/facilities', facility.id.toString()]"
1717
(auxclick)="$event.preventDefault()"
1818
[routerLink]="['/facilities', facility.id]"
19-
queryParamsHandling="merge"
2019
>{{facility.name}}</a
2120
>
2221
<span class="text-muted"> &nbsp;#{{facility.id}} </span>

‎apps/admin-gui/src/app/facilities/pages/facility-detail-page/facility-detail-page.component.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -118,7 +118,7 @@ export class FacilityDetailPageComponent extends destroyDetailMixin() implements
118118

119119
dialogRef.afterClosed().subscribe((result) => {
120120
if (result) {
121-
void this.router.navigate(['']);
121+
void this.router.navigate([''], { queryParamsHandling: 'preserve' });
122122
}
123123
});
124124
}

‎apps/admin-gui/src/app/facilities/pages/resource-detail-page/resource-detail-page.component.html

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -15,8 +15,7 @@
1515
[perunWebAppsMiddleClickRouterLink]="[baseUrl]"
1616
(auxclick)="$event.preventDefault()"
1717
[routerLink]="[baseUrl]"
18-
class="resource-link"
19-
queryParamsHandling="merge">
18+
class="resource-link">
2019
{{resource.name}}
2120
</a>
2221
<span class="text-muted"> &nbsp;#{{resource.id}} </span>
@@ -40,7 +39,6 @@
4039
[perunWebAppsMiddleClickRouterLink]="['/organizations', resource.vo.id.toString()]"
4140
(auxclick)="$event.preventDefault()"
4241
[routerLink]="['/organizations', resource.vo.id]"
43-
queryParamsHandling="merge"
4442
class="resource-link"
4543
>{{resource.vo.name}}</a
4644
>
@@ -52,7 +50,6 @@
5250
class="resource-link"
5351
*ngIf="facilityLinkAuth"
5452
attr.data-cy="{{resource.facility.name}}"
55-
queryParamsHandling="merge"
5653
[perunWebAppsMiddleClickRouterLink]="['/facilities', resource.facilityId.toString()]"
5754
(auxclick)="$event.preventDefault()"
5855
[routerLink]="['/facilities', resource.facilityId]"

‎apps/admin-gui/src/app/facilities/pages/resource-detail-page/resource-detail-page.component.ts

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -155,7 +155,10 @@ export class ResourceDetailPageComponent extends destroyDetailMixin() implements
155155

156156
dialogRef.afterClosed().subscribe((result) => {
157157
if (result) {
158-
void this.router.navigate(['../'], { relativeTo: this.route });
158+
void this.router.navigate(['../'], {
159+
relativeTo: this.route,
160+
queryParamsHandling: 'preserve',
161+
});
159162
}
160163
});
161164
}

‎apps/admin-gui/src/app/main-menu-page/main-menu-page.component.html

Lines changed: 4 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,5 @@
11
<div class="buttons-container pl-2 pr-2 pl-xl-5 pr-xl-5">
2-
<a
3-
class="main-menu-button user-btn"
4-
[routerLink]="['profile']"
5-
mat-ripple
6-
queryParamsHandling="merge">
2+
<a class="main-menu-button user-btn" [routerLink]="['profile']" mat-ripple>
73
<mat-icon [svgIcon]="'perun-user'" class="item-pic perun-icon"></mat-icon>
84
<!-- <img src="assets/img/PerunWebImages/user-white.svg">-->
95
<h1>{{'MAIN_MENU.PROFILE' | translate}}</h1>
@@ -13,8 +9,7 @@ <h1>{{'MAIN_MENU.PROFILE' | translate}}</h1>
139
*ngIf="authResolver.isVoAdmin() || authResolver.isVoObserver()"
1410
class="main-menu-button vo-btn"
1511
[routerLink]="['organizations']"
16-
mat-ripple
17-
queryParamsHandling="merge">
12+
mat-ripple>
1813
<mat-icon [svgIcon]="'perun-vo'" class="item-pic perun-icon"></mat-icon>
1914
<!-- <img src="assets/img/PerunWebImages/vo-white.svg">-->
2015
<h1>{{'MAIN_MENU.ACCESS' | translate}}</h1>
@@ -24,8 +19,7 @@ <h1>{{'MAIN_MENU.ACCESS' | translate}}</h1>
2419
*ngIf="authResolver.canManageFacilities()"
2520
[routerLink]="['facilities']"
2621
class="main-menu-button facility-btn"
27-
mat-ripple
28-
queryParamsHandling="merge">
22+
mat-ripple>
2923
<mat-icon [svgIcon]="'perun-manage-facility'" class="item-pic perun-icon"></mat-icon>
3024
<!-- <img src="assets/img/PerunWebImages/manage_facility_white.svg">-->
3125
<h1>{{'MAIN_MENU.FACILITIES' | translate}}</h1>
@@ -35,8 +29,7 @@ <h1>{{'MAIN_MENU.FACILITIES' | translate}}</h1>
3529
*ngIf="authResolver.isPerunAdminOrObserver()"
3630
class="main-menu-button admin-btn"
3731
[routerLink]="['admin']"
38-
mat-ripple
39-
queryParamsHandling="merge">
32+
mat-ripple>
4033
<mat-icon [svgIcon]="'perun-perun-admin'" class="item-pic perun-icon"></mat-icon>
4134
<!-- <img src="assets/img/PerunWebImages/perun_admin-white.svg">-->
4235
<h1>{{'MAIN_MENU.ADMIN' | translate}}</h1>

‎apps/admin-gui/src/app/shared/components/dialogs/create-facility-dialog/create-facility-dialog.component.ts

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -94,7 +94,9 @@ export class CreateFacilityDialogComponent implements OnInit {
9494
this.translate.instant('DIALOGS.CREATE_FACILITY.SUCCESS') as string
9595
);
9696
if (this.configure) {
97-
void this.router.navigate(['facilities', facilityId.toString(), 'configuration']);
97+
void this.router.navigate(['facilities', facilityId.toString(), 'configuration'], {
98+
queryParamsHandling: 'preserve',
99+
});
98100
}
99101
this.dialogRef.close(true);
100102
}

‎apps/admin-gui/src/app/shared/components/dialogs/create-vo-dialog/create-vo-dialog.component.ts

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -57,14 +57,14 @@ export class CreateVoDialogComponent implements OnInit {
5757
this.loading = true;
5858
this.voService
5959
.createVoWithName(this.fullNameCtrl.value as string, this.shortNameCtrl.value as string)
60-
.subscribe(
61-
(vo) => {
60+
.subscribe({
61+
next: (vo) => {
6262
this.notificator.showSuccess(this.successMessage);
6363
this.loading = false;
64-
void this.router.navigate(['/organizations', vo.id]);
64+
void this.router.navigate(['/organizations', vo.id], { queryParamsHandling: 'preserve' });
6565
this.dialogRef.close(true);
6666
},
67-
() => (this.loading = false)
68-
);
67+
error: () => (this.loading = false),
68+
});
6969
}
7070
}

‎apps/admin-gui/src/app/shared/query-params-router.service.ts

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
import { Injectable } from '@angular/core';
2+
import { take } from 'rxjs/operators';
3+
import { ActivatedRoute, QueryParamsHandling, Router } from '@angular/router';
4+
5+
@Injectable({
6+
providedIn: 'root',
7+
})
8+
export class QueryParamsRouterService {
9+
constructor(private router: Router, private route: ActivatedRoute) {}
10+
11+
navigate(url: string[], relativeTo: ActivatedRoute = null): void {
12+
this.route.queryParams.pipe(take(1)).subscribe((params) => {
13+
let paramsHandlingMethod: QueryParamsHandling = 'merge';
14+
const queryParams = Object.assign({}, params);
15+
16+
if (location.pathname.endsWith('applicationForm/preview')) {
17+
paramsHandlingMethod = '';
18+
delete queryParams.applicationFormItems;
19+
}
20+
21+
void this.router.navigate(url, {
22+
relativeTo: relativeTo,
23+
queryParams: queryParams,
24+
queryParamsHandling: paramsHandlingMethod,
25+
});
26+
});
27+
}
28+
}

‎apps/admin-gui/src/app/shared/side-menu/side-menu-item/side-menu-item.component.ts

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import { NavigationEnd, Router } from '@angular/router';
44
import { openClose, rollInOut } from '@perun-web-apps/perun/animations';
55
import { MatSidenav } from '@angular/material/sidenav';
66
import { StoreService } from '@perun-web-apps/perun/services';
7+
import { QueryParamsRouterService } from '../../query-params-router.service';
78

89
@Component({
910
selector: 'app-side-menu-item',
@@ -27,7 +28,11 @@ export class SideMenuItemComponent {
2728
linkTextColor = this.store.getProperty('theme').sidemenu_submenu_text_color;
2829
dividerStyle = '1px solid ' + this.store.getProperty('theme').sidemenu_divider_color;
2930

30-
constructor(private router: Router, private store: StoreService) {
31+
constructor(
32+
private router: Router,
33+
private store: StoreService,
34+
private queryParamsRouter: QueryParamsRouterService
35+
) {
3136
this.currentUrl = router.url;
3237

3338
router.events.subscribe((_: NavigationEnd) => {
@@ -50,14 +55,14 @@ export class SideMenuItemComponent {
5055
isActive(currentUrl: string, regexValue: string): boolean {
5156
const regexp = new RegExp(regexValue);
5257

53-
return regexp.test(currentUrl);
58+
return regexp.test(currentUrl.split('?')[0]);
5459
}
5560

5661
navigate(url: string[]): void {
5762
if (this.sideNav.mode === 'over') {
58-
void this.sideNav.close().then(() => this.router.navigate(url));
63+
void this.sideNav.close().then(() => this.queryParamsRouter.navigate(url));
5964
} else {
60-
void this.router.navigate(url);
65+
this.queryParamsRouter.navigate(url);
6166
}
6267
}
6368
}

‎apps/admin-gui/src/app/shared/side-menu/side-menu-root-item/side-menu-root-item.component.ts

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import { SideMenuItem } from '../side-menu.component';
44
import { openClose, rollInOut } from '@perun-web-apps/perun/animations';
55
import { MatSidenav } from '@angular/material/sidenav';
66
import { StoreService } from '@perun-web-apps/perun/services';
7+
import { QueryParamsRouterService } from '../../query-params-router.service';
78

89
@Component({
910
selector: 'app-side-menu-root-item',
@@ -29,7 +30,11 @@ export class SideMenuRootItemComponent implements OnInit, OnChanges {
2930
linkTextColor = this.store.getProperty('theme').sidemenu_submenu_text_color;
3031
currentUrl: string;
3132

32-
constructor(private router: Router, private store: StoreService) {
33+
constructor(
34+
private router: Router,
35+
private store: StoreService,
36+
private queryParamsRouter: QueryParamsRouterService
37+
) {
3338
this.currentUrl = router.url;
3439

3540
router.events.subscribe((_: NavigationEnd) => {
@@ -73,9 +78,9 @@ export class SideMenuRootItemComponent implements OnInit, OnChanges {
7378

7479
navigate(url: string[]): void {
7580
if (this.sideNav.mode === 'over') {
76-
void this.sideNav.close().then(() => this.router.navigate(url));
81+
void this.sideNav.close().then(() => this.queryParamsRouter.navigate(url));
7782
} else {
78-
void this.router.navigate(url);
83+
this.queryParamsRouter.navigate(url);
7984
}
8085
}
8186
}

‎apps/admin-gui/src/app/users/components/user-profile/user-profile.component.html

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,8 +13,7 @@
1313
[perunWebAppsMiddleClickRouterLink]="['/myProfile']"
1414
(auxclick)="$event.preventDefault()"
1515
[routerLink]="['/myProfile']"
16-
class="user-link"
17-
queryParamsHandling="merge">
16+
class="user-link">
1817
{{user | userFullName}}
1918
</a>
2019
<span class="text-muted"> &nbsp;#{{user.id}} </span>

‎apps/admin-gui/src/app/users/pages/user-detail-page/user-accounts/user-accounts.component.html

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,6 @@ <h1 class="page-title">{{'USER_DETAIL.ACCOUNTS.TITLE' | translate}}</h1>
2323
[perunWebAppsMiddleClickRouterLink]="['/organizations', selectedVo.id.toString(), 'members', member.id.toString()]"
2424
(auxclick)="$event.preventDefault()"
2525
[routerLink]="['/organizations', selectedVo.id, 'members', member.id]"
26-
queryParamsHandling="merge"
2726
>{{member.id}}
2827
</a>
2928
</div>

‎apps/admin-gui/src/app/users/pages/user-detail-page/user-dashboard/dashboard-recently-viewed-button-field/dashboard-recently-viewed-button-field.component.html

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,6 @@
1111
[perunWebAppsMiddleClickRouterLink]="[item.url]"
1212
(auxclick)="$event.preventDefault()"
1313
[routerLink]="item.url"
14-
queryParamsHandling="merge"
1514
matTooltip="{{item.tooltip}}">
1615
<span class="item-type">{{item.type}}</span>
1716
<mat-icon [svgIcon]="item.cssIcon" class="item-pic perun-icon"></mat-icon>

‎apps/admin-gui/src/app/users/pages/user-detail-page/user-dashboard/user-dashboard.component.html

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -52,7 +52,11 @@ <h1 class="page-title d-flex">
5252
>
5353
</div>
5454
<div class="mx-auto pt-3">
55-
<button [routerLink]="['/myProfile']" class="text-bigger" mat-stroked-button>
55+
<button
56+
[routerLink]="['/myProfile']"
57+
queryParamsHandling="merge"
58+
class="text-bigger"
59+
mat-stroked-button>
5660
<mat-icon class="mr-1 user-icon perun-icon" svgIcon="perun-user-dark"></mat-icon>
5761
{{'USER_DETAIL.DASHBOARD.GO_TO_MY_PROFILE' | translate}}
5862
</button>

‎apps/admin-gui/src/app/users/pages/user-detail-page/user-dashboard/user-dashboard.component.ts

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -113,21 +113,21 @@ export class UserDashboardComponent implements OnInit {
113113
this.apiRequestConfiguration.dontHandleErrorForNext();
114114
this.userManager
115115
.validatePreferredEmailChangeWithToken(token, Number.parseInt(u, 10))
116-
.subscribe(
117-
() => {
116+
.subscribe({
117+
next: () => {
118118
this.notificator.showSuccess(this.mailSuccessMessage);
119-
void this.router.navigate([], { replaceUrl: true });
119+
void this.router.navigate([], { replaceUrl: true, queryParamsHandling: 'preserve' });
120120
},
121-
() => {
121+
error: () => {
122122
const config = getDefaultDialogConfig();
123123
config.width = '600px';
124124

125125
const dialogRef = this.dialog.open(MailChangeFailedDialogComponent, config);
126126
dialogRef.afterClosed().subscribe(() => {
127127
this.getDashboardSettings();
128128
});
129-
}
130-
);
129+
},
130+
});
131131
}
132132
}
133133

‎apps/admin-gui/src/app/users/pages/user-detail-page/user-settings/user-settings-associated-users/user-settings-associated-users.component.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -105,7 +105,7 @@ export class UserSettingsAssociatedUsersComponent implements OnInit {
105105
dialogRef.afterClosed().subscribe((result) => {
106106
if (result) {
107107
if (!this.authResolver.isAuthorized('getUsersBySpecificUser_User_policy', [this.user])) {
108-
void this.router.navigate(['/myProfile']);
108+
void this.router.navigate(['/myProfile'], { queryParamsHandling: 'preserve' });
109109
} else {
110110
this.refreshTable();
111111
}

‎apps/admin-gui/src/app/users/pages/user-detail-page/user-settings/user-settings-service-identities/service-identity-detail-page/service-identity-detail-page.component.html

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,8 +14,7 @@
1414
[perunWebAppsMiddleClickRouterLink]="['/myProfile/service-identities', user.id.toString()]"
1515
(auxclick)="$event.preventDefault()"
1616
[routerLink]="['/myProfile/service-identities', user.id]"
17-
class="user-link"
18-
queryParamsHandling="merge">
17+
class="user-link">
1918
{{user | userFullName}}
2019
</a>
2120
<span class="text-muted"> &nbsp;#{{user.id}} </span>

‎apps/admin-gui/src/app/vos/components/application-form-list/application-form-list.component.ts

Lines changed: 4 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -244,12 +244,9 @@ export class ApplicationFormListComponent implements OnInit, OnChanges {
244244
}
245245

246246
openManagingGroups(): void {
247-
void this.router.navigate([
248-
'/organizations',
249-
this.applicationForm.vo.id,
250-
'settings',
251-
'applicationForm',
252-
'manageGroups',
253-
]);
247+
void this.router.navigate(
248+
['/organizations', this.applicationForm.vo.id, 'settings', 'applicationForm', 'manageGroups'],
249+
{ queryParamsHandling: 'preserve' }
250+
);
254251
}
255252
}

‎apps/admin-gui/src/app/vos/components/related-vos/related-vos.component.html

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,7 @@
44
class="vo-link pointer"
55
[perunWebAppsMiddleClickRouterLink]="['/organizations', vo.id.toString()]"
66
(auxclick)="$event.preventDefault()"
7-
[perunWebAppsForceRouterLink]="['/organizations/', vo.id.toString()]"
8-
queryParamsHandling="merge">
7+
[perunWebAppsForceRouterLink]="['/organizations/', vo.id.toString()]">
98
{{vo.name}}
109
</a>
1110
<span *ngIf="vos.length > i+1">, </span>

0 commit comments

Comments
 (0)