WIP uploading files

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

@@ -1,31 +1,24 @@
 <script>
-    import {sortByField} from "../../edges/sortEdges";
+    import { sortByField } from "../../edges/sortEdges";
     import Sortable from "../../libs/Sortable.svelte";
     import PreviewFile from "../previews/PreviewFile.svelte";
     import Dropdown from "../../common/Dropdown.svelte";
     import Dialog from "../../dialog/Dialog.svelte";
-    import {insertEdges} from "./reference.js";
-    import {getContext} from "svelte";
+    import { insertEdges } from "./reference.js";
+    import { getContext } from "svelte";
+    import FileDialog from "../../dialog/FileDialog.svelte";
+    import Uploader from "../../files/Uploader.svelte";
 
     const channel = getContext("channel");
     export let field;
     export let record;
-    export let graph
+    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)) ?? [];
-
-    let collections = channel.schemas.filter((aschema) =>
-        field.collections.includes(aschema.name)
-    );
 
     function removeReference(e) {
         e.preventDefault();
         graph.edges = graph.edges.filter(
-            (edge) => !(edge.target === e.detail && edge.field === field.name)
+            (edge) => !(edge.target === e.detail && edge.field === field.name),
         );
     }
 
@@ -35,50 +28,56 @@
     }
 
     async function reorder(e) {
-
-        graph.edges = await sortByField(e.detail.source, e.detail.target, graph.edges, field.name, references);
-
+        graph.edges = await sortByField(
+            e.detail.source,
+            e.detail.target,
+            graph.edges,
+            field.name,
+            references,
+        );
     }
 
     function insert(e) {
         e.preventDefault();
         browseModal.close();
-        graph = insertEdges(graph, record, e.detail.records, field.name, e.detail.action);
+        graph = insertEdges(
+            graph,
+            record,
+            e.detail.records,
+            field.name,
+            e.detail.action,
+        );
+    }
+
+    function uploadComplete(e) {
+        records = e.detail;
     }
 </script>
 
 <div class="mb-0">
-    {#if field.collections.length === 1}
-        <button
-                class="button"
-                on:click={(e) => openBrowseModal(e, collections[0].name)}
-        >
-            Browse
-        </button>
-    {:else}
-        <Dropdown>
-            <div slot="button">
-                Browse
-            </div>
-            {#each collections as collection}
-                <!-- {`${channelurl}/content/${collection.name}?parent=${record.id}&parentfield=${field.name}`} -->
-                <a
-                        class="dropdown-item"
-                        on:click={(e) => openBrowseModal(e, collection.name)}
-                        href="/">{collection.label}</a
-                >
-            {/each}
-        </Dropdown>
-    {/if}
+    <!-- <button
+        class="button"
+        on:click={(e) => openFileModal(e, collections[0].name)}
+    >
+        Browse
+    </button> -->
+
+    <div>
+        <Uploader recordId={record.id} on:uploadComplete={uploadComplete} />
+    </div>
 </div>
-{#if references.length > 0}
+<!-- {#if references.length > 0}
     <Sortable sortableClass="mt-3" on:update={reorder}>
         {#each references as reference (reference.id)}
             <!--This div helps the sorting thing-->
-            <div>
-                <PreviewFile record={reference} hasDelete={true} on:remove={removeReference}></PreviewFile>
+<!-- <div>
+                <PreviewFile
+                    record={reference}
+                    hasDelete={true}
+                    on:remove={removeReference}
+                ></PreviewFile>
             </div>
         {/each}
     </Sortable>
-{/if}
-<Dialog bind:this={browseModal} on:insert={insert}></Dialog>
+{/if} -->
+<!-- <FileDialog bind:this={browseModal} on:insert={insert}></FileDialog> -->