singleton and embed records

front/js/svelte/records/previews/PreviewFile.svelte

@@ -11,6 +11,7 @@
     const dispatch = createEventDispatcher();
     const channel = getContext("channel");
     export let record;
+    export let edge;
     export let hasDelete = false;
     export let hasInsert = false;
 
@@ -23,6 +24,16 @@
         dispatch("remove", record.id);
     }
 
+    function restore(e) {
+        e.preventDefault();
+        dispatch("restore", record.id);
+    }
+
+    function fullDelete(e) {
+        e.preventDefault();
+        dispatch("fulldelete", record.id);
+    }
+
     function insert(e, preset) {
         e.preventDefault();
         let html = htmlurl(channel, record, preset)
@@ -37,7 +48,7 @@
 
 </script>
 
-<div class="preview-file">
+<div class="preview-file" class:is-trashed={edge._isTrashed}>
     <div style="display: flex;align-items: center;gap: 10px;">
         <div class="image">
             <Preview {record} size="small"/>
@@ -49,6 +60,9 @@
                         href="{channel.lucentUrl}/records/{record.id}"
                 >
                     {cardTitle}
+                    {#if edge._isTrashed}
+                        <span class="trashed-text">Trashed</span>
+                    {/if}
                 </a>
                 <small class="d-block">
                     from {schema.label}
@@ -78,12 +92,30 @@
         {/if}
         {#if hasDelete}
             <div class="reference-action">
-                <button
-                        class="button"
-                        on:click={remove}
-                >
-                    <Icon icon="trash-can"/>
-                </button>
+                {#if edge._isTrashed}
+                    <button
+                            title="Restore"
+                            class="button"
+                            on:click={restore}
+                    >
+                        <Icon icon="undo"/>
+                    </button>
+                    <button
+                            title="Delete from everywhere"
+                            class="button"
+                            on:click={fullDelete}
+                    >
+                        <Icon icon="destroy"/>
+                    </button>
+                {:else}
+                    <button
+                            title="Remove"
+                            class="button"
+                            on:click={remove}
+                    >
+                        <Icon icon="trash-can"/>
+                    </button>
+                {/if}
             </div>
         {/if}
     </div>

front/js/svelte/records/previews/PreviewReference.svelte

@@ -10,21 +10,32 @@
     const channel = getContext("channel");
     export let graph;
     export let record;
+    export let edge;
     export let hasDelete = false;
 
     let schema = channel.schemas.find((aschema) => aschema.name === record.schema);
     let cardTitle = previewTitle(channel.schemas, record, graph);
-    const cardImageEdge = graph.edges.find(e => e.source === record.id  && e.field === schema.cardImage);
+    const cardImageEdge = graph.edges.find(e => e.source === record.id && e.field === schema.cardImage);
     let cardImageRecord = graph.records.find(r => r.id === cardImageEdge?.target);
 
     function remove(e) {
         e.preventDefault();
         dispatch("remove", record.id);
     }
+
+    function restore(e) {
+        e.preventDefault();
+        dispatch("restore", record.id);
+    }
+
+    function fullDelete(e) {
+        e.preventDefault();
+        dispatch("fulldelete", record.id);
+    }
 </script>
 
 
-<div class="preview-reference">
+<div class="preview-reference" class:is-trashed={edge._isTrashed}>
     <div style="display: flex;align-items: center;gap: 10px;">
 
         {#if cardImageRecord}
@@ -38,7 +49,12 @@
                         class="record-title"
                         href="{channel.lucentUrl}/records/{record.id}"
                 >
+
                     {cardTitle}
+                    {#if edge._isTrashed}
+                        <span class="trashed-text">Trashed</span>
+                    {/if}
+
                 </a>
                 <small class="d-block">
                     from {schema.label}
@@ -53,12 +69,30 @@
     </div>
     {#if hasDelete}
         <div class="reference-action">
-            <button
-                    class="button"
-                    on:click={remove}
-            >
-                <Icon icon="trash-can"/>
-            </button>
+            {#if edge._isTrashed}
+                <button
+                        title="Restore"
+                        class="button"
+                        on:click={restore}
+                >
+                    <Icon icon="undo"/>
+                </button>
+                <button
+                        title="Delete from everywhere"
+                        class="button"
+                        on:click={fullDelete}
+                >
+                    <Icon icon="destroy"/>
+                </button>
+            {:else}
+                <button
+                        title="Remove"
+                        class="button"
+                        on:click={remove}
+                >
+                    <Icon icon="trash-can"/>
+                </button>
+            {/if}
         </div>
     {/if}
 </div>