who knows

front/js/svelte/records/Edit.svelte

@@ -66,7 +66,7 @@
                             errorMessage = error.response.data.error;
                         } else {
                             validationErrors = error.response.data.error;
-                            console.log(validationErrors)
+                            // console.log(validationErrors)
                         }
                     }
                     resolve(null);

front/js/svelte/records/Preview.js

@@ -20,6 +20,26 @@ export function previewTitle(record) {
     return stripHtml(render.slice(0, 300));
 }
 
+export function previewEdgeTitle(edge) {
+    const channel = getContext("channel");
+    let edgeSchemaName = channel.schemas
+        .find((aSchema) => aSchema.name === edge?.sourceSchema)
+        .fields.find(f => f.name === edge.field).data;
+    let schema = channel.schemas.find((aSchema) => aSchema.name === edgeSchemaName);
+    if (!schema?.titleTemplate) {
+        return noTemplate(schema, edge);
+    }
+
+    let template = Mustache.parse(schema.titleTemplate);
+    let render = Mustache.render(schema.titleTemplate, edge.data);
+
+    if (!render || render === "") {
+        return noTemplate(schema, edge);
+    }
+
+    return stripHtml(render.slice(0, 300));
+}
+
 function noTemplate(schema, record) {
     if (schema?.type === "files") {
         return record._file.path;

front/js/svelte/records/PreviewCard.svelte

@@ -2,7 +2,7 @@
     import Icon from "../common/Icon.svelte";
 
     import {getContext, createEventDispatcher} from "svelte";
-    import {previewTitle} from "./Preview";
+    import {previewEdgeTitle, previewTitle} from "./Preview";
     import Status from "./Status.svelte";
     import Preview from "../newPreview/Preview.svelte";
     import EdgeData from "./form/references/EdgeData.svelte";
@@ -39,7 +39,8 @@
                 style="border-color:{schema.color ?? '#ccc'}; border-width: 1px;"
         >
             <div class="card-body">
-                Edge Data
+                <span class="text-muted d-block">Relation Data</span>
+                {previewEdgeTitle(edge)}
                 <div class="position-absolute d-flex end-0" style="top:5px">
                     <button
                             class="trash-button  text-dark btn btn-sm btn-link"
@@ -59,26 +60,7 @@
             style="border-color:{schema.color ?? '#ccc'}; border-width: 1px;"
     >
         <div class="card-body">
-
             <Preview {record} type="card"/>
-
-            <!--        <div class="overflow-hidden">-->
-            <!--            <a-->
-            <!--                class="title-link m-0 fs-5 text-decoration-none text-dark d-block"-->
-            <!--                href="{channel.lucentUrl}/records/{record.id}"-->
-            <!--                title={cardTitle}-->
-            <!--            >-->
-            <!--                {cardTitle}-->
-            <!--            </a>-->
-            <!--            <small class="text-muted">-->
-            <!--                {schema.label}-->
-            <!--            </small>-->
-            <!--            <small class="text-muted">-->
-            <!--                {#if record.status === "draft"}-->
-            <!--                    <Status status={record.status} />-->
-            <!--                {/if}-->
-            <!--            </small>-->
-            <!--        </div>-->
         </div>
 
         {#if hasDelete}

front/js/svelte/records/deepEquality.js

@@ -1,6 +1,5 @@
 import { deepEqual } from 'fast-equals';
 export function isEqual(obj1, obj2) {
-
     return deepEqual(obj1, obj2);
     // if (obj1 === obj2) return true;
     //

front/js/svelte/records/form/Form.svelte

@@ -36,7 +36,7 @@
         originalContent = {
             data: JSON.parse(JSON.stringify(data)),
             status: status,
-            edges: JSON.parse(JSON.stringify(graph?.map(r => r.edge.target+r.edge.field) ?? [])),
+            edges: JSON.parse(JSON.stringify(graph?.map(r => r.edge.target+r.edge.field) ?? [])).sort(),
         };
         hasUnsavedData = checkUnsavedData();
 
@@ -75,7 +75,7 @@
         return !isEqual(originalContent, {
             data: data,
             status: status,
-            edges: graph?.map(r => r.edge.target+r.edge.field) ?? [],
+            edges: graph?.map(r => r.edge.target+r.edge.field).sort() ?? [],
         });
     }
 </script>