removed lodash and axios

2026-05-07 22:50:02 +03:00
parent daa4b268a6
commit a04cdd753d
24 changed files with 2191 additions and 4844 deletions
@@ -1,7 +1,5 @@
 <script>
    import { afterUpdate, getContext, onMount } from "svelte";
-    import { isEqual } from "lodash";
-    import axios from "axios";
    import EditHeader from "./header/EditHeader.svelte";
    import ContentTabs from "./header/ContentTabs.svelte";
    import FormField from "./FormField.svelte";
@@ -9,6 +7,7 @@
    import Info from "./Info.svelte";
    import ErrorAlert from "../common/ErrorAlert.svelte";
    import Title from "./header/Title.svelte";
+    import { apiPost, isEqual } from "../../helpers";

    const channel = getContext("channel");

@@ -97,12 +96,11 @@
            graph.edges = graph.edges?.filter(
                (edge) => !edge._isTrashed && edge.source === record.id,
            );
-            axios
-                .post(channel.lucentUrl + "/records", {
-                    record: record,
-                    edges: graph.edges,
-                    isCreateMode: isCreateMode,
-                })
+            apiPost(channel.lucentUrl + "/records", {
+                record: record,
+                edges: graph.edges,
+                isCreateMode: isCreateMode,
+            })
                .then(function (response) {
                    console.log("SAVE: SAVED");

@@ -110,14 +108,14 @@
                        window.location =
                            channel.lucentUrl + "/records/" + record.id;
                    } else {
-                        record = response.data.records[0] ?? null;
+                        record = response.records[0] ?? null;
                        if (!record) {
                            // means trashed
                            hasUnsavedData = false;
                            window.location = channel.lucentUrl;
                            return;
                        }
-                        graph = response.data;
+                        graph = response;
                        setOriginalContent();
                    }

@@ -1,8 +1,8 @@
 <script>
-    import { friendlyDate } from "../../helpers";
+    import { friendlyDate, isEqual } from "../../helpers";
    import Avatar from "../account/Avatar.svelte";
    import { usernameById } from "../account/users";
-    import { isEqual } from "lodash";
+
    import Icon from "../common/Icon.svelte";
    import RevisionCell from "./revisions/RevisionCell.svelte";
    import { getContext } from "svelte";
@@ -6,14 +6,13 @@
        onMount,
    } from "svelte";

-    import { isEqual } from "lodash";
    import FormField from "./FormField.svelte";
    import FilePreview from "./FilePreview.svelte";
    import ContentTabs from "./header/ContentTabs.svelte";
    import ErrorAlert from "../common/ErrorAlert.svelte";
    import EditHeader from "./header/EditHeader.svelte";
-    import axios from "axios";
    import Title from "./header/Title.svelte";
+    import { apiPost, isEqual } from "../../helpers";

    const channel = getContext("channel");
    const dispatch = createEventDispatcher();
@@ -118,17 +117,16 @@
                    (edge) => !edge._isTrashed && edge.source === record.id,
                ) ?? [];

-            axios
-                .post(channel.lucentUrl + "/records", {
-                    record: record,
-                    edges: graph.edges,
-                    isCreateMode: isCreateMode,
-                })
+            apiPost(channel.lucentUrl + "/records", {
+                record: record,
+                edges: graph.edges,
+                isCreateMode: isCreateMode,
+            })
                .then(function (response) {
                    console.log("SAVE: SAVED INLINE");

-                    record = response.data.records[0];
-                    graph = response.data;
+                    record = response.records[0];
+                    graph = response;
                    if (!isCreateMode) {
                        setOriginalContent();
                    }
@@ -1,12 +1,11 @@
 <script>
-    import {getContext} from "svelte";
-    import {insertEdges} from "./reference";
-    import {getErrorMessage} from "./errorMessage";
-    import {sortByField} from "../../edges/sortEdges";
+    import { getContext } from "svelte";
+    import { insertEdges } 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;
@@ -15,27 +14,36 @@
    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)) ?? [];
+    $: 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)
+        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),
        );
    }

    function reorder(e) {
-
-        graph.edges = sortByField(e.detail.source, e.detail.target, graph.edges, field.name, references);
+        graph.edges = sortByField(
+            e.detail.source,
+            e.detail.target,
+            graph.edges,
+            field.name,
+            references,
+        );
    }

    function insert(e) {
@@ -49,9 +57,14 @@
        // }).then(function (response) {
        //     graph = response.data.graph;
        // })
-        graph = insertEdges(graph, record, e.detail.records, field.name, e.detail.action);
+        graph = insertEdges(
+            graph,
+            record,
+            e.detail.records,
+            field.name,
+            e.detail.action,
+        );
    }
