Apache
/
nifi
mirror of https://github.com/apache/nifi.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

NIFI-13290: (#8871) 

- Manually closing dialogs with proper result in Navigation lifecycle to ensure back/forward browser button works correctly. This change also handles any scenario when a user routes away from a dialog via a link or go to action so we were able to remove the dialog close action form those places.
This commit is contained in:
Matt Gilman 2024-05-28 12:39:08 -04:00 committed by GitHub
parent a1a7c3c5a5
commit 94b6e424b3
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
16 changed files with 25 additions and 65 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/app.component.ts
View File

@ -16,10 +16,11 @@
*/
import { Component } from '@angular/core';
import { GuardsCheckEnd, GuardsCheckStart, NavigationCancel, Router } from '@angular/router';
import { GuardsCheckEnd, GuardsCheckStart, NavigationCancel, NavigationStart, Router } from '@angular/router';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import { Storage } from './service/storage.service';
import { ThemingService } from './service/theming.service';
import { MatDialog } from '@angular/material/dialog';
@Component({
selector: 'nifi',
@ -33,9 +34,13 @@ export class AppComponent {
constructor(
private router: Router,
private storage: Storage,
private themingService: ThemingService
private themingService: ThemingService,
private dialog: MatDialog
) {
this.router.events.pipe(takeUntilDestroyed()).subscribe((event) => {
if (event instanceof NavigationStart) {
this.dialog.openDialogs.forEach((dialog) => dialog.close('ROUTED'));
}
if (event instanceof GuardsCheckStart) {
this.guardLoading = true;
}

12
nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/index.ts
View File

@ -20,20 +20,24 @@ import { MatDialogConfig } from '@angular/material/dialog';
export const SMALL_DIALOG: MatDialogConfig = {
maxWidth: '24rem',
minWidth: 320,
disableClose: true
disableClose: true,
closeOnNavigation: false
};
export const MEDIUM_DIALOG: MatDialogConfig = {
maxWidth: 470,
minWidth: 470,
disableClose: true
disableClose: true,
closeOnNavigation: false
};
export const LARGE_DIALOG: MatDialogConfig = {
maxWidth: 760,
minWidth: 760,
disableClose: true
disableClose: true,
closeOnNavigation: false
};
export const XL_DIALOG: MatDialogConfig = {
maxWidth: 1024,
minWidth: 1024,
disableClose: true
disableClose: true,
closeOnNavigation: false
};

8
nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/state/controller-services/controller-services.effects.ts
View File

@ -321,11 +321,9 @@ export class ControllerServicesEffects {
});
saveChangesDialogReference.componentInstance.no.pipe(take(1)).subscribe(() => {
editDialogReference.close('ROUTED');
this.router.navigate(commands);
});
} else {
editDialogReference.close('ROUTED');
this.router.navigate(commands);
}
};
@ -443,7 +441,6 @@ export class ControllerServicesEffects {
})
);
} else {
this.dialog.getDialogById(request.id)?.close('ROUTED');
return of(this.errorHelper.fullScreenError(errorResponse));
}
})
@ -468,7 +465,6 @@ export class ControllerServicesEffects {
tap((response) => {
if (response.postUpdateNavigation) {
this.router.navigate(response.postUpdateNavigation);
this.dialog.getDialogById(response.id)?.close('ROUTED');
} else {
this.dialog.closeAll();
}
@ -495,8 +491,6 @@ export class ControllerServicesEffects {
enableDialogReference.componentInstance.goToReferencingComponent = (
component: ControllerServiceReferencingComponent
) => {
enableDialogReference.close('ROUTED');
const route: string[] = this.getRouteForReference(component);
this.router.navigate(route);
};
@ -535,8 +529,6 @@ export class ControllerServicesEffects {
enableDialogReference.componentInstance.goToReferencingComponent = (
component: ControllerServiceReferencingComponent
) => {
enableDialogReference.close('ROUTED');
const route: string[] = this.getRouteForReference(component);
this.router.navigate(route);
};

4
nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/state/flow/flow.effects.ts
View File

@ -1342,11 +1342,9 @@ export class FlowEffects {
});
saveChangesDialogReference.componentInstance.no.pipe(take(1)).subscribe(() => {
editDialogReference.close('ROUTED');
this.router.navigate(commands);
});
} else {
editDialogReference.close('ROUTED');
this.router.navigate(commands);
}
};
@ -1666,7 +1664,6 @@ export class FlowEffects {
tap((response) => {
if (response.postUpdateNavigation) {
this.router.navigate(response.postUpdateNavigation);
this.dialog.getDialogById(response.id)?.close('ROUTED');
} else {
this.dialog.closeAll();
}
@ -1727,7 +1724,6 @@ export class FlowEffects {
tap((response) => {
if (response.postUpdateNavigation) {
this.router.navigate(response.postUpdateNavigation);
this.dialog.getDialogById(response.id)?.close('ROUTED');
} else {
this.dialog.closeAll();
}

2
nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/state/manage-remote-ports/manage-remote-ports.effects.ts
View File

@ -221,6 +221,7 @@ export class ManageRemotePortsEffects {
editDialogReference.afterClosed().subscribe((response) => {
this.store.dispatch(ErrorActions.clearBannerErrors());
if (response != 'ROUTED') {
this.store.dispatch(
ManageRemotePortsActions.selectRemotePort({
@ -259,7 +260,6 @@ export class ManageRemotePortsEffects {
})
);
} else {
this.dialog.getDialogById(request.id)?.close('ROUTED');
return of(this.errorHelper.fullScreenError(errorResponse));
}
})

4
nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/parameter-contexts/ui/parameter-context-listing/edit-parameter-context/edit-parameter-context.component.html
View File

@ -98,9 +98,7 @@
@if (parameterProvider) {
<div class="flex flex-col mb-5">
<div>Parameter Provider</div>
<a
[routerLink]="getParameterProviderLink(parameterProvider)"
mat-dialog-close="ROUTED">
<a [routerLink]="getParameterProviderLink(parameterProvider)">
{{ parameterProvider.parameterGroupName }}
from
{{ parameterProvider.parameterProviderName }}

5
nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/parameter-contexts/ui/parameter-context-listing/parameter-table/parameter-table.component.html
View File

@ -116,10 +116,7 @@
}
<mat-menu #actionMenu="matMenu" xPosition="before">
@if (canGoToParameter(item)) {
<button
mat-menu-item
[routerLink]="getParameterLink(item)"
mat-dialog-close="ROUTED">
<button mat-menu-item [routerLink]="getParameterLink(item)">
<i class="fa fa-long-arrow-right primary-color mr-2"></i>
Go to
</button>

4
nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/parameter-contexts/ui/parameter-context-listing/process-group-references/process-group-references.component.html
View File

@ -53,9 +53,7 @@
@if (references.length > 0) {
@for (reference of references; track reference) {
<li>
<a [routerLink]="getRouteForReference(reference)" mat-dialog-close="ROUTED">{{
reference.component.name
}}</a>
<a [routerLink]="getRouteForReference(reference)">{{ reference.component.name }}</a>
</li>
}
}

3
nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/state/flow-analysis-rules/flow-analysis-rules.effects.ts
View File

@ -305,11 +305,9 @@ export class FlowAnalysisRulesEffects {
});
saveChangesDialogReference.componentInstance.no.pipe(take(1)).subscribe(() => {
editDialogReference.close('ROUTED');
this.router.navigate(commands);
});
} else {
editDialogReference.close('ROUTED');
this.router.navigate(commands);
}
};
@ -395,7 +393,6 @@ export class FlowAnalysisRulesEffects {
tap((response) => {
if (response.postUpdateNavigation) {
this.router.navigate(response.postUpdateNavigation);
this.dialog.getDialogById(response.id)?.close('ROUTED');
} else {
this.dialog.closeAll();
}

8
nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/state/management-controller-services/management-controller-services.effects.ts
View File

@ -278,11 +278,9 @@ export class ManagementControllerServicesEffects {
});
saveChangesDialogReference.componentInstance.no.pipe(take(1)).subscribe(() => {
editDialogReference.close('ROUTED');
this.router.navigate(commands);
});
} else {
editDialogReference.close('ROUTED');
this.router.navigate(commands);
}
};
@ -372,7 +370,6 @@ export class ManagementControllerServicesEffects {
})
);
} else {
this.dialog.getDialogById(request.id)?.close('ROUTED');
return of(this.errorHelper.fullScreenError(errorResponse));
}
})
@ -405,7 +402,6 @@ export class ManagementControllerServicesEffects {
tap((response) => {
if (response.postUpdateNavigation) {
this.router.navigate(response.postUpdateNavigation);
this.dialog.getDialogById(response.id)?.close('ROUTED');
} else {
this.dialog.closeAll();
}
@ -431,8 +427,6 @@ export class ManagementControllerServicesEffects {
enableDialogReference.componentInstance.goToReferencingComponent = (
component: ControllerServiceReferencingComponent
) => {
enableDialogReference.close('ROUTED');
const route: string[] = this.getRouteForReference(component);
this.router.navigate(route);
};
@ -464,8 +458,6 @@ export class ManagementControllerServicesEffects {
enableDialogReference.componentInstance.goToReferencingComponent = (
component: ControllerServiceReferencingComponent
) => {
enableDialogReference.close('ROUTED');
const route: string[] = this.getRouteForReference(component);
this.router.navigate(route);
};

4
nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/state/parameter-providers/parameter-providers.effects.ts
View File

@ -349,11 +349,9 @@ export class ParameterProvidersEffects {
});
promptSaveDialogRef.componentInstance.no.pipe(take(1)).subscribe(() => {
editDialogReference.close('ROUTED');
this.router.navigate(commands);
});
} else {
editDialogReference.close('ROUTED');
this.router.navigate(commands);
}
};
@ -435,7 +433,6 @@ export class ParameterProvidersEffects {
})
);
} else {
this.dialog.getDialogById(request.id)?.close('ROUTED');
return of(this.errorHelper.fullScreenError(errorResponse));
}
})
@ -452,7 +449,6 @@ export class ParameterProvidersEffects {
tap((response) => {
if (response.postUpdateNavigation) {
this.router.navigate(response.postUpdateNavigation);
this.dialog.getDialogById(response.id)?.close('ROUTED');
} else {
this.dialog.closeAll();
}

3
nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/state/registry-clients/registry-clients.effects.ts
View File

@ -209,11 +209,9 @@ export class RegistryClientsEffects {
});
saveChangesDialogReference.componentInstance.no.pipe(take(1)).subscribe(() => {
editDialogReference.close('ROUTED');
this.router.navigate(commands);
});
} else {
editDialogReference.close('ROUTED');
this.router.navigate(commands);
}
};
@ -288,7 +286,6 @@ export class RegistryClientsEffects {
tap((response) => {
if (response.postUpdateNavigation) {
this.router.navigate(response.postUpdateNavigation);
this.dialog.getDialogById(response.id)?.close('ROUTED');
} else {
this.dialog.closeAll();
}

3
nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/state/reporting-tasks/reporting-tasks.effects.ts
View File

@ -317,11 +317,9 @@ export class ReportingTasksEffects {
});
saveChangesDialogReference.componentInstance.no.pipe(take(1)).subscribe(() => {
editDialogReference.close('ROUTED');
this.router.navigate(commands);
});
} else {
editDialogReference.close('ROUTED');
this.router.navigate(commands);
}
};
@ -407,7 +405,6 @@ export class ReportingTasksEffects {
tap((response) => {
if (response.postUpdateNavigation) {
this.router.navigate(response.postUpdateNavigation);
this.dialog.getDialogById(response.id)?.close('ROUTED');
} else {
this.dialog.closeAll();
}

5
nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/users/ui/user-listing/user-access-policies/user-access-policies.component.html
View File

@ -71,10 +71,7 @@
}
<mat-menu #actionMenu="matMenu" xPosition="before">
@if (canGoToPolicyTarget(item)) {
<button
mat-menu-item
[routerLink]="getPolicyTargetLink(item)"
mat-dialog-close="ROUTED">
<button mat-menu-item [routerLink]="getPolicyTargetLink(item)">
<i class="fa fa-long-arrow-right primary-color mr-2"></i>
Go to
</button>

6
nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/state/error/error.effects.ts
View File

@ -21,15 +21,13 @@ import * as ErrorActions from './error.actions';
import { map, tap } from 'rxjs';
import { Router } from '@angular/router';
import { MatSnackBar } from '@angular/material/snack-bar';
import { MatDialog } from '@angular/material/dialog';
@Injectable()
export class ErrorEffects {
constructor(
private actions$: Actions,
private router: Router,
private snackBar: MatSnackBar,
private dialog: MatDialog
private snackBar: MatSnackBar
) {}
fullScreenError$ = createEffect(
@ -38,8 +36,6 @@ export class ErrorEffects {
ofType(ErrorActions.fullScreenError),
map((action) => action.skipReplaceUrl),
tap((skipReplaceUrl) => {
this.dialog.openDialogs.forEach((dialog) => dialog.close('ROUTED'));
if (skipReplaceUrl) {
this.router.navigate(['/error']);
} else {

10
nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/parameter-references/parameter-references.component.html
View File

@ -66,7 +66,7 @@
} @else {
<div [ngClass]="getNonServiceStateIcon(reference.component)"></div>
}
<a [routerLink]="getRouteForReference(reference.component)" mat-dialog-close="ROUTED">{{
<a [routerLink]="getRouteForReference(reference.component)">{{
reference.component.name
}}</a>
@if (hasBulletins(reference)) {
@ -102,11 +102,9 @@
} @else {
<div [ngClass]="getServiceStateIcon(service.component)"></div>
}
<a
[routerLink]="getRouteForReference(service.component)"
mat-dialog-close="ROUTED"
>{{ service.component.name }}</a
>
<a [routerLink]="getRouteForReference(service.component)">
{{ service.component.name }}
</a>
@if (hasBulletins(service)) {
<div
class="pointer fa fa-sticky-note-o primary-color"