Minor improvements.

src/Squidex/app-config/webpack.run.dev.js

@@ -57,6 +57,9 @@ module.exports = webpackMerge(runConfig, {
     ],
 
     devServer: {
-        historyApiFallback: true, stats: 'minimal'
+        historyApiFallback: true, stats: 'minimal',
+        headers: {
+            'Access-Control-Allow-Origin': '*'
+        }
     }
 });

src/Squidex/app/features/schemas/pages/schema/field.component.html

@@ -1,7 +1,5 @@
 <div class="table-items-row field"> 
     <div class="field-summary">        
-        <i class="icon-drag field-drag"></i>
-        
         <div class="row">
             <div class="col col-6">
                 <span class="field-name">

src/Squidex/app/features/schemas/pages/schema/field.component.scss

@@ -9,21 +9,11 @@ $field-header: #e7ebef;
 
 .field {
     &-summary {
-        padding: 1rem 1.25rem 1rem 1.5rem;
+        padding: 1rem 1.25rem;
         position: relative;
         line-height: 2.5rem;
     }
 
-    &-drag {
-        @include absolute(0, auto, 0, 0);
-        z-index: 1000;
-        font-size: 1.4rem;
-        font-weight: normal;
-        line-height: 4.8rem;
-        cursor: move;
-        color: $color-border;
-    }
-
     &-icon {
         margin-right: 1rem;
         color: $color-border-dark;

src/Squidex/app/features/schemas/utils/sorted.directive.ts

@@ -18,6 +18,8 @@ import {
     selector: '[sorted]'
 })
 export class SortedDirective {
+    private oldArray: any[];
+
     @Output()
     public sorted = new EventEmitter<Array<any>>();
 
@@ -26,13 +28,31 @@ export class SortedDirective {
         sortableContainer: SortableContainer,
         sortableDragDropService: DragDropSortableService
     ) {
-        const oldCallback = sortableComponent._onDropCallback.bind(sortableComponent);
+        const oldDragStartCallback = sortableComponent._onDragStartCallback.bind(sortableComponent);
+
+        sortableComponent._onDragStartCallback = (event: Event) => {
+            oldDragStartCallback();
+
+            this.oldArray = [...sortableContainer.sortableData];
+        };
+
+        const oldDropCallback = sortableComponent._onDropCallback.bind(sortableComponent);
 
         sortableComponent._onDropCallback = (event: Event) => {
-            oldCallback(event);
+            oldDropCallback(event);
 
             if (sortableDragDropService.isDragged) {
-                this.sorted.emit(sortableContainer.sortableData);
+                const newArray = sortableContainer.sortableData;
+                const oldArray = this.oldArray;
+
+                if (newArray && oldArray && newArray.length === oldArray.length) {
+                    for (let i = 0; i < oldArray.length; i++) {
+                        if (oldArray[i] !== newArray[i]) {
+                            this.sorted.emit(newArray);
+                            break;
+                        }
+                    }
+                }
             }
         };
     }

src/Squidex/app/shared/components/history.component.html

@@ -13,11 +13,11 @@
         <div class="panel-content panel-content-blank">
             <div *ngFor="let event of events | async" class="event">
                 <div class="event-left">
-                    <img class="user-picture" [attr.title]="event.actor | userName:'I'" [attr.src]="event.actor | userPicture" />
+                    <img class="user-picture" [attr.title]="event.actor | userNameRef:'I'" [attr.src]="event.actor | userPictureRef" />
                 </div>
                 <div class="event-main">
                     <div class="event-message">
-                        <span class="event-actor user-ref">{{actorName(event.actor) | async}}</span> <span [innerHTML]="format(event.message) | async"></span>
+                        <span class="event-actor user-ref">{{event.actor | userNameRef:'I'}}</span> <span [innerHTML]="format(event.message) | async"></span>
                     </div>
                     <div class="event-created">{{event.created | fromNow}}</div>
                 </div>