[DSC-1557] Fix issue with type-bind when dc.type is provided via metadata enrichment

Author: atarix83

src/app/shared/form/builder/ds-dynamic-form-ui/ds-dynamic-form-control-container.component.ts

@@ -3,7 +3,8 @@ import {
   Component,
   ComponentFactoryResolver,
   ContentChildren,
-  EventEmitter, Inject,
+  EventEmitter,
+  Inject,
   Input,
   NgZone,
   OnChanges,
@@ -58,7 +59,9 @@ import { TranslateService } from '@ngx-translate/core';
 import { ReorderableRelationship } from './existing-metadata-list-element/existing-metadata-list-element.component';
 
 import { DYNAMIC_FORM_CONTROL_TYPE_ONEBOX } from './models/onebox/dynamic-onebox.model';
-import { DYNAMIC_FORM_CONTROL_TYPE_SCROLLABLE_DROPDOWN } from './models/scrollable-dropdown/dynamic-scrollable-dropdown.model';
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_SCROLLABLE_DROPDOWN
+} from './models/scrollable-dropdown/dynamic-scrollable-dropdown.model';
 import { DYNAMIC_FORM_CONTROL_TYPE_TAG } from './models/tag/dynamic-tag.model';
 import { DYNAMIC_FORM_CONTROL_TYPE_DSDATEPICKER } from './models/date-picker/date-picker.model';
 import { DYNAMIC_FORM_CONTROL_TYPE_LOOKUP } from './models/lookup/dynamic-lookup.model';
@@ -70,7 +73,9 @@ import { DsDynamicTagComponent } from './models/tag/dynamic-tag.component';
 import { DsDatePickerComponent } from './models/date-picker/date-picker.component';
 import { DsDynamicListComponent } from './models/list/dynamic-list.component';
 import { DsDynamicOneboxComponent } from './models/onebox/dynamic-onebox.component';
-import { DsDynamicScrollableDropdownComponent } from './models/scrollable-dropdown/dynamic-scrollable-dropdown.component';
+import {
+  DsDynamicScrollableDropdownComponent
+} from './models/scrollable-dropdown/dynamic-scrollable-dropdown.component';
 import { DsDynamicLookupComponent } from './models/lookup/dynamic-lookup.component';
 import { DsDynamicFormGroupComponent } from './models/form-group/dynamic-form-group.component';
 import { DsDynamicFormArrayComponent } from './models/array-group/dynamic-form-array.component';
@@ -82,7 +87,9 @@ import { CustomSwitchComponent } from './models/custom-switch/custom-switch.comp
 import { find, map, startWith, switchMap, take } from 'rxjs/operators';
 import { combineLatest as observableCombineLatest, Observable, Subscription } from 'rxjs';
 import { DsDynamicTypeBindRelationService } from './ds-dynamic-type-bind-relation.service';
-import { DsDynamicRelationInlineGroupComponent } from './models/relation-inline-group/dynamic-relation-inline-group.components';
+import {
+  DsDynamicRelationInlineGroupComponent
+} from './models/relation-inline-group/dynamic-relation-inline-group.components';
 import { SearchResult } from '../../../search/models/search-result.model';
 import { DSpaceObject } from '../../../../core/shared/dspace-object.model';
 import { NgbModal, NgbModalRef } from '@ng-bootstrap/ng-bootstrap';
