From 4198880879ede885606876995669bf3a14574f5a Mon Sep 17 00:00:00 2001 From: Matt Gilman Date: Wed, 6 Nov 2024 11:16:37 -0500 Subject: [PATCH] NIFI-13960: Using the ExtensionCreation component when adding a Registry Client to better handle different bundles. (#9494) This closes #9494 --- .../settings/state/registry-clients/index.ts | 3 +- .../registry-clients.effects.ts | 4 +- .../create-registry-client.component.html | 57 ++----------------- .../create-registry-client.component.scss | 10 ---- .../create-registry-client.component.ts | 41 ++++--------- 5 files changed, 20 insertions(+), 95 deletions(-) diff --git a/nifi-frontend/src/main/frontend/apps/nifi/src/app/pages/settings/state/registry-clients/index.ts b/nifi-frontend/src/main/frontend/apps/nifi/src/app/pages/settings/state/registry-clients/index.ts index 73d8ce0c0d..e972ecadf8 100644 --- a/nifi-frontend/src/main/frontend/apps/nifi/src/app/pages/settings/state/registry-clients/index.ts +++ b/nifi-frontend/src/main/frontend/apps/nifi/src/app/pages/settings/state/registry-clients/index.ts @@ -15,7 +15,7 @@ * limitations under the License. */ -import { DocumentedType, RegistryClientEntity, Revision } from '../../../../state/shared'; +import { Bundle, DocumentedType, RegistryClientEntity, Revision } from '../../../../state/shared'; export const registryClientsFeatureKey = 'registryClients'; @@ -34,6 +34,7 @@ export interface CreateRegistryClientRequest { component: { name: string; type: string; + bundle: Bundle; description?: string; }; } diff --git a/nifi-frontend/src/main/frontend/apps/nifi/src/app/pages/settings/state/registry-clients/registry-clients.effects.ts b/nifi-frontend/src/main/frontend/apps/nifi/src/app/pages/settings/state/registry-clients/registry-clients.effects.ts index bc4270553c..ae69cc414d 100644 --- a/nifi-frontend/src/main/frontend/apps/nifi/src/app/pages/settings/state/registry-clients/registry-clients.effects.ts +++ b/nifi-frontend/src/main/frontend/apps/nifi/src/app/pages/settings/state/registry-clients/registry-clients.effects.ts @@ -36,7 +36,7 @@ import { PropertyTableHelperService } from '../../../../service/property-table-h import * as ErrorActions from '../../../../state/error/error.actions'; import { ErrorHelper } from '../../../../service/error-helper.service'; import { HttpErrorResponse } from '@angular/common/http'; -import { LARGE_DIALOG, MEDIUM_DIALOG, SMALL_DIALOG } from 'libs/shared/src'; +import { LARGE_DIALOG, SMALL_DIALOG } from 'libs/shared/src'; import { BackNavigation } from '../../../../state/navigation'; import { ErrorContextKey } from '../../../../state/error'; @@ -82,7 +82,7 @@ export class RegistryClientsEffects { concatLatestFrom(() => this.store.select(selectRegistryClientTypes)), tap(([, registryClientTypes]) => { const dialogReference = this.dialog.open(CreateRegistryClient, { - ...MEDIUM_DIALOG, + ...LARGE_DIALOG, data: { registryClientTypes } diff --git a/nifi-frontend/src/main/frontend/apps/nifi/src/app/pages/settings/ui/registry-clients/create-registry-client/create-registry-client.component.html b/nifi-frontend/src/main/frontend/apps/nifi/src/app/pages/settings/ui/registry-clients/create-registry-client/create-registry-client.component.html index c5742e86ce..56dfb9323f 100644 --- a/nifi-frontend/src/main/frontend/apps/nifi/src/app/pages/settings/ui/registry-clients/create-registry-client/create-registry-client.component.html +++ b/nifi-frontend/src/main/frontend/apps/nifi/src/app/pages/settings/ui/registry-clients/create-registry-client/create-registry-client.component.html @@ -15,55 +15,8 @@ ~ limitations under the License. --> -

Add Registry Client

-
- -
- - Name - - -
-
- - Type - - @for (option of request.registryClientTypes; track option) { - @if (option.description) { - - {{ formatType(option) }} - - } @else { - - {{ formatType(option) }} - - } - } - - -
-
- - Description - - -
- - @if ({ value: (saving$ | async)! }; as saving) { - - - - - } -
+ diff --git a/nifi-frontend/src/main/frontend/apps/nifi/src/app/pages/settings/ui/registry-clients/create-registry-client/create-registry-client.component.scss b/nifi-frontend/src/main/frontend/apps/nifi/src/app/pages/settings/ui/registry-clients/create-registry-client/create-registry-client.component.scss index b00835bec4..2944f98194 100644 --- a/nifi-frontend/src/main/frontend/apps/nifi/src/app/pages/settings/ui/registry-clients/create-registry-client/create-registry-client.component.scss +++ b/nifi-frontend/src/main/frontend/apps/nifi/src/app/pages/settings/ui/registry-clients/create-registry-client/create-registry-client.component.scss @@ -14,13 +14,3 @@ * See the License for the specific language governing permissions and * limitations under the License. */ - -@use '@angular/material' as mat; - -.create-registry-client-form { - @include mat.button-density(-1); - - .mat-mdc-form-field { - width: 100%; - } -} diff --git a/nifi-frontend/src/main/frontend/apps/nifi/src/app/pages/settings/ui/registry-clients/create-registry-client/create-registry-client.component.ts b/nifi-frontend/src/main/frontend/apps/nifi/src/app/pages/settings/ui/registry-clients/create-registry-client/create-registry-client.component.ts index 46390617bb..b01bc66a62 100644 --- a/nifi-frontend/src/main/frontend/apps/nifi/src/app/pages/settings/ui/registry-clients/create-registry-client/create-registry-client.component.ts +++ b/nifi-frontend/src/main/frontend/apps/nifi/src/app/pages/settings/ui/registry-clients/create-registry-client/create-registry-client.component.ts @@ -17,7 +17,7 @@ import { Component, EventEmitter, Inject, Input, Output } from '@angular/core'; import { MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog'; -import { FormBuilder, FormControl, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms'; +import { ReactiveFormsModule } from '@angular/forms'; import { MatInputModule } from '@angular/material/input'; import { MatCheckboxModule } from '@angular/material/checkbox'; import { MatButtonModule } from '@angular/material/button'; @@ -30,7 +30,7 @@ import { Client } from '../../../../../service/client.service'; import { MatSelectModule } from '@angular/material/select'; import { NiFiCommon, TextTip, NifiTooltipDirective } from '@nifi/shared'; import { ClusterConnectionService } from '../../../../../service/cluster-connection.service'; -import { CloseOnEscapeDialog } from '@nifi/shared'; +import { ExtensionCreation } from '../../../../../ui/common/extension-creation/extension-creation.component'; @Component({ selector: 'create-registry-client', @@ -45,45 +45,30 @@ import { CloseOnEscapeDialog } from '@nifi/shared'; AsyncPipe, NifiSpinnerDirective, MatSelectModule, - NifiTooltipDirective + NifiTooltipDirective, + ExtensionCreation ], styleUrls: ['./create-registry-client.component.scss'] }) -export class CreateRegistryClient extends CloseOnEscapeDialog { +export class CreateRegistryClient { @Input() saving$!: Observable; @Output() createRegistryClient: EventEmitter = new EventEmitter(); protected readonly TextTip = TextTip; - createRegistryClientForm: FormGroup; + registryClientTypes: DocumentedType[]; constructor( @Inject(MAT_DIALOG_DATA) public request: CreateRegistryClientDialogRequest, - private formBuilder: FormBuilder, private nifiCommon: NiFiCommon, private client: Client, private clusterConnectionService: ClusterConnectionService ) { - super(); - let type: string | null = null; - if (request.registryClientTypes.length > 0) { - type = request.registryClientTypes[0].type; - } - - // build the form - this.createRegistryClientForm = this.formBuilder.group({ - name: new FormControl('', Validators.required), - type: new FormControl(type, Validators.required), - description: new FormControl('') - }); + this.registryClientTypes = request.registryClientTypes; } - formatType(option: DocumentedType): string { - return this.nifiCommon.getComponentTypeLabel(option.type); - } - - createRegistryClientClicked() { + registryClientTypeSelected(registryClientType: DocumentedType) { const request: CreateRegistryClientRequest = { revision: { clientId: this.client.getClientId(), @@ -91,16 +76,12 @@ export class CreateRegistryClient extends CloseOnEscapeDialog { }, disconnectedNodeAcknowledged: this.clusterConnectionService.isDisconnectionAcknowledged(), component: { - name: this.createRegistryClientForm.get('name')?.value, - type: this.createRegistryClientForm.get('type')?.value, - description: this.createRegistryClientForm.get('description')?.value + name: this.nifiCommon.getComponentTypeLabel(registryClientType.type), + type: registryClientType.type, + bundle: registryClientType.bundle } }; this.createRegistryClient.next(request); } - - override isDirty(): boolean { - return this.createRegistryClientForm.dirty; - } }