fixed patch move

src/app/core/json-patch/builder/json-patch-operations-builder.ts

@@ -1,7 +1,7 @@
 import { Store } from '@ngrx/store';
 import { CoreState } from '../../core.reducers';
 import {
-  NewPatchAddOperationAction,
+  NewPatchAddOperationAction, NewPatchMoveOperationAction,
   NewPatchRemoveOperationAction,
   NewPatchReplaceOperationAction
 } from '../json-patch-operations.actions';
@@ -61,6 +61,18 @@ export class JsonPatchOperationsBuilder {
         this.prepareValue(value, plain, false)));
   }
 
+
+  move(path: JsonPatchOperationPathObject, prevPath: string) {
+    this.store.dispatch(
+      new NewPatchMoveOperationAction(
+        path.rootElement,
+        path.subRootElement,
+        prevPath,
+        path.path
+      )
+    );
+  }
+
   /**
    * Dispatches a new NewPatchRemoveOperationAction
    *

src/app/core/json-patch/json-patch-operations.reducer.ts

@@ -196,7 +196,8 @@ function newOperation(state: JsonPatchOperationsState, action): JsonPatchOperati
     body,
     action.type,
     action.payload.path,
-    hasValue(action.payload.value) ? action.payload.value : null);
+    hasValue(action.payload.value) ? action.payload.value : null,
+    hasValue(action.payload.from) ? action.payload.from : null);
 
   if (hasValue(newState[ action.payload.resourceType ])
     && hasValue(newState[ action.payload.resourceType ].children)) {
@@ -293,7 +294,7 @@ function flushOperation(state: JsonPatchOperationsState, action: FlushPatchOpera
   }
 }
 
-function addOperationToList(body: JsonPatchOperationObject[], actionType, targetPath, value?) {
+function addOperationToList(body: JsonPatchOperationObject[], actionType, targetPath, value?, fromPath?) {
   const newBody = Array.from(body);
   switch (actionType) {
     case JsonPatchOperationsActionTypes.NEW_JSON_PATCH_ADD_OPERATION:
@@ -313,6 +314,9 @@ function addOperationToList(body: JsonPatchOperationObject[], actionType, target
     case JsonPatchOperationsActionTypes.NEW_JSON_PATCH_REMOVE_OPERATION:
       newBody.push(makeOperationEntry({ op: JsonPatchOperationType.remove, path: targetPath }));
       break;
+    case JsonPatchOperationsActionTypes.NEW_JSON_PATCH_MOVE_OPERATION:
+      newBody.push(makeOperationEntry({ op: JsonPatchOperationType.move, from: fromPath, path: targetPath }));
+      break;
   }
   return newBody;
 }

src/app/shared/form/builder/ds-dynamic-form-ui/models/array-group/dynamic-form-array.component.ts

@@ -25,7 +25,7 @@ import {
 } from '../../../../../../core/shared/operators';
 import { SubmissionObject } from '../../../../../../core/submission/models/submission-object.model';
 import { SubmissionObjectDataService } from '../../../../../../core/submission/submission-object-data.service';
-import { hasValue, isNotEmpty } from '../../../../../empty.util';
+import { hasNoValue, hasValue, isNotEmpty, isNull } from '../../../../../empty.util';
 import { FormFieldMetadataValueObject } from '../../../models/form-field-metadata-value.model';
 import {
   Reorderable,
@@ -55,7 +55,7 @@ export class DsDynamicFormArrayComponent extends DynamicFormArrayComponent imple
   @Output('ngbEvent') customEvent: EventEmitter<DynamicFormControlCustomEvent> = new EventEmitter();
 
   private submissionItem: Item;
-  private reorderables: Reorderable[];
+  private reorderables: Reorderable[] = [];
 
   /* tslint:enable:no-output-rename */
 