-
 </script>

 {#if errorMessage}
@@ -61,10 +74,10 @@
 {/if}
 <div class="inline-card-wrapper">
    <ReferenceInlineButtons
-            recordId={null}
-            schemas={collections}
-            on:insert={insert}
-            on:save={insert}
+        recordId={null}
+        schemas={collections}
+        on:insert={insert}
+        on:save={insert}
    />
 </div>
 {#if references.length > 0}
@@ -72,10 +85,10 @@
        {#each references as reference (reference.id)}
            <div>
                <PreviewReference
-                        {graph}
-                        record={reference}
-                        hasDelete={true}
-                        on:remove={removeReference}
+                    {graph}
+                    record={reference}
+                    hasDelete={true}
+                    on:remove={removeReference}
                />
            </div>
        {/each}
@@ -1,11 +1,11 @@
 <script>
-    import {createEventDispatcher, getContext} from "svelte";
+    import { createEventDispatcher, getContext } from "svelte";
    import Icon from "../../common/Icon.svelte";
    import InlineEdit from "../InlineEdit.svelte";
    import Dialog from "../../dialog/Dialog.svelte";
    import DialogRecord from "../../dialog/DialogRecord.svelte";
-    import axios from "axios";
    import Dropdown from "../../common/Dropdown.svelte";
+    import { apiGet } from "../../../helpers";

    const dispatch = createEventDispatcher();
    const channel = getContext("channel");
@@ -24,7 +24,7 @@
        e.preventDefault();
        console.log("Save inline");
        inLineCreateRecord = null;
-        dialogRecord.close()
+        dialogRecord.close();
        dispatch("save", {
            records: e.detail.records,
            after: recordId,
@@ -44,11 +44,10 @@
    function createInlineReference(e, schemaUId) {
        e.preventDefault();
        inLineCreateRecord = null;
-        axios
-            .get(channel.lucentUrl + "/records/newInline?schema=" + schemaUId)
+        apiGet(channel.lucentUrl + "/records/newInline?schema=" + schemaUId)
            .then((response) => {
-                inLineCreateRecord = response.data;
-                dialogRecord.open()
+                inLineCreateRecord = response;
+                dialogRecord.open();
            })
            .catch((error) => {
                console.log(error);
@@ -57,60 +56,53 @@
 </script>

 {#if schemas.length > 1}
-    <div
-            style="display: flex;align-items: center;gap:4px"
-    >
+    <div style="display: flex;align-items: center;gap:4px">
        <Dropdown>
            <div slot="button">New</div>
            {#each schemas as schema}
                <button
-                        class=" button"
-                        on:click={(e) =>
-                                createInlineReference(e, schema.name)}
-                >{schema.label}
+                    class=" button"
+                    on:click={(e) => createInlineReference(e, schema.name)}
+                    >{schema.label}
                </button>
            {/each}
-
        </Dropdown>
        <Dropdown>
-            <div slot="button"> <Icon icon="magnifying-glass"/></div>
+            <div slot="button"><Icon icon="magnifying-glass" /></div>
            {#each schemas as schema}
                <button
-                        class="button"
-                        on:click={(e) => openBrowseModal(e, schema.name)}
-                >{schema.label}
+                    class="button"
+                    on:click={(e) => openBrowseModal(e, schema.name)}
+                    >{schema.label}
                </button>
            {/each}
-
        </Dropdown>
    </div>
 {:else}
    <div style="display:flex;align-items: center;gap: 4px">
        <button
-                class="button"
-                on:click={(e) => createInlineReference(e, schemas[0].name)}
-        >New
+            class="button"
+            on:click={(e) => createInlineReference(e, schemas[0].name)}
+            >New
        </button>
        <button
-                class="button"
-                on:click={(e) => openBrowseModal(e, schemas[0].name)}
-        >
-            <Icon icon="magnifying-glass"/>
-        </button
+            class="button"
+            on:click={(e) => openBrowseModal(e, schemas[0].name)}
        >
+            <Icon icon="magnifying-glass" />
+        </button>
    </div>
 {/if}

 <DialogRecord bind:this={dialogRecord}>
    {#if inLineCreateRecord}
        <InlineEdit
-                {...inLineCreateRecord}
-                isCreateMode={true}
-                on:cancel={(e) => (inLineCreateRecord = null)}
-                on:inlinesaved={save}
+            {...inLineCreateRecord}
+            isCreateMode={true}
+            on:cancel={(e) => (inLineCreateRecord = null)}
+            on:inlinesaved={save}
        />
-
    {/if}
 </DialogRecord>

-<Dialog bind:this={browseModal} on:insert={insert}/>
+<Dialog bind:this={browseModal} on:insert={insert} />
@@ -1,6 +1,5 @@
 <script>
    import { getContext } from "svelte";
-    import { debounce } from "lodash";
    import { getErrorMessage } from "./errorMessage";
    import { insertEdges } from "./reference.js";
    import Icon from "../../common/Icon.svelte";
@@ -1,7 +1,6 @@
 <script>
-    import Tinymce from "../../libs/Tinymce.svelte";
    import RichEditorFiles from "./RichEditorFiles.svelte";
-    import {getErrorMessage} from "./errorMessage";
+    import { getErrorMessage } from "./errorMessage";
    import Trix from "../../libs/Trix.svelte";

    export let value;
@@ -18,29 +17,24 @@
        readonly: field.readonly && !isCreateMode,
    };

-    function insertMedia(e){
-        editor.insertMedia(e.detail)
+    function insertMedia(e) {
+        editor.insertMedia(e.detail);
    }
 </script>

 <div class="mb-0">
-
    <Trix {field} bind:this={editor} bind:value></Trix>
-<!--    <Tinymce  bind:this={editor} bind:value {additionalConfig}/>-->
+    <!--    <Tinymce  bind:this={editor} bind:value {additionalConfig}/>-->
    {#if field.collections.length > 0}
        <RichEditorFiles
-                bind:graph
-                {record}
-                {field}
-                {validationErrors}
-                on:editor-insert={insertMedia}
-        >
-
-
-        </RichEditorFiles>
+            bind:graph
+            {record}
+            {field}
+            {validationErrors}
+            on:editor-insert={insertMedia}
+        ></RichEditorFiles>
    {/if}

-
    {#if errorMessage}
        <div class="invalid-feedback d-block">
            {errorMessage}
@@ -1,5 +1,4 @@
 <script>
-    import { v4 as uuidv4 } from "uuid";
    import { getContext } from "svelte";
    import Icon from "../../common/Icon.svelte";
    import { getErrorMessage } from "./errorMessage";
@@ -14,12 +13,11 @@

    function generateId(e) {
        e.preventDefault();
-        value = uuidv4();
+        value = self.crypto.randomUUID();
    }
 </script>

 <div class="mb-0">
-
    <div class="d-flex justify-content-between">
        <input
            type="text"
@@ -31,13 +29,13 @@
            {readonly}
        />
        {#if !readonly}
-        <button
-            class="btn btn-primary ms-2"
-            title="Generate a new UUIDv4"
-            on:click={generateId}
-        >
-            <Icon icon="dice" />
-        </button>
+            <button
+                class="btn btn-primary ms-2"
+                title="Generate a new UUIDv4"
+                on:click={generateId}
+            >
+                <Icon icon="dice" />
+            </button>
        {/if}
    </div>

@@ -1,11 +1,10 @@
 <script>
-    import { uniqueId } from "lodash";
    import { getContext } from "svelte";
    const channelurl = getContext("channelurl");
    export let field;
    export let value;
    export let schema;
-    let id = uniqueId();
+    let id = self.crypto.randomUUID();
 </script>

 <div class="mb-0">
@@ -25,6 +24,6 @@
        placeholder="https://www.example.com"
    />
    {#if field.help}
-        <small class=" text-primary  opacity-50">{field.help}</small>
+        <small class=" text-primary opacity-50">{field.help}</small>
    {/if}
 </div>
@@ -1,24 +1,36 @@
-import {uniqBy} from "lodash";
+import { arrayUniqueCb } from "../../../helpers";

-export function insertEdges(graph, sourceRecord, targetRecords, fieldName, action = "") {
-    let newEdges = targetRecords.map((r) => {
-        return {
-            target: r.id,
-            source: sourceRecord.id,
-            sourceSchema: sourceRecord.schema,
-            targetSchema: r.schema,
-            field: fieldName,
-            depth: 1,
-            rank: ""
-        };
-    });
+export function insertEdges(
+  graph,
+  sourceRecord,
+  targetRecords,
+  fieldName,
+  action = "",
+) {
+  let newEdges = targetRecords.map((r) => {
+    return {
+      target: r.id,
+      source: sourceRecord.id,
+      sourceSchema: sourceRecord.schema,
+      targetSchema: r.schema,
+      field: fieldName,
+      depth: 1,
+      rank: "",
+    };
+  });

-    let replacedEdges = graph.edges;
-    if (action === "replace") {
-        replacedEdges = replacedEdges.filter((edge) => edge.field !== field.name);
-    }
+  let replacedEdges = graph.edges;
+  if (action === "replace") {
+    replacedEdges = replacedEdges.filter((edge) => edge.field !== field.name);
+  }

-    graph.records = uniqBy([...graph.records, ...targetRecords], (r) => r.id);
-    graph.edges = uniqBy([...replacedEdges, ...newEdges], (edge) =>  edge.source +  edge.target + edge.field + edge.depth);
-    return graph;
+  graph.records = arrayUniqueCb(
+    [...graph.records, ...targetRecords],
+    (r) => r.id,
+  );
+  graph.edges = arrayUniqueCb(
+    [...replacedEdges, ...newEdges],
+    (edge) => edge.source + edge.target + edge.field + edge.depth,
+  );
+  return graph;
 }