draggable form array controls

src/app/core/submission/submission-response-parsing.service.ts

@@ -1,4 +1,5 @@
 import { Inject, Injectable } from '@angular/core';
+import { deepClone } from 'fast-json-patch';
 import { DSOResponseParsingService } from '../data/dso-response-parsing.service';
 
 import { ResponseParsingService } from '../data/parsing.service';
@@ -91,7 +92,7 @@ export class SubmissionResponseParsingService extends BaseResponseParsingService
    * @returns {RestResponse}
    */
   parse(request: RestRequest, data: DSpaceRESTV2Response): RestResponse {
-    this.dsoParser.parse(request, data);
+    this.dsoParser.parse(deepClone(request), deepClone(data));
     if (isNotEmpty(data.payload)
       && isNotEmpty(data.payload._links)
       && this.isSuccessStatus(data.statusCode)) {

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

@@ -6,6 +6,49 @@
            [for]="model.id"
            [innerHTML]="(model.required && model.label) ? (model.label | translate) + ' *' : (model.label | translate)"
            [ngClass]="[getClass('element', 'label'), getClass('grid', 'label')]"></label>
+
+    <ng-container *ngTemplateOutlet="startTemplate?.templateRef; context: model"></ng-container>
+    <!--    Should be *ngIf instead of class d-none, but that breaks the #componentViewContainer reference-->
+    <div [ngClass]="{'form-row': model.hasLanguages || hasRelationLookup, 'd-none': hasRelationLookup && model.value}">
+        <div [ngClass]="getClass('grid', 'control')">
+
+            <ng-container #componentViewContainer></ng-container>
+
+            <small *ngIf="hasHint && (!showErrorMessages || errorMessages.length === 0)"
+                   class="text-muted" [innerHTML]="model.hint | translate" [ngClass]="getClass('element', 'hint')"></small>
+
+            <div *ngIf="showErrorMessages" [ngClass]="[getClass('element', 'errors'), getClass('grid', 'errors')]">
+                <small *ngFor="let message of errorMessages" class="invalid-feedback d-block">{{ message | translate:model.validators }}</small>
+            </div>
+
+        </div>
+
+        <div *ngIf="model.languageCodes && model.languageCodes.length > 0" class="col-xs-2">
+            <select
+                    #language="ngModel"
+                    [disabled]="model.readOnly"
+                    [(ngModel)]="model.language"
+                    class="form-control"
+                    (blur)="onBlur($event)"
+                    (change)="onChangeLanguage($event)"
+                    [ngModelOptions]="{standalone: true}"
+                    required>
+                <option *ngFor="let lang of model.languageCodes" [value]="lang.code">{{lang.display}}</option>
+            </select>
+        </div>
+
+        <div *ngIf="hasRelationLookup" class="col-auto text-center">
+            <button class="btn btn-secondary"
+                    type="submit"
+                    ngbTooltip="{{'form.lookup-help' | translate}}"
+                    placement="top"
+                    (click)="openLookup(); $event.stopPropagation();">{{'form.lookup' | translate}}
+            </button>
+        </div>
+    </div>
+
+    <ng-container *ngTemplateOutlet="endTemplate?.templateRef; context: model"></ng-container>
+
     <ng-container *ngTemplateOutlet="startTemplate?.templateRef; context: model"></ng-container>
     <!--    Should be *ngIf instead of class d-none, but that breaks the #componentViewContainer reference-->
     <div [ngClass]="{'form-row': model.hasLanguages || hasRelationLookup, 'd-none': hasRelationLookup && model.value}">

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

@@ -1,15 +1,14 @@
 <ng-container [formGroup]="group">
-
     <div [dynamicId]="bindId && model.id"
          [formArrayName]="model.id"
          [ngClass]="getClass('element', 'control')">
 
         <div *ngFor="let groupModel of model.groups; let idx = index" role="group"
-             [formGroupName]="idx" [ngClass]="[getClass('element', 'group'), getClass('grid', 'group')]">
-
+             [formGroupName]="idx" [ngClass]="[getClass('element', 'group'), getClass('grid', 'group')]"
+             cdkDropList (cdkDropListDropped)="test($event)">
             <ng-container *ngTemplateOutlet="startTemplate?.templateRef; context: groupModel"></ng-container>
 
-            <ds-dynamic-form-control-container *ngFor="let _model of groupModel.group"
+            <ds-dynamic-form-control-container cdkDrag *ngFor="let _model of groupModel.group"
                                                [bindId]="false"
                                                [context]="groupModel"
                                                [group]="control.at(idx)"

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

@@ -35,4 +35,8 @@ export class DsDynamicFormArrayComponent extends DynamicFormArrayComponent {
     super(layoutService, validationService);
   }
 
+
+  test(event) {
+    console.log(event);
+  }
 }

src/app/shared/form/builder/ds-dynamic-form-ui/relation-lookup-modal/relationship.effects.ts

@@ -84,7 +84,6 @@ export class RelationshipEffects {
             this.nameVariantUpdates[identifier] = nameVariant;
           } else {
             this.relationshipService.updateNameVariant(item1, item2, relationshipType, nameVariant)
-              .pipe(getSucceededRemoteData())
               .subscribe();
           }
         }