@@ -70,7 +70,6 @@ export class DsDynamicFormArrayComponent extends DynamicFormArrayComponent imple
   }
 
   ngOnInit(): void {
-    console.log('this.model', this.model);
     this.submissionObjectService
       .findById(this.model.submissionId).pipe(
       getSucceededRemoteData(),
@@ -88,9 +87,10 @@ export class DsDynamicFormArrayComponent extends DynamicFormArrayComponent imple
 
   private updateReorderables(): void {
     this.zone.runOutsideAngular(() => {
-      const reorderable$arr: Array<Observable<Reorderable>> = this.model.groups
+      let groups = this.model.groups.map((group, index) => [group, (this.control as any).controls[index]]);
-        .map((group, index) => [group, (this.control as any).controls[index]])
+      groups = [...groups, groups[0]];
-        //.slice(1) // disregard the first group, it is always empty to ensure the first field remains empty
+      const reorderable$arr: Array<Observable<Reorderable>> = groups
+        .filter(([group, control], index) => index > 0 && hasValue((group.group[0] as any).value)) // disregard the first group, it is always empty to ensure the first field remains empty
         .map(([group, control]: [DynamicFormArrayGroupModel, AbstractControl], index: number) => {
           const model = group.group[0] as DynamicConcatModel;
           let formFieldMetadataValue: FormFieldMetadataValueObject = model.value as FormFieldMetadataValueObject;
@@ -155,15 +155,17 @@ export class DsDynamicFormArrayComponent extends DynamicFormArrayComponent imple
           }
           this.reorderables = reorderables;
 
-          this.reorderables.forEach((reorderable: Reorderable) => {
+          this.reorderables.forEach((reorderable: Reorderable, index: number) => {
             if (reorderable.hasMoved) {
+              const prevIndex = reorderable.oldIndex;
               reorderable.update().pipe(take(1)).subscribe((v) => {
+                console.log(reorderable, index);
                 if (reorderable instanceof ReorderableFormFieldMetadataValue) {
                   const reoMD = reorderable as ReorderableFormFieldMetadataValue;
                   const mdl = Object.assign({}, reoMD.model, { value: reoMD.metadataValue });
-                  this.onChange({
+                  super.onChange({
-                    $event: undefined,
+                    $event: { previousIndex: prevIndex  },
-                    context: reoMD.group,
+                    context: { index },
                     control: reoMD.control,
                     group: this.group,
                     model: mdl,
@@ -175,7 +177,6 @@ export class DsDynamicFormArrayComponent extends DynamicFormArrayComponent imple
           })
         });
     })
-
   }
 
   moveSelection(event: CdkDragDrop<Relationship>) {
@@ -184,10 +185,13 @@ export class DsDynamicFormArrayComponent extends DynamicFormArrayComponent imple
   }
 
   onChange($event) {
-    console.log($event);
+    let event = $event;
-    const group = Object.assign({}, $event.group, { index: (($event.group.index || 0) - 1 + this.reorderables.length) % this.reorderables.length });
+    if (hasNoValue($event.context)) {
-    const event = Object.assign({}, $event, { context: group });
+      const context = Object.assign({}, $event.context, { index: this.reorderables.length });
-    super.onChange(event);
+      event = Object.assign({}, $event, { context });
+      super.onChange(event);
+    } else {
+      this.updateReorderables();
+    }
   }
-
 }

src/app/shared/form/builder/parsers/field-parser.ts

@@ -50,10 +50,11 @@ export abstract class FieldParser {
         metadataKey = this.configData.selectableMetadata[0].metadata;
       };
 
+      console.log(this.getInitArrayIndex());
       const config = {
         id: uniqueId() + '_array',
         label: this.configData.label,
-        initialCount: this.getInitArrayIndex() + 1,
+        initialCount: this.getInitArrayIndex(),
         notRepeatable: !this.configData.repeatable,
         hasRelationship: isNotEmpty(this.configData.selectableRelationship),
         required: isNotEmpty(this.configData.mandatory),
@@ -87,7 +88,7 @@ export abstract class FieldParser {
             }
           }
           setLayout(model, 'element', 'host', 'col');
-          if (model.hasLanguages|| isNotEmpty(model.relationship)) {
+          if (model.hasLanguages || isNotEmpty(model.relationship)) {
             setLayout(model, 'grid', 'control', 'col');
           }
           return [model];
@@ -166,9 +167,10 @@ export abstract class FieldParser {
   }
 
   protected getInitArrayIndex() {
+    let fieldCount = 0;
     const fieldIds: any = this.getAllFieldIds();
     if (isNotEmpty(this.initFormValues) && isNotNull(fieldIds) && fieldIds.length === 1 && this.initFormValues.hasOwnProperty(fieldIds)) {
-      return this.initFormValues[fieldIds].length;
+      fieldCount = this.initFormValues[fieldIds].filter(value => hasValue(value) && hasValue(value.value)).length;
     } else if (isNotEmpty(this.initFormValues) && isNotNull(fieldIds) && fieldIds.length > 1) {
       let counter = 0;
       fieldIds.forEach((id) => {
@@ -176,10 +178,9 @@ export abstract class FieldParser {
           counter = counter + this.initFormValues[id].length;
         }
       });
-      return (counter === 0) ? 1 : counter;
+      fieldCount = counter;
-    } else {
-      return 1;
     }
+    return (fieldCount === 0) ? 1 : fieldCount + 1
   }
 
   protected getFieldId(): string {

src/app/shared/form/form.component.html

@@ -12,9 +12,9 @@
                 (dfFocus)="onFocus($event)">
 
             <ng-template modelType="ARRAY" let-group let-index="index" let-context="context">
-                <ng-container *ngIf="!context.hasRelationship">
+                metadata: {{context.metadata}}
                     <!--Array with repeatable items-->
-                    <div *ngIf="!context.notRepeatable"
+                    <div *ngIf="!context.notRepeatable && (!context.hasRelationship || (context.hasRelationship && index < 1))"
                          class="col-xs-2 d-flex flex-column justify-content-sm-start align-items-end">
                         <div class="btn-group" role="group" aria-label="Add and remove button">
                             <button type="button" class="btn btn-secondary"
@@ -31,7 +31,7 @@
                     </div>
 
                     <!--Array with non repeatable items - Only delete button-->
-                    <div *ngIf="context.notRepeatable && group.context.groups.length > 1"
+                    <div *ngIf="context.notRepeatable && group.context.groups.length > 1 || (context.hasRelationship && index > 0)"
                          class="col-xs-2 d-flex flex-column justify-content-sm-start align-items-end">
                         <div class="btn-group" role="group" aria-label="Remove button">
                             <button type="button" class="btn btn-secondary"
@@ -41,15 +41,14 @@
                             </button>
                         </div>
                     </div>
-                </ng-container>
 
-                <div *ngIf="!context.notRepeatable && context.hasRelationship && index < 1" class="col-auto text-center">
+<!--                <div *ngIf="!context.notRepeatable && context.hasRelationship && index < 1" class="col-auto text-center">-->
-                    <button type="button" class="btn btn-secondary"
+<!--                    <button type="button" class="btn btn-secondary"-->
-                            [disabled]="isItemReadOnly(context, index)"
+<!--                            [disabled]="isItemReadOnly(context, index)"-->
-                            (click)="insertItem($event, group.context, group.index + 1)">
+<!--                            (click)="insertItem($event, group.context, group.index + 1)">-->
-                        {{'form.add' | translate}}
+<!--                        {{'form.add' | translate}}-->
-                    </button>
+<!--                    </button>-->
-                </div>
+<!--                </div>-->
             </ng-template>
 
         </ds-dynamic-form>

src/app/submission/sections/form/section-form-operations.service.ts

@@ -9,7 +9,7 @@ import {
   DynamicFormControlModel
 } from '@ng-dynamic-forms/core';
 
-import { isNotEmpty, isNotNull, isNotUndefined, isNull, isUndefined } from '../../../shared/empty.util';
+import { hasValue, isNotEmpty, isNotNull, isNotUndefined, isNull, isUndefined } from '../../../shared/empty.util';
 import { JsonPatchOperationPathCombiner } from '../../../core/json-patch/builder/json-patch-operation-path-combiner';
 import { FormFieldPreviousValueObject } from '../../../shared/form/builder/models/form-field-previous-value-object';
 import { JsonPatchOperationsBuilder } from '../../../core/json-patch/builder/json-patch-operations-builder';
@@ -326,6 +326,12 @@ export class SectionFormOperationsService {
         } else {
           this.operationsBuilder.remove(pathCombiner.getPath(path));
         }
+      } else if (hasValue(event.$event) && hasValue(event.$event.previousIndex)) {
+        console.log(event, path);
+        this.operationsBuilder.move(
+          pathCombiner.getPath(path),
+          pathCombiner.getPath(segmentedPath + '/' + event.$event.previousIndex).path
+      )
       } else {
         // New value is not equal from the previous one, so dispatch a replace operation
         this.operationsBuilder.replace(