singleton and embed records

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

@@ -1,12 +1,17 @@
 <script>
     import {getContext} from "svelte";
-    import {insertEdges} from "./reference";
+    import {
+        fullDeleteRecord,
+        graphToReferences,
+        insertEdges,
+        removeReferenceFromGraph,
+        restoreReferenceToGraph
+    } from "./reference";
     import {getErrorMessage} from "./errorMessage";
     import {sortByField} from "../../edges/sortEdges";
     import ReferenceInlineButtons from "./ReferenceInlineButtons.svelte";
     import Sortable from "../../libs/Sortable.svelte";
     import PreviewReference from "../previews/PreviewReference.svelte";
-    import axios from "axios";
 
     const channel = getContext("channel");
     export let record;
@@ -16,11 +21,7 @@
     $: errorMessage = getErrorMessage(validationErrors, field.name);
 
 
-    $: references = graph.edges
-        .filter((edge) => edge.field === field.name)
-        .map((edge) => {
-            return graph.records.find((increc) => increc.id === edge.target && record.id === edge.source);
-        }).filter((rec) => (rec?.id ? true : false)) ?? [];
+    $: references = graphToReferences(graph,record,field)
 
     let collections = channel.schemas.filter((aschema) =>
         field.collections.includes(aschema.name)
@@ -28,27 +29,25 @@
 
     function removeReference(e) {
         e.preventDefault();
-        graph.edges = graph.edges.filter(
-            (edge) => !(edge.target === e.detail && edge.field === field.name)
-        );
+        graph.edges = removeReferenceFromGraph(graph,field,e.detail)
+    }
+
+    function restoreReference(e) {
+        e.preventDefault();
+        graph.edges = restoreReferenceToGraph(graph,field,e.detail)
+    }
+
+    function fullDelete(e) {
+        e.preventDefault();
+        graph.edges = fullDeleteRecord(channel,graph, field, e.detail)
     }
 
     function reorder(e) {
-
         graph.edges = sortByField(e.detail.source, e.detail.target, graph.edges, field.name, references);
     }
 
     function insert(e) {
         e.preventDefault();
-        // axios.post(channel.lucentUrl + "/edges/insert-many", {
-        //     source: record.id,
-        //     sourceSchema: record.schema,
-        //     targetSchema: e.detail.schema,
-        //     field: field.name,
-        //     targets: e.detail.records.map(r => r.id),
-        // }).then(function (response) {
-        //     graph = response.data.graph;
-        // })
         graph = insertEdges(graph, record, e.detail.records, field.name, e.detail.action);
     }
 
@@ -69,13 +68,16 @@
 </div>
 {#if references.length > 0}
     <Sortable sortableClass="row row-cols-3 mt-3" on:update={reorder}>
-        {#each references as reference (reference.id)}
+        {#each references as reference (reference.record.id)}
             <div>
                 <PreviewReference
                         {graph}
-                        record={reference}
+                        record={reference.record}
+                        edge={reference.edge}
                         hasDelete={true}
                         on:remove={removeReference}
+                        on:restore={restoreReference}
+                        on:fulldelete={fullDelete}
                 />
             </div>
         {/each}