singleton and embed records

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

@@ -4,7 +4,13 @@
     import PreviewFile from "../previews/PreviewFile.svelte";
     import Dropdown from "../../common/Dropdown.svelte";
     import Dialog from "../../dialog/Dialog.svelte";
-    import {insertEdges} from "./reference.js";
+    import {
+        fullDeleteRecord,
+        graphToReferences,
+        insertEdges,
+        removeReferenceFromGraph,
+        restoreReferenceToGraph
+    } from "./reference.js";
     import {getContext} from "svelte";
 
     const channel = getContext("channel");
@@ -12,11 +18,7 @@
     export let record;
     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);
-        }).filter((rec) => (rec?.id ? true : false)) ?? [];
+    $: references = graphToReferences(graph, record, field)
 
     let collections = channel.schemas.filter((aschema) =>
         field.collections.includes(aschema.name)
@@ -24,9 +26,17 @@
 
     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 openBrowseModal(e, schema) {
@@ -73,10 +83,17 @@
 </div>
 {#if references.length > 0}
     <Sortable sortableClass="mt-3" on:update={reorder}>
-        {#each references as reference (reference.id)}
+        {#each references as reference (reference.record.id)}
             <!--This div helps the sorting thing-->
             <div>
-                <PreviewFile record={reference} hasDelete={true} on:remove={removeReference}></PreviewFile>
+                <PreviewFile
+                        record={reference.record}
+                        edge={reference.edge}
+                        hasDelete={true}
+                        on:remove={removeReference}
+                        on:restore={restoreReference}
+                        on:fulldelete={fullDelete}
+                ></PreviewFile>
             </div>
         {/each}
     </Sortable>

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}

front/js/svelte/records/elements/reference.js

@@ -1,4 +1,5 @@
 import {uniqBy} from "lodash";
+import axios from "axios";
 
 export function insertEdges(graph, sourceRecord, targetRecords, fieldName, action = "") {
     let newEdges = targetRecords.map((r) => {
@@ -22,3 +23,49 @@ export function insertEdges(graph, sourceRecord, targetRecords, fieldName, actio
     graph.edges = uniqBy([...replacedEdges, ...newEdges], (edge) =>  edge.source +  edge.target + edge.field + edge.depth);
     return graph;
 }
+
+
+export function graphToReferences(graph,record,field){
+    return graph.edges
+        .filter((edge) => edge.field === field.name)
+        .map((edge) => {
+            return {
+                record: graph.records.find((increc) => increc.id === edge.target && record.id === edge.source),
+                edge: edge
+            };
+        }).filter((rec) => (rec.record?.id ? true : false)) ?? [];
+}
+
+export function removeReferenceFromGraph(graph,field,id){
+    return graph.edges.map(
+        (edge) => {
+            if(edge.target === id && edge.field === field.name){
+                edge._isTrashed = true;
+            }
+            return edge;
+        }
+    );
+}
+
+export function restoreReferenceToGraph(graph,field,id){
+    return graph.edges.map(
+        (edge) => {
+            if(edge.target === id && edge.field === field.name){
+                edge._isTrashed = false;
+            }
+            return edge;
+        }
+    );
+}
+
+
+export function fullDeleteRecord(channel,graph,field,id){
+    axios
+        .post(channel.lucentUrl + "/records/status/trashed" , {
+            records: [id]
+        });
+
+    return graph.edges.filter(
+        (edge) => !(edge.target === id && edge.field === field.name)
+    );
+}