[NIFI-13130] disabled autofocus for dialog with no form fields to prevent dialog from being focused on page refresh (#8742)

This closes #8742
This commit is contained in:
Scott Aslan 2024-05-03 16:27:30 -04:00 committed by GitHub
parent 0672bf3954
commit 9ddf8ffdd0
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
16 changed files with 33 additions and 20 deletions

View File

@ -622,7 +622,8 @@ export class ControllerServicesEffects {
tap((request) => { tap((request) => {
const dialogRequest = this.dialog.open(ChangeComponentVersionDialog, { const dialogRequest = this.dialog.open(ChangeComponentVersionDialog, {
...LARGE_DIALOG, ...LARGE_DIALOG,
data: request data: request,
autoFocus: false
}); });
dialogRequest.componentInstance.changeVersion.pipe(take(1)).subscribe((newVersion) => { dialogRequest.componentInstance.changeVersion.pipe(take(1)).subscribe((newVersion) => {

View File

@ -3398,7 +3398,8 @@ export class FlowEffects {
tap((request) => { tap((request) => {
const dialogRef = this.dialog.open(ChangeVersionDialog, { const dialogRef = this.dialog.open(ChangeVersionDialog, {
...LARGE_DIALOG, ...LARGE_DIALOG,
data: request data: request,
autoFocus: false
}); });
dialogRef.componentInstance.changeVersion.pipe(take(1)).subscribe((selectedVersion) => { dialogRef.componentInstance.changeVersion.pipe(take(1)).subscribe((selectedVersion) => {
@ -3427,7 +3428,8 @@ export class FlowEffects {
const dialogRef = this.dialog.open(ChangeVersionProgressDialog, { const dialogRef = this.dialog.open(ChangeVersionProgressDialog, {
...SMALL_DIALOG, ...SMALL_DIALOG,
minWidth: 365, minWidth: 365,
disableClose: true disableClose: true,
autoFocus: false
}); });
dialogRef.componentInstance.flowUpdateRequest$ = this.store.select(selectChangeVersionRequest); dialogRef.componentInstance.flowUpdateRequest$ = this.store.select(selectChangeVersionRequest);
dialogRef.componentInstance.changeVersionComplete.pipe(take(1)).subscribe((entity) => { dialogRef.componentInstance.changeVersionComplete.pipe(take(1)).subscribe((entity) => {
@ -3602,7 +3604,8 @@ export class FlowEffects {
const dialogRef = this.dialog.open(ChangeVersionProgressDialog, { const dialogRef = this.dialog.open(ChangeVersionProgressDialog, {
...SMALL_DIALOG, ...SMALL_DIALOG,
minWidth: 365, minWidth: 365,
disableClose: true disableClose: true,
autoFocus: false
}); });
dialogRef.componentInstance.flowUpdateRequest$ = this.store.select(selectChangeVersionRequest); dialogRef.componentInstance.flowUpdateRequest$ = this.store.select(selectChangeVersionRequest);
dialogRef.componentInstance.changeVersionComplete.pipe(take(1)).subscribe((entity) => { dialogRef.componentInstance.changeVersionComplete.pipe(take(1)).subscribe((entity) => {
@ -3771,7 +3774,8 @@ export class FlowEffects {
tap((request) => { tap((request) => {
const dialogRequest = this.dialog.open(ChangeComponentVersionDialog, { const dialogRequest = this.dialog.open(ChangeComponentVersionDialog, {
...LARGE_DIALOG, ...LARGE_DIALOG,
data: request data: request,
autoFocus: false
}); });
dialogRequest.componentInstance.changeVersion.pipe(take(1)).subscribe((newVersion) => { dialogRequest.componentInstance.changeVersion.pipe(take(1)).subscribe((newVersion) => {

View File

@ -16,7 +16,7 @@
--> -->
<h2 mat-dialog-title>Change Version</h2> <h2 mat-dialog-title>Change Version</h2>
<div class="change-version" tabindex="0"> <div class="change-version">
<mat-dialog-content> <mat-dialog-content>
<div class="flex flex-col gap-y-4 w-full"> <div class="flex flex-col gap-y-4 w-full">
<div class="flex flex-row w-full"> <div class="flex flex-row w-full">

View File

@ -501,7 +501,8 @@ export class FlowAnalysisRulesEffects {
tap((request) => { tap((request) => {
const dialogRequest = this.dialog.open(ChangeComponentVersionDialog, { const dialogRequest = this.dialog.open(ChangeComponentVersionDialog, {
...LARGE_DIALOG, ...LARGE_DIALOG,
data: request data: request,
autoFocus: false
}); });
dialogRequest.componentInstance.changeVersion.pipe(take(1)).subscribe((newVersion) => { dialogRequest.componentInstance.changeVersion.pipe(take(1)).subscribe((newVersion) => {

View File

@ -546,7 +546,8 @@ export class ManagementControllerServicesEffects {
tap((request) => { tap((request) => {
const dialogRequest = this.dialog.open(ChangeComponentVersionDialog, { const dialogRequest = this.dialog.open(ChangeComponentVersionDialog, {
...LARGE_DIALOG, ...LARGE_DIALOG,
data: request data: request,
autoFocus: false
}); });
dialogRequest.componentInstance.changeVersion.pipe(take(1)).subscribe((newVersion) => { dialogRequest.componentInstance.changeVersion.pipe(take(1)).subscribe((newVersion) => {

View File

@ -484,7 +484,8 @@ export class ParameterProvidersEffects {
tap((request) => { tap((request) => {
const dialogRef = this.dialog.open(FetchParameterProviderParameters, { const dialogRef = this.dialog.open(FetchParameterProviderParameters, {
...XL_DIALOG, ...XL_DIALOG,
data: request data: request,
autoFocus: false
}); });
const referencingParameterContexts = const referencingParameterContexts =

View File

@ -479,7 +479,8 @@ export class ReportingTasksEffects {
tap((request) => { tap((request) => {
const dialogRequest = this.dialog.open(ChangeComponentVersionDialog, { const dialogRequest = this.dialog.open(ChangeComponentVersionDialog, {
...LARGE_DIALOG, ...LARGE_DIALOG,
data: request data: request,
autoFocus: false
}); });
dialogRequest.componentInstance.changeVersion.pipe(take(1)).subscribe((newVersion) => { dialogRequest.componentInstance.changeVersion.pipe(take(1)).subscribe((newVersion) => {

View File

@ -15,7 +15,7 @@
~ limitations under the License. ~ limitations under the License.
--> -->
<div tabindex="0"> <div>
<h2 mat-dialog-title>Fetch Parameters</h2> <h2 mat-dialog-title>Fetch Parameters</h2>
<form class="parameter-provider-fetch-form" [formGroup]="fetchParametersForm"> <form class="parameter-provider-fetch-form" [formGroup]="fetchParametersForm">
<error-banner></error-banner> <error-banner></error-banner>

View File

@ -107,7 +107,8 @@ export class ComponentClusterStatusEffects {
tap(([response, request]) => { tap(([response, request]) => {
const dialogRef = this.dialog.open(ClusterSummaryDialog, { const dialogRef = this.dialog.open(ClusterSummaryDialog, {
...XL_DIALOG, ...XL_DIALOG,
data: request data: request,
autoFocus: false
}); });
dialogRef.componentInstance.componentType = response.componentType; dialogRef.componentInstance.componentType = response.componentType;
dialogRef.afterClosed().subscribe(() => { dialogRef.afterClosed().subscribe(() => {

View File

@ -15,7 +15,7 @@
~ limitations under the License. ~ limitations under the License.
--> -->
<div class="cluster-summary flex flex-col" tabindex="0"> <div class="cluster-summary flex flex-col">
<h2 mat-dialog-title>Cluster {{ componentType }} Summary</h2> <h2 mat-dialog-title>Cluster {{ componentType }} Summary</h2>
<mat-dialog-content class="cluster-summary-content flex flex-1 h-full grow"> <mat-dialog-content class="cluster-summary-content flex flex-1 h-full grow">
@ -79,7 +79,7 @@
<div class="accent-color font-medium">{{ loadedTimestamp$ | async }}</div> <div class="accent-color font-medium">{{ loadedTimestamp$ | async }}</div>
</div> </div>
<button mat-button mat-dialog-close tabindex="0">Close</button> <button mat-button mat-dialog-close>Close</button>
</div> </div>
</mat-dialog-actions> </mat-dialog-actions>
</div> </div>

View File

@ -673,7 +673,8 @@ export class UserListingEffects {
this.dialog this.dialog
.open(UserAccessPolicies, { .open(UserAccessPolicies, {
...LARGE_DIALOG, ...LARGE_DIALOG,
data: request data: request,
autoFocus: false
}) })
.afterClosed() .afterClosed()
.subscribe((response) => { .subscribe((response) => {

View File

@ -15,7 +15,7 @@
~ limitations under the License. ~ limitations under the License.
--> -->
<div class="user-access-policies" tabindex="0"> <div class="user-access-policies">
<h3 mat-dialog-title>User Policies</h3> <h3 mat-dialog-title>User Policies</h3>
<mat-dialog-content> <mat-dialog-content>
<div class="flex flex-col justify-between gap-y-3"> <div class="flex flex-col justify-between gap-y-3">

View File

@ -62,7 +62,8 @@ export class AboutEffects {
ofType(AboutActions.openAboutDialog), ofType(AboutActions.openAboutDialog),
tap(() => { tap(() => {
this.dialog.open(AboutDialog, { this.dialog.open(AboutDialog, {
...MEDIUM_DIALOG ...MEDIUM_DIALOG,
autoFocus: false
}); });
}) })
), ),

View File

@ -87,7 +87,8 @@ export class ComponentStateEffects {
ofType(ComponentStateActions.openComponentStateDialog), ofType(ComponentStateActions.openComponentStateDialog),
tap(() => { tap(() => {
const dialogReference = this.dialog.open(ComponentStateDialog, { const dialogReference = this.dialog.open(ComponentStateDialog, {
...LARGE_DIALOG ...LARGE_DIALOG,
autoFocus: false
}); });
dialogReference.afterClosed().subscribe(() => { dialogReference.afterClosed().subscribe(() => {

View File

@ -15,7 +15,7 @@
~ limitations under the License. ~ limitations under the License.
--> -->
<div class="about-dialog" tabindex="0"> <div class="about-dialog">
<h2 mat-dialog-title>About</h2> <h2 mat-dialog-title>About</h2>
<mat-dialog-content> <mat-dialog-content>
<div class="flex flex-col justify-between gap-y-5"> <div class="flex flex-col justify-between gap-y-5">

View File

@ -15,7 +15,7 @@
~ limitations under the License. ~ limitations under the License.
--> -->
<div class="component-state-dialog" tabindex="0"> <div class="component-state-dialog">
<h2 mat-dialog-title>Component State</h2> <h2 mat-dialog-title>Component State</h2>
<error-banner></error-banner> <error-banner></error-banner>
<mat-dialog-content> <mat-dialog-content>