index remove graph

front/js/svelte/content/Index.svelte

@@ -1,5 +1,5 @@
 <script>
-    import Tools from "./tools/Tools.svelte";
+    // import Tools from "./tools/Tools.svelte";
     import Pagination from "./pagination/Pagination.svelte";
     import ActionsOnSelected from "./ActionsOnSelected.svelte";
     import Table from "./Table.svelte";
@@ -10,7 +10,6 @@
     export let schema;
     export let users;
     export let records;
-    export let graph;
     // export let visibleFields;
     export let systemFields;
     export let sortParam;
@@ -54,26 +53,25 @@
         {#if selected.length > 0 && !inModal && isWritable}
             <ActionsOnSelected {schema} {selected} {filter}/>
         {:else}
-            <Tools
-                    bind:schema
-                    bind:records
-                    {systemFields}
-                    {sortParam}
-                    {sortField}
-                    {operators}
-                    {filter}
-                    {graph}
-                    {inModal}
-                    {modalUrl}
-                    {isWritable}
-                    on:refresh={refresh}
-            />
+<!--            <Tools-->
+<!--                    bind:schema-->
+<!--                    bind:records-->
+<!--                    {systemFields}-->
+<!--                    {sortParam}-->
+<!--                    {sortField}-->
+<!--                    {operators}-->
+<!--                    {filter}-->
+<!--                    {graph}-->
+<!--                    {inModal}-->
+<!--                    {modalUrl}-->
+<!--                    {isWritable}-->
+<!--                    on:refresh={refresh}-->
+<!--            />-->
         {/if}
 
         {#if schema.type === "collection"}
             <Table
                     {records}
-                    {graph}
                     {schema}
                     {sortParam}
                     {sortField}

front/js/svelte/content/RecordRow.svelte

@@ -7,8 +7,7 @@
 
     export let schema;
     export let users;
-    export let graph;
-    export let record;
+    export let queryRecord;
     export let sortParam;
     export let sortField;
     export let visibleColumns;
@@ -20,7 +19,7 @@
         class="field-ui-{field.info.name}"
         class:is-sort={field.name === sortField.name}
     >
-        <RenderField {record} {schema} {graph} {field}/>
+        <RenderField {queryRecord}   {field}/>
     </td>
 {/each}
 {#if schema.visible.includes("status")}
@@ -28,7 +27,7 @@
         class="text-center"
         class:is-sort={"-status" == sortParam || "status" == sortParam}
     >
-        <Status status={record.status}/>
+        <Status status={queryRecord.record.status}/>
     </td>
 {/if}
 {#if schema.visible.includes("_sys.createdBy")}
@@ -36,7 +35,7 @@
         class="text-center"
         class:is-sort={"-_sys.createdBy" == sortParam || "_sys.createdBy" == sortParam}
     >
-        <Avatar name={usernameById(users, record._sys.createdBy)} side={24}/>
+        <Avatar name={usernameById(users, queryRecord.record._sys.createdBy)} side={24}/>
     </td>
 {/if}
 {#if schema.visible.includes("_sys.updatedBy")}
@@ -44,16 +43,16 @@
         class="text-center"
         class:is-sort={"-_sys.updatedBy" == sortParam || "_sys.updatedBy" == sortParam}
     >
-        <Avatar name={usernameById(users, record._sys.updatedBy)} side={24}/>
+        <Avatar name={usernameById(users, queryRecord.record._sys.updatedBy)} side={24}/>
     </td>
 {/if}
 {#if schema.visible.includes("_sys.createdAt")}
     <td class:is-sort={"-_sys.createdAt" == sortParam || "_sys.createdAt" == sortParam}>
-        {friendlyDate(record._sys.createdAt)}
+        {friendlyDate(queryRecord.record._sys.createdAt)}
     </td>
 {/if}
 {#if schema.visible.includes("_sys.updatedAt")}
     <td class:is-sort={"-_sys.updatedAt" == sortParam || "_sys.updatedAt" == sortParam}>
-        {friendlyDate(record._sys.updatedAt)}
+        {friendlyDate(queryRecord.record._sys.updatedAt)}
     </td>
 {/if}

front/js/svelte/content/RenderField.svelte

@@ -29,17 +29,13 @@
         file: File,
     };
     export let field;
-    export let schema;
-    export let record;
-    export let graph;
+    export let queryRecord;
 
 </script>
 
 <svelte:component
     this={renderElements[field.info.name]}
-    value={record.data[field.name]}
-    {record}
-    {graph}
-    {schema}
+    value={queryRecord.record.data[field.name]}
+    {queryRecord}
     {field}
 />

front/js/svelte/content/Table.svelte

@@ -11,7 +11,6 @@
     export let schema;
     export let users;
     export let records;
-    export let graph;
     export let systemFields;
     export let sortParam;
     export let sortField;
@@ -64,7 +63,7 @@
         </tr>
         </thead>
         <tbody>
-        {#each records as record (record.id)}
+        {#each records as queryRecord (queryRecord.record.id)}
             <tr>
                 <td class="title-td">
                     <div
@@ -74,13 +73,13 @@
                             {#if isWritable}
                                 <div class="form-check">
                                     <input
-                                            on:change={() => select(record)}
+                                            on:change={() => select(queryRecord)}
                                             class="form-check-input "
                                             type="checkbox"
                                             checked={selected.find(
-                                            (r) => r.id === record.id
+                                            (r) => r.id === queryRecord.record.id
                                         )}
-                                            value={record}
+                                            value={queryRecord}
                                     />
                                 </div>
                             {/if}
@@ -88,20 +87,20 @@
                             <a
 
                                     class="me-2 text-decoration-none text-dark fs-6"
-                                    href="{channel.lucentUrl}/records/{record.id}"
+                                    href="{channel.lucentUrl}/records/{queryRecord.record.id}"
                                     target={inModal ? "_blank" : "_self"}
-                                    title={previewTitle(record, graph)}
+                                    title={previewTitle(queryRecord)}
                                     data-bs-toggle="tooltip" data-bs-placement="left"
 
                             >
-                                {previewTitle(record, graph)}
+                                {previewTitle(queryRecord)}
                             </a>
                         </div>
                         <div>
                             <Avatar
                                     name={usernameById(
                                         users,
-                                        record._sys.updatedBy
+                                        queryRecord.record._sys.updatedBy
                                     )}
                                     side={24}
                             />
@@ -109,8 +108,7 @@
                     </div>
                 </td>
                 <RecordRow
-                        {record}
-                        {graph}
+                        {queryRecord}
                         {schema}
                         {visibleColumns}
                         {sortParam}

front/js/svelte/content/elements/File.svelte

@@ -1,18 +1,11 @@
 <script>
     import Preview from "../../files/Preview.svelte";
 
-    export let record;
+    export let queryRecord;
     export let field;
-    export let graph;
 
+    let filePreviews = queryRecord?._children[field.name];
 
-    let filePreviews = graph.edges?.filter((ed) => ed.field === field.name && ed.source === record.id)
-        .map((ed) => graph.records.find((r) => r.id === ed.target));
-    // if (edges[0]) {
-    //     firstRecord = record._children.find((r) => r.data.id === edges[0].to);
-    // }
-
-    console.log(filePreviews)
 </script>
 
 <!-- {#if firstRecord}

front/js/svelte/content/elements/Reference.svelte

@@ -1,25 +1,16 @@
 <script>
     import PreviewCardSmall from "../../records/PreviewCardSmall.svelte";
 
-    export let record;
+    export let queryRecord;
     export let field;
-    export let schemas;
-    export let graph;
-
-    $: recordEdges =
-        graph.edges
-            ?.filter((ed) => ed.field === field.name && ed.source === record.id)
-            .map((edge) => {
-                return graph.records.find((r) => r.id === edge.target);
-            })
-            .filter((record) => (!record ? false : true)) ?? [];
+    $: recordEdges = queryRecord?._children[field.name];
 
 </script>
 
 <div class="references">
     {#each recordEdges as recordEdge}
         <span class="mr-3">
-            <PreviewCardSmall {schemas} {graph} record={recordEdge}/>
+            <PreviewCardSmall record={recordEdge}/>
         </span>
     {/each}
 </div>

front/js/svelte/records/Edit.svelte

@@ -48,7 +48,7 @@
             schema: record.schema,
             status: record.status,
             _sys: JSON.parse(JSON.stringify(record._sys)),
-            edges: JSON.parse(JSON.stringify(graph.edges)),
+            edges: JSON.parse(JSON.stringify(graph)),
         };
     }
 
@@ -81,7 +81,7 @@
             schema: record.schema,
             status: record.status,
             _sys: record._sys,
-            edges: graph.edges,
+            edges: graph,
         });
     }
 
@@ -115,7 +115,7 @@
                     if (isCreateMode) {
                         window.location.href = channel.lucentUrl + "/records/" + record.id;
                     } else {
-                        record = response.data.records[0] ?? null;
+                        record = response.data.rootRecords[0] ?? null;
                         if (!record) {
                             // means trashed
                             hasUnsavedData = false;

front/js/svelte/records/Preview.js

@@ -2,27 +2,25 @@ import Mustache from "mustache";
 import {stripHtml} from "../../helpers";
 import {getContext} from "svelte";
 
-export function previewTitle(record, graph) {
+export function previewTitle(record) {
     const channel = getContext("channel");
-    let schema = channel.schemas.find((aSchema) => aSchema.name === record?.schema);
+    let schema = channel.schemas.find((aSchema) => aSchema.name === record.record?.schema);
 
     if (!schema?.titleTemplate) {
-        return noTemplate(schema, record);
+        return noTemplate(schema, record.record);
     }
 
-    let recordData = record.data;
+    let recordData = record.record.data;
     let template = Mustache.parse(schema.titleTemplate);
-    console.log({template})
     let referencePreviews = template
         .filter(segment => segment[0] === "name") // keep only template tags
         .map((segment) => segment[1]) // map to fieldNames
         .filter(fieldName => { // keep only references
             let schemaField = schema.fields.find(f => f.name === fieldName)
             return schemaField?.info.name === "reference";
-        }).reduce((carry, field) => {  // map to records
-            let edge = graph.edges.find(edge => edge.source === record.id && edge.field === field)
-            let referenceRecord = graph.records.find(rec => rec.id === edge?.target)
-            carry[field] = previewTitle(referenceRecord, graph);
+        }).reduce((carry, fieldName) => {  // map to records
+            let child = record._children[fieldName].find(c => c.record.id === record.record.id);
+            carry[field] = previewTitle(child);
             return carry;
         }, {});
     recordData = {...recordData, ...referencePreviews}
@@ -30,7 +28,7 @@ export function previewTitle(record, graph) {
     let render = Mustache.render(schema.titleTemplate, recordData);
 
     if (!render || render === "") {
-        return noTemplate(schema, record);
+        return noTemplate(schema, record.record);
     }
 
     return stripHtml(render.slice(0, 300));
@@ -41,11 +39,11 @@ function noTemplate(schema, record) {
         return record._file.path;
     }
 
-    let title =  stripHtml(
+    let title = stripHtml(
         record?.data[schema.fields.filter((f) => f.info.name === "text")[0]?.name]
     ).slice(0, 300);
 
-    if(title === ""){
+    if (title === "") {
         return "Untitled";
     }
 

front/js/svelte/records/PreviewCardSmall.svelte

@@ -4,10 +4,9 @@
 
     const channel = getContext("channel");
     export let record;
-    export let graph;
     $: schema = channel.schemas.find((aschema) => aschema.name === record.schema);
 
-    $: title = previewTitle(  record, graph);
+    $: title = previewTitle(  record);
 </script>
 
 {#if record?.data}

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

@@ -14,14 +14,7 @@
 
     let browseModal;
 
-    $: references = 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((recordEdge) => (!!recordEdge.record?.id)) ?? [];
+    $: currentReferences  = graph._children[field.name] ?? [];
 
     let collections = channel.schemas.filter((aschema) =>
         field.collections.includes(aschema.name)
@@ -29,9 +22,9 @@
 
     function removeReference(e) {
         e.preventDefault();
-        graph.edges = graph.edges.filter(
-            (edge) => !(edge.target === e.detail && edge.field === field.name)
-        );
+        // graph.edges = graph.edges.filter(
+        //     (edge) => !(edge.target === e.detail && edge.field === field.name)
+        // );
     }
 
     function openBrowseModal(e, schema) {
@@ -40,13 +33,14 @@
     }
 
     async function reorder(e) {
-        graph.edges = await sortByField(e.detail.source, e.detail.target, graph.edges, field.name);
+        // graph.edges = await sortByField(e.detail.source, e.detail.target, graph.edges, field.name);
     }
 
     function insert(e) {
         e.preventDefault();
         browseModal.close();
         const recordsToInsert = e.detail.records;
+        console.log({recordsToInsert})
         const action = e.detail.action;
         let newEdges = recordsToInsert.map((r) => {
             return {
@@ -64,8 +58,8 @@
             replacedEdges = replacedEdges.filter((e) => e.field !== field.name);
         }
 
-        graph.records = uniqBy([...graph.records, ...recordsToInsert], (r) => r.id);
-        graph.edges = uniqBy([...replacedEdges, ...newEdges], (e) => e.target + e.field);
+        // graph.records = uniqBy([...graph.records, ...recordsToInsert], (r) => r.id);
+        // graph.edges = uniqBy([...replacedEdges, ...newEdges], (e) => e.target + e.field);
     }
 </script>
 
@@ -103,9 +97,9 @@
         </div>
     {/if}
 </div>
-{#if references.length > 0}
+{#if currentReferences.length > 0}
     <Sortable sortableClass="row row-cols-3 mt-3" on:update={reorder}>
-        {#each references as reference (reference.record.id)}
+        {#each currentReferences as reference (reference.record.id)}
             <div class="col mb-3">
                 <PreviewCard
                     classes="h-100"

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

@@ -14,11 +14,7 @@
     export let validationErrors;
     $: 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)) ?? [];
+    $: currentReferences  = graph._children[field.name] ?? [];
 
     let collections = channel.schemas.filter((aschema) =>
         field.collections.includes(aschema.name)
@@ -56,9 +52,9 @@
         on:save={insert}
     />
 </div>
-{#if references.length > 0}
+{#if currentReferences.length > 0}
     <Sortable sortableClass="row row-cols-3 mt-3" on:update={reorder}>
-        {#each references as reference (reference.id)}
+        {#each currentReferences as reference (reference.id)}
             <div class="col mb-3">
                 <PreviewCard
                     classes="h-100"

front/js/svelte/records/elements/errorMessage.js

@@ -1,5 +1,3 @@
 export function getErrorMessage(validationErrors, fieldName) {
-    return validationErrors && validationErrors[fieldName]
-        ? validationErrors[fieldName].message
-        : null;
+    return validationErrors?.find((e) => e.fieldName ===  fieldName)?.message;
 }