@@ -497,6 +504,7 @@ export class DsDynamicFormControlContainerComponent extends DynamicFormControlCo
    * Unsubscribe from all subscriptions
    */
   ngOnDestroy(): void {
+    super.ngOnDestroy();
     this.subs
       .filter((sub) => hasValue(sub))
       .forEach((sub) => sub.unsubscribe());

src/app/shared/form/builder/ds-dynamic-form-ui/ds-dynamic-type-bind-relation.service.spec.ts

@@ -39,7 +39,7 @@ describe('DSDynamicTypeBindRelationService test suite', () => {
 
   beforeEach(inject([DsDynamicTypeBindRelationService, DynamicFormRelationService],
     (relationService: DsDynamicTypeBindRelationService,
-     formRelationService: DynamicFormRelationService,
+     formRelationService: DynamicFormRelationService
     ) => {
       service = relationService;
       dynamicFormRelationService = formRelationService;

src/app/shared/form/builder/ds-dynamic-form-ui/ds-dynamic-type-bind-relation.service.ts

@@ -91,7 +91,6 @@ export class DsDynamicTypeBindRelationService {
     // Default to OR for operator (OR is explicitly set in field-parser.ts anyway)
     const operator = relation.operator || OR_OPERATOR;
 
-
     return relation.when.reduce((hasAlreadyMatched: boolean, condition: DynamicFormControlCondition, index: number) => {
       // Get the DynamicFormControlModel (typeBindModel) from the form builder service, set in the form builder
       // in the form model at init time in formBuilderService.modelFromConfiguration (called by other form components
@@ -185,9 +184,8 @@ export class DsDynamicTypeBindRelationService {
         const initValue = (hasNoValue(relatedModel.value) || typeof relatedModel.value === 'string') ? relatedModel.value :
           (Array.isArray(relatedModel.value) ? relatedModel.value : relatedModel.value.value);
 
-        const updateSubject = (relatedModel.type === 'CHECKBOX_GROUP' ? relatedModel.valueUpdates : relatedModel.valueChanges);
-        const valueChanges = updateSubject.pipe(
-          startWith(initValue)
+        const valueChanges = this.formBuilderService.getTypeBindModelUpdates().pipe(
+          startWith(initValue),
         );
 
         // Build up the subscriptions to watch for changes;

src/app/shared/form/builder/form-builder.service.ts

@@ -21,6 +21,8 @@ import {
 import isObject from 'lodash/isObject';
 import isString from 'lodash/isString';
 import mergeWith from 'lodash/mergeWith';
+import { BehaviorSubject, Observable } from 'rxjs';
+import { distinctUntilChanged, switchMap } from 'rxjs/operators';
 
 import {
   hasNoValue,
@@ -50,7 +52,7 @@ import { getFirstCompletedRemoteData } from '../../../core/shared/operators';
 @Injectable()
 export class FormBuilderService extends DynamicFormService {
 
-  private typeBindModel: DynamicFormControlModel;
+  private typeBindModel: BehaviorSubject<DynamicFormControlModel> = new BehaviorSubject<DynamicFormControlModel>(null);
 
   /**
    * This map contains the active forms model
@@ -92,11 +94,21 @@ export class FormBuilderService extends DynamicFormService {
   }
 
   getTypeBindModel() {
-    return this.typeBindModel;
+    return this.typeBindModel.getValue();
+  }
+
+  getTypeBindModelUpdates(): Observable<any> {
+    return this.typeBindModel.pipe(
+      distinctUntilChanged(),
+      switchMap((bindModel: any) => {
+        return (bindModel.type === 'CHECKBOX_GROUP' ? bindModel.valueUpdates : bindModel.valueChanges);
+      }),
+      distinctUntilChanged()
+    );
   }
 
   setTypeBindModel(model: DynamicFormControlModel) {
-    this.typeBindModel = model;
+    this.typeBindModel.next(model);
   }
 
   findById(id: string, groupModel: DynamicFormControlModel[], arrayIndex = null): DynamicFormControlModel | null {

src/app/shared/mocks/form-builder-service.mock.ts

@@ -1,6 +1,7 @@
 import { FormBuilderService } from '../form/builder/form-builder.service';
 import { UntypedFormControl, UntypedFormGroup } from '@angular/forms';
 import { DsDynamicInputModel } from '../form/builder/ds-dynamic-form-ui/models/ds-dynamic-input.model';
+import { of } from 'rxjs';
 
 export function getMockFormBuilderService(): FormBuilderService {
 
@@ -43,7 +44,8 @@ export function getMockFormBuilderService(): FormBuilderService {
     removeFormModel: {},
     addFormModel: {},
     updateValue: {},
-    addFormGroups: {}
+    addFormGroups: {},
+    getTypeBindModelUpdates: of('test')
   });
 
 }