build

front/dist/manifest.json

@@ -1,6 +1,6 @@
 {
   "main.js": {
-    "file": "assets/main.7c3e8b7b.js",
+    "file": "assets/main.c1fd60c7.js",
     "src": "main.js",
     "isEntry": true,
     "css": [

front/js/svelte/edges/sortEdges.js

@@ -1,8 +1,12 @@
-export function sortByField(from, to, edges, fieldName) {
+
+
+
+export function sortByField(from, to, edges, fieldName, references) {
     if (from === to) {
         return edges;
     }
-    let edgesTosort = edges?.filter((ed) => ed.field === fieldName && ed.depth === 1 ) ?? [];
+    let referenceIds = references.map(r => r.id);
+    let edgesTosort = edges?.filter((ed) => ed.field === fieldName && ed.depth === 1 && referenceIds.includes(ed.target)) ?? [];
     let remainingEdge = edges?.filter((ed) => !(ed.field === fieldName && ed.depth === 1)) ?? [];
 
     edgesTosort = array_move(edgesTosort,from, to);

front/js/svelte/libs/Sortable.svelte

@@ -18,7 +18,7 @@
             easing: "cubic-bezier(1, 0, 0, 1)",
             onUpdate: function (/**Event*/ evt) {
                 // reorder(evt.oldIndex,evt.newIndex);
-                console.log(evt)
+                // console.log(evt)
                 dispatch("update", {
                     source: evt.oldIndex,
                     target: evt.newIndex,

front/js/svelte/records/block/elements/File.svelte

@@ -41,7 +41,7 @@
     }
 
     function reorder(e) {
-        graph.edges = sortByField(e.detail.source, e.detail.target, graph.edges, blockFieldName);
+        graph.edges = sortByField(e.detail.source, e.detail.target, graph.edges, blockFieldName, references);
     }
 
     function insert(e) {

front/js/svelte/records/block/elements/Reference.svelte

@@ -35,7 +35,7 @@
     }
 
     function reorder(e) {
-        graph.edges = sortByField(e.detail.source, e.detail.target, graph.edges, blockFieldName);
+        graph.edges = sortByField(e.detail.source, e.detail.target, graph.edges, blockFieldName, references);
     }
 
     function insert(e) {

front/js/svelte/records/elements/File.svelte

@@ -12,11 +12,10 @@
     export let graph
 
     let browseModal;
-
     $: references = graph?.edges
         .filter((edge) => edge.field === field.name)
         .map((edge) => {
-            return graph.records.find((increc) => increc.id == edge.target && record.id == edge.source);
+            return graph.records.find((increc) => increc.id === edge.target && record.id === edge.source);
         }).filter((rec) => (rec?.id ? true : false)) ?? [];
 
     let collections = channel.schemas.filter((aschema) =>
@@ -36,7 +35,9 @@
     }
 
     async function reorder(e) {
-        graph.edges = await sortByField(e.detail.source, e.detail.target, graph.edges, field.name);
+
+        graph.edges = await sortByField(e.detail.source, e.detail.target, graph.edges, field.name, references);
+
     }
 
     function insert(e) {
@@ -68,18 +69,18 @@
 <div class="mb-0">
     {#if field.collections.length === 1}
         <button
-            class="btn btn-outline-primary"
+                class="btn btn-outline-primary"
-            on:click={(e) => openBrowseModal(e, collections[0].name)}
+                on:click={(e) => openBrowseModal(e, collections[0].name)}
         >
             Browse
         </button>
     {:else}
         <div class="dropdown d-inline-block">
             <button
-                class="btn btn-outline-primary btn-sm"
+                    class="btn btn-outline-primary btn-sm"
-                type="button"
+                    type="button"
-                data-bs-toggle="dropdown"
+                    data-bs-toggle="dropdown"
-                aria-expanded="false"
+                    aria-expanded="false"
             >
                 Browse
             </button>
@@ -88,10 +89,10 @@
                     <li>
                         <!-- {`${channelurl}/content/${collection.name}?parent=${record.id}&parentfield=${field.name}`} -->
                         <a
-                            class="dropdown-item"
+                                class="dropdown-item"
-                            on:click={(e) =>
+                                on:click={(e) =>
                                 openBrowseModal(e, collection.name)}
-                            href="/">{collection.label}</a
+                                href="/">{collection.label}</a
                         >
                     </li>
                 {/each}
@@ -104,10 +105,10 @@
         {#each references as reference (reference.id)}
             <div class="col mb-3">
                 <PreviewCard
-                    classes="h-100"
+                        classes="h-100"
-                    record={reference}
+                        record={reference}
-                    hasDelete={true}
+                        hasDelete={true}
-                    on:remove={removeReference}
+                        on:remove={removeReference}
                 />
             </div>
         {/each}

front/js/svelte/records/elements/Reference.svelte

@@ -14,6 +14,7 @@
     export let validationErrors;
     $: errorMessage = getErrorMessage(validationErrors, field.name);
 
+
     $: references = graph.edges
         .filter((edge) => edge.field === field.name)
         .map((edge) => {
@@ -32,7 +33,8 @@
     }
 
     function reorder(e) {
-        graph.edges = sortByField(e.detail.source, e.detail.target, graph.edges, field.name);
+
+        graph.edges = sortByField(e.detail.source, e.detail.target, graph.edges, field.name, references);
     }
 
     function insert(e) {

front/js/svelte/records/elements/ReferenceInline.svelte

@@ -119,7 +119,7 @@
     }
 
     function move(e, from, to) {
-        graph.edges = sortByField(from, to, graph.edges, field.name);
+        graph.edges = sortByField(from, to, graph.edges, field.name, references);
     }
 </script>
 

front/js/svelte/records/elements/ReferenceTable.svelte

@@ -57,7 +57,7 @@
 
 
     function reorder(e) {
-        graph.edges = sortByField(e.detail.source, e.detail.target, graph.edges, field.name);
+        graph.edges = sortByField(e.detail.source, e.detail.target, graph.edges, field.name, references);
     }
 
 

front/js/svelte/records/elements/ReferenceTags.svelte

@@ -1,14 +1,8 @@
 <script>
     import {getContext} from "svelte";
-    import {uniqBy, debounce} from "lodash";
+    import {debounce} from "lodash";
     import {previewTitle} from "../Preview";
     import {getErrorMessage} from "./errorMessage";
-    import {sortByField} from "../../edges/sortEdges";
-    import ReferenceInlineButtons from "./ReferenceInlineButtons.svelte";
-    import Sortable from "../../libs/Sortable.svelte";
-    import RenderField from "../../content/RenderField.svelte";
-    import Icon from "../../common/Icon.svelte";
-    import Datalist from "./Datalist.svelte";
     import {insertEdges} from "./reference.js";
 
     const channel = getContext("channel");
@@ -52,7 +46,7 @@
             })
             .then((response) => {
                 searchOptions = [];
-                insert(e,response.data.records[0]);
+                insert(e, response.data.records[0]);
                 console.log(response)
             })
             .catch((error) => {
@@ -63,7 +57,7 @@
 
     function insert(e, insertRecord) {
         e.preventDefault();
-        graph = insertEdges(graph,record,[insertRecord],field.name,e.detail.action);
+        graph = insertEdges(graph, record, [insertRecord], field.name, e.detail.action);
     }
 
     const updateResults = debounce((e) => {