rfellows commented on code in PR #8068:
URL: https://github.com/apache/nifi/pull/8068#discussion_r1407679755
##########
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/property-table/editors/combo-editor/combo-editor.component.ts:
##########
@@ -55,79 +57,196 @@ export interface AllowableValueItem extends AllowableValue
{
NgForOf,
MatTooltipModule,
NgIf,
- A11yModule
+ A11yModule,
+ NgxSkeletonLoaderModule
],
styleUrls: ['./combo-editor.component.scss']
})
export class ComboEditor {
@Input() set item(item: PropertyItem) {
- this.itemLookup.clear();
- this.descriptor = item.descriptor;
- this.allowableValues = [];
-
- let i: number = 0;
- let selectedItem: AllowableValueItem | null = null;
-
- if (!this.descriptor.required) {
- const noValue: AllowableValueItem = {
- id: i++,
- displayName: 'No value',
- value: null
- };
- this.itemLookup.set(noValue.id, noValue);
- this.allowableValues.push(noValue);
-
- if (noValue.value == item.value) {
- selectedItem = noValue;
- }
+ if (item.value != null) {
+ this.configuredValue = item.value;
+ } else if (item.descriptor.defaultValue != null) {
+ this.configuredValue = item.descriptor.defaultValue;
}
- const allowableValueItems: AllowableValueItem[] =
this.descriptor.allowableValues.map(
- (allowableValueEntity) => {
- const allowableValue: AllowableValueItem = {
- ...allowableValueEntity.allowableValue,
- id: i++
- };
- this.itemLookup.set(allowableValue.id, allowableValue);
+ this.descriptor = item.descriptor;
+ this.sensitive = item.descriptor.sensitive;
- if (allowableValue.value == item.value) {
- selectedItem = allowableValue;
- }
+ this.itemSet = true;
+ this.initialAllowableValues();
+ }
- return allowableValue;
- }
- );
- this.allowableValues.push(...allowableValueItems);
+ @Input() set getParameters(getParameters: (sensitive: boolean) =>
Observable<Parameter[]>) {
+ this._getParameters = getParameters;
- if (selectedItem) {
- // mat-select does not have good support for options with null
value so we've
- // introduced a mapping to work around the shortcoming
- this.comboEditorForm.get('value')?.setValue(selectedItem.id);
- }
+ this.supportsParameters = true;
+ this.initialAllowableValues();
}
- @Input() supportsParameters: boolean = false;
@Output() ok: EventEmitter<any> = new EventEmitter<any>();
@Output() cancel: EventEmitter<void> = new EventEmitter<void>();
protected readonly TextTip = TextTip;
itemLookup: Map<number, AllowableValueItem> = new Map<number,
AllowableValueItem>();
+ referencesParametersId: number = -1;
+ configuredParameterId: number = -1;
comboEditorForm: FormGroup;
descriptor!: PropertyDescriptor;
allowableValues!: AllowableValueItem[];
+ showParameterAllowableValues: boolean = false;
+ parameterAllowableValues!: AllowableValueItem[];
+
+ sensitive: boolean = false;
+ supportsParameters: boolean = false;
+ parametersLoaded: boolean = false;
+
+ itemSet: boolean = false;
+ configuredValue: string | null = null;
+ _getParameters!: (sensitive: boolean) => Observable<Parameter[]>;
+
constructor(private formBuilder: FormBuilder) {
this.comboEditorForm = this.formBuilder.group({
value: new FormControl(null, Validators.required)
});
}
+ initialAllowableValues(): void {
+ if (this.itemSet) {
+ this.itemLookup.clear();
+ this.allowableValues = [];
+ this.referencesParametersId = -1;
+
+ let i: number = 0;
+ let selectedItem: AllowableValueItem | null = null;
+
+ if (!this.descriptor.required) {
+ const noValue: AllowableValueItem = {
+ id: i++,
+ displayName: 'No value',
+ value: null
+ };
+ this.itemLookup.set(noValue.id, noValue);
+ this.allowableValues.push(noValue);
+
+ if (noValue.value == this.configuredValue) {
+ selectedItem = noValue;
+ }
+ }
+
+ if (this.descriptor.allowableValues) {
+ const allowableValueItems: AllowableValueItem[] =
this.descriptor.allowableValues.map(
+ (allowableValueEntity) => {
+ const allowableValue: AllowableValueItem = {
+ ...allowableValueEntity.allowableValue,
+ id: i++
+ };
+ this.itemLookup.set(allowableValue.id, allowableValue);
+
+ if (allowableValue.value == this.configuredValue) {
+ selectedItem = allowableValue;
+ }
+
+ return allowableValue;
+ }
+ );
+ this.allowableValues.push(...allowableValueItems);
+ }
+
+ if (this.supportsParameters) {
+ this.parametersLoaded = false;
+
+ // parameters are supported so add the item to support showing
+ // and hiding the parameter options select
+ const referencesParameterOption: AllowableValueItem = {
+ id: i++,
+ displayName: 'Reference Parameter...',
+ value: null
+ };
Review Comment:
This should be gated by checking that there is an available parameter
context. Otherwise, the getParameters ends up being undefined as it is never
set in `flow.effects.ts#openEditProcessorDialog$`. In this case, the skeleton
loader never goes away and the combo editor overlay is placed in the upper left
corner of the screen.
console error as well...
```
ERROR TypeError: this._getParameters is not a function
at ComboEditor.initialAllowableValues (combo-editor.component.ts:184:22)
at set getParameters [as getParameters] (combo-editor.component.ts:84:14)
at writeToDirectiveInput (core.mjs:12296:34)
at setInputsForProperty (core.mjs:12530:9)
at elementPropertyInternal (core.mjs:11821:9)
at ɵɵproperty (core.mjs:15655:9)
at PropertyTable_ng_template_21_combo_editor_0_Template
(property-table.component.html:147:36)
at ReactiveLViewConsumer.runInContext (core.mjs:11103:13)
at executeTemplate (core.mjs:11404:22)
at refreshView (core.mjs:12898:13)
```
##########
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/property-table/editors/combo-editor/combo-editor.component.ts:
##########
@@ -55,79 +57,196 @@ export interface AllowableValueItem extends AllowableValue
{
NgForOf,
MatTooltipModule,
NgIf,
- A11yModule
+ A11yModule,
+ NgxSkeletonLoaderModule
],
styleUrls: ['./combo-editor.component.scss']
})
export class ComboEditor {
@Input() set item(item: PropertyItem) {
- this.itemLookup.clear();
- this.descriptor = item.descriptor;
- this.allowableValues = [];
-
- let i: number = 0;
- let selectedItem: AllowableValueItem | null = null;
-
- if (!this.descriptor.required) {
- const noValue: AllowableValueItem = {
- id: i++,
- displayName: 'No value',
- value: null
- };
- this.itemLookup.set(noValue.id, noValue);
- this.allowableValues.push(noValue);
-
- if (noValue.value == item.value) {
- selectedItem = noValue;
- }
+ if (item.value != null) {
+ this.configuredValue = item.value;
+ } else if (item.descriptor.defaultValue != null) {
+ this.configuredValue = item.descriptor.defaultValue;
}
- const allowableValueItems: AllowableValueItem[] =
this.descriptor.allowableValues.map(
- (allowableValueEntity) => {
- const allowableValue: AllowableValueItem = {
- ...allowableValueEntity.allowableValue,
- id: i++
- };
- this.itemLookup.set(allowableValue.id, allowableValue);
+ this.descriptor = item.descriptor;
+ this.sensitive = item.descriptor.sensitive;
- if (allowableValue.value == item.value) {
- selectedItem = allowableValue;
- }
+ this.itemSet = true;
+ this.initialAllowableValues();
+ }
- return allowableValue;
- }
- );
- this.allowableValues.push(...allowableValueItems);
+ @Input() set getParameters(getParameters: (sensitive: boolean) =>
Observable<Parameter[]>) {
+ this._getParameters = getParameters;
- if (selectedItem) {
- // mat-select does not have good support for options with null
value so we've
- // introduced a mapping to work around the shortcoming
- this.comboEditorForm.get('value')?.setValue(selectedItem.id);
- }
+ this.supportsParameters = true;
+ this.initialAllowableValues();
}
- @Input() supportsParameters: boolean = false;
@Output() ok: EventEmitter<any> = new EventEmitter<any>();
@Output() cancel: EventEmitter<void> = new EventEmitter<void>();
protected readonly TextTip = TextTip;
itemLookup: Map<number, AllowableValueItem> = new Map<number,
AllowableValueItem>();
+ referencesParametersId: number = -1;
+ configuredParameterId: number = -1;
comboEditorForm: FormGroup;
descriptor!: PropertyDescriptor;
allowableValues!: AllowableValueItem[];
+ showParameterAllowableValues: boolean = false;
+ parameterAllowableValues!: AllowableValueItem[];
+
+ sensitive: boolean = false;
+ supportsParameters: boolean = false;
+ parametersLoaded: boolean = false;
+
+ itemSet: boolean = false;
+ configuredValue: string | null = null;
+ _getParameters!: (sensitive: boolean) => Observable<Parameter[]>;
+
constructor(private formBuilder: FormBuilder) {
this.comboEditorForm = this.formBuilder.group({
value: new FormControl(null, Validators.required)
});
}
+ initialAllowableValues(): void {
+ if (this.itemSet) {
+ this.itemLookup.clear();
+ this.allowableValues = [];
+ this.referencesParametersId = -1;
+
+ let i: number = 0;
+ let selectedItem: AllowableValueItem | null = null;
+
+ if (!this.descriptor.required) {
+ const noValue: AllowableValueItem = {
+ id: i++,
+ displayName: 'No value',
+ value: null
+ };
+ this.itemLookup.set(noValue.id, noValue);
+ this.allowableValues.push(noValue);
+
+ if (noValue.value == this.configuredValue) {
+ selectedItem = noValue;
+ }
+ }
+
+ if (this.descriptor.allowableValues) {
+ const allowableValueItems: AllowableValueItem[] =
this.descriptor.allowableValues.map(
+ (allowableValueEntity) => {
+ const allowableValue: AllowableValueItem = {
+ ...allowableValueEntity.allowableValue,
+ id: i++
+ };
+ this.itemLookup.set(allowableValue.id, allowableValue);
+
+ if (allowableValue.value == this.configuredValue) {
+ selectedItem = allowableValue;
+ }
+
+ return allowableValue;
+ }
+ );
+ this.allowableValues.push(...allowableValueItems);
+ }
+
+ if (this.supportsParameters) {
+ this.parametersLoaded = false;
+
+ // parameters are supported so add the item to support showing
+ // and hiding the parameter options select
+ const referencesParameterOption: AllowableValueItem = {
+ id: i++,
+ displayName: 'Reference Parameter...',
+ value: null
+ };
Review Comment:
This should be gated by checking that there is an available parameter
context. Otherwise, the getParameters ends up being undefined as it is never
set in `flow.effects.ts#openEditProcessorDialog$`. In this case, the skeleton
loader never goes away and the combo editor overlay is placed in the upper left
corner of the screen.
console error as well...
```
ERROR TypeError: this._getParameters is not a function
at ComboEditor.initialAllowableValues (combo-editor.component.ts:184:22)
at set getParameters [as getParameters] (combo-editor.component.ts:84:14)
at writeToDirectiveInput (core.mjs:12296:34)
at setInputsForProperty (core.mjs:12530:9)
at elementPropertyInternal (core.mjs:11821:9)
at ɵɵproperty (core.mjs:15655:9)
at PropertyTable_ng_template_21_combo_editor_0_Template
(property-table.component.html:147:36)
at ReactiveLViewConsumer.runInContext (core.mjs:11103:13)
at executeTemplate (core.mjs:11404:22)
at refreshView (core.mjs:12898:13)
```
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]