@1771technologies/lytenyte-pro 1.0.12-dev.1 → 1.0.12-dev.2

package/dist/row-data-source-server/server-data.js

@@ -0,0 +1,378 @@
+import { equal } from "@1771technologies/lytenyte-js-utils";
+import { makeAsyncTree } from "./async-tree/make-async-tree.js";
+import { RangeTree } from "./range-tree/range-tree.js";
+import { getRequestId } from "./utils/get-request-id.js";
+import { getNodePath } from "./utils/get-node-path.js";
+import { getNodeDepth } from "./utils/get-node-depth.js";
+const noopFetcher = async () => [];
+export class ServerData {
+    #tree;
+    #top = { asOf: 0, rows: [] };
+    #bottom = { asOf: 0, rows: [] };
+    #blocksize;
+    #flat;
+    #dataFetcher = noopFetcher;
+    #pivotMode;
+    #expansions;
+    #pivotExpansions;
+    #onResetLoadBegin;
+    #onResetLoadError;
+    #onResetLoadEnd;
+    #onFlatten;
+    #rowViewBounds = [0, 0];
+    #prevRequests = [];
+    #loadingRows = new Set();
+    #rowsWithError = new Map();
+    #controllers = new Set();
+    #defaultExpansion;
+    constructor({ blocksize, pivotMode, pivotExpansions, expansions, onResetLoadBegin, onResetLoadEnd, onResetLoadError, onFlatten, defaultExpansion, }) {
+        this.#tree = makeAsyncTree();
+        this.#blocksize = blocksize;
+        this.#pivotMode = pivotMode;
+        this.#expansions = expansions;
+        this.#pivotExpansions = pivotExpansions;
+        this.#defaultExpansion = defaultExpansion;
+        this.#onResetLoadBegin = onResetLoadBegin;
+        this.#onResetLoadEnd = onResetLoadEnd;
+        this.#onResetLoadError = onResetLoadError;
+        this.#onFlatten = onFlatten;
+    }
+    // Properties
+    set dataFetcher(d) {
+        if (this.#dataFetcher === d)
+            return;
+        this.#dataFetcher = d;
+        this.reset();
+    }
+    set pivotMode(b) {
+        if (b === this.#pivotMode)
+            return;
+        this.#pivotMode = b;
+        this.reset();
+    }
+    set expansions(d) {
+        this.#expansions = d;
+        if (this.#pivotMode)
+            return;
+        this.#flatten();
+    }
+    set pivotExpansions(d) {
+        this.#pivotExpansions = d;
+        if (!this.#pivotMode)
+            return;
+        this.#flatten();
+    }
+    set defaultExpansion(d) {
+        this.#defaultExpansion = d;
+    }
+    set rowViewBounds(viewBounds) {
+        if (equal(viewBounds, this.#rowViewBounds))
+            return;
+        this.#rowViewBounds = viewBounds;
+        this.handleViewBoundsChange();
+    }
+    // Methods
+    reset = async () => {
+        // Abort all the existing requests in flight.
+        this.#controllers.forEach((c) => c.abort());
+        this.#tree = makeAsyncTree();
+        this.#flatten();
+        try {
+            this.#onResetLoadBegin();
+            this.#prevRequests = [
+                {
+                    rowStartIndex: 0,
+                    rowEndIndex: this.#blocksize,
+                    id: getRequestId([], 0, this.#blocksize),
+                    path: [],
+                    start: 0,
+                    end: this.#blocksize,
+                },
+            ];
+            const res = await this.#dataFetcher(this.#prevRequests, this.#expansions, this.#pivotExpansions);
+            this.handleResponses(res);
+        }
+        catch (e) {
+            console.log(e);
+            this.#onResetLoadError(e);
+        }
+        finally {
+            this.#onResetLoadEnd();
+        }
+    };
+    handleRequests = async (requests, opts = {}) => {
+        const controller = new AbortController();
+        this.#controllers.add(controller);
+        const skip = opts.skipState ?? false;
+        // We need to request our new data now. There are a few scenarios to be aware. Once we are requesting rows,
+        // we should mark the rows loading. This means we mark the row indices as loading (maybe by range)?
+        // The load may fail, in which case we should mark the request as an error.
+        try {
+            // Mark these rows as loading
+            requests.forEach((req) => {
+                if (!skip)
+                    for (let i = req.rowStartIndex; i < req.rowEndIndex; i++)
+                        this.#loadingRows.add(i);
+            });
+            const responses = await this.#dataFetcher(requests, this.#expansions, this.#pivotExpansions);
+            // The request was aborted, so we can ignore it from this point
+            if (controller.signal.aborted)
+                return;
+            this.handleResponses(responses, () => {
+                if (!skip)
+                    requests.forEach((req) => {
+                        for (let i = req.rowStartIndex; i < req.rowEndIndex; i++)
+                            this.#rowsWithError.delete(i);
+                        for (let i = req.rowStartIndex; i < req.rowEndIndex; i++)
+                            this.#loadingRows.delete(i);
+                    });
+            });
+            opts?.onSuccess?.();
+        }
+        catch (e) {
+            if (controller.signal.aborted)
+                return;
+            opts?.onError?.(e);
+            if (!skip)
+                requests.forEach((req) => {
+                    for (let i = req.rowStartIndex; i < req.rowEndIndex; i++)
+                        this.#rowsWithError.set(i, e);
+                    for (let i = req.rowStartIndex; i < req.rowEndIndex; i++)
+                        this.#loadingRows.delete(i);
+                });
+        }
+        finally {
+            this.#controllers.delete(controller);
+        }
+    };
+    handleResponses = (data, beforeOnFlat) => {
+        const pinned = data.filter((c) => c.kind === "top" || c.kind === "bottom");
+        const center = data.filter((c) => c.kind !== "top" && c.kind !== "bottom");
+        // handle pinned
+        for (let i = 0; i < pinned.length; i++) {
+            const r = pinned[i];
+            if (r.kind === "top" && r.asOfTime > this.#top.asOf) {
+                this.#top = {
+                    asOf: r.asOfTime,
+                    rows: r.data.map((c) => ({ id: c.id, data: c.data, kind: "leaf" })),
+                };
+            }
+            else if (r.kind === "bottom" && r.asOfTime > this.#bottom.asOf) {
+                this.#bottom = {
+                    asOf: r.asOfTime,
+                    rows: r.data.map((c) => ({ id: c.id, data: c.data, kind: "leaf" })),
+                };
+            }
+        }
+        center.sort((l, r) => l.path.length - r.path.length);
+        for (let i = 0; i < center.length; i++) {
+            const r = center[i];
+            this.#tree.set({
+                path: r.path,
+                items: r.data.map((c, i) => {
+                    if (c.kind === "leaf") {
+                        return {
+                            kind: "leaf",
+                            data: {
+                                kind: "leaf",
+                                data: c.data,
+                                id: c.id,
+                            },
+                            relIndex: r.start + i,
+                        };
+                    }
+                    else {
+                        return {
+                            kind: "parent",
+                            data: {
+                                kind: "branch",
+                                data: c.data,
+                                depth: r.path.length,
+                                id: c.id,
+                                key: c.key,
+                            },
+                            path: c.key,
+                            relIndex: r.start + i,
+                            size: c.childCount,
+                        };
+                    }
+                }),
+                size: r.size,
+                asOf: r.asOfTime,
+            });
+        }
+        // Re-flatten our tree once everything has been re-updated.
+        this.#flatten(beforeOnFlat);
+    };
+    async handleViewBoundsChange() {
+        const [start, end] = this.#rowViewBounds;
+        const seen = new Set();
+        const requests = [];
+        for (let i = start; i < end; i++) {
+            const ranges = this.#flat.rangeTree.findRangesForRowIndex(i);
+            ranges.forEach((c) => {
+                if (c.parent.kind === "root") {
+                    const blockIndex = Math.floor(i / this.#blocksize);
+                    const start = blockIndex * this.#blocksize;
+                    const end = Math.min(start + this.#blocksize, c.parent.size);
+                    const path = [];
+                    const reqId = getRequestId(path, start, start + this.#blocksize);
+                    if (seen.has(reqId))
+                        return;
+                    seen.add(reqId);
+                    const size = start + this.#blocksize > c.parent.size ? c.parent.size - start : this.#blocksize;
+                    requests.push({ id: reqId, path, start, end, rowStartIndex: i, rowEndIndex: i + size });
+                }
+                else {
+                    const blockIndex = Math.floor((i - c.rowStart) / this.#blocksize);
+                    const start = blockIndex * this.#blocksize;
+                    const end = Math.min(start + this.#blocksize, c.parent.size);
+                    const path = getNodePath(c.parent);
+                    const reqId = getRequestId(path, start, start + this.#blocksize);
+                    if (seen.has(reqId))
+                        return;
+                    seen.add(reqId);
+                    const size = start + this.#blocksize > c.parent.size ? c.parent.size - start : this.#blocksize;
+                    requests.push({ id: reqId, path, start, end, rowStartIndex: i, rowEndIndex: i + size });
+                }
+            });
+        }
+        const newRequests = requests.filter((c) => !this.#prevRequests.find((prev) => prev.id === c.id));
+        // We don't have any new requests to make in our view, so we can return
+        if (!newRequests.length)
+            return;
+        this.#prevRequests = requests;
+        await this.handleRequests(newRequests);
+    }
+    updateRow(id, data) {
+        const centerRow = this.#flat.rowIdToTreeNode.get(id);
+        if (centerRow) {
+            centerRow.data = { ...centerRow.data, data };
+            return;
+        }
+        // Maybe its a pinned row?
+        const topIndex = this.#top.rows.findIndex((c) => c.id === id);
+        if (topIndex != -1) {
+            this.#top.rows[topIndex] = { ...this.#top.rows[topIndex], data };
+        }
+        const botIndex = this.#bottom.rows.findIndex((c) => c.id === id);
+        if (botIndex != -1) {
+            this.#top.rows[botIndex] = { ...this.#top.rows[botIndex], data };
+        }
+    }
+    #flatten = (beforeOnFlat) => {
+        const mode = this.#pivotMode;
+        const expansions = mode ? this.#pivotExpansions : this.#expansions;
+        const t = this.#tree;
+        const rowIdToRow = new Map();
+        const rowIndexToRow = new Map();
+        const rowIdToRowIndex = new Map();
+        const rowIdToTreeNode = new Map();
+        const ranges = [];
+        const blocksize = this.#blocksize;
+        const previousRequests = this.#prevRequests;
+        const withError = this.#rowsWithError;
+        const withLoading = this.#loadingRows;
+        const handleRequests = this.handleRequests;
+        const defaultExpansion = this.#defaultExpansion;
+        const postFlatRequests = [];
+        function processParent(node, start) {
+            const rows = [...node.byIndex.values()].sort((l, r) => l.relIndex - r.relIndex);
+            let offset = 0;
+            for (let i = 0; i < rows.length; i++) {
+                const row = rows[i];
+                const rowIndex = row.relIndex + start + offset;
+                rowIndexToRow.set(rowIndex, row.data);
+                rowIdToRowIndex.set(row.data.id, rowIndex);
+                rowIdToRow.set(row.data.id, row.data);
+                rowIdToTreeNode.set(row.data.id, row);
+                if (row.kind === "parent") {
+                    const expanded = expansions[row.data.id] ??
+                        (typeof defaultExpansion === "number"
+                            ? getNodeDepth(row) <= defaultExpansion
+                            : defaultExpansion);
+                    if (expanded && !row.byIndex.size) {
+                        const path = getNodePath(row);
+                        const start = 0;
+                        const end = Math.min(start + blocksize, row.size);
+                        const reqSize = end - start;
+                        const req = {
+                            path,
+                            start: start,
+                            end: end,
+                            id: getRequestId(path, 0, blocksize),
+                            rowStartIndex: rowIndex + 1,
+                            rowEndIndex: rowIndex + 1 + reqSize,
+                        };
+                        // If we haven't already requested this node
+                        if (!previousRequests.find((c) => c.id === req.id)) {
+                            postFlatRequests.push([rowIndex, req]);
+                        }
+                    }
+                    else if (expanded) {
+                        offset += processParent(row, rowIndex + 1);
+                    }
+                }
+            }
+            ranges.push({
+                rowStart: start,
+                rowEnd: offset + node.size + start,
+                parent: node,
+            });
+            return offset + node.size;
+        }
+        const topCount = this.#top.rows.length;
+        const bottomCount = this.#bottom.rows.length;
+        for (let i = 0; i < topCount; i++) {
+            const row = this.#top.rows[i];
+            rowIndexToRow.set(i, row);
+            rowIdToRow.set(row.id, row);
+            rowIdToRowIndex.set(row.id, i);
+        }
+        const size = processParent(t, topCount);
+        for (let i = 0; i < bottomCount; i++) {
+            const row = this.#bottom.rows[i];
+            const rowIndex = i + size;
+            rowIndexToRow.set(rowIndex, row);
+            rowIdToRow.set(row.id, row);
+            rowIdToRowIndex.set(row.id, rowIndex);
+        }
+        const rangeTree = new RangeTree(ranges);
+        if (postFlatRequests.length > 0) {
+            postFlatRequests.forEach((c) => {
+                withLoading.add(c[0]);
+                previousRequests.push(c[1]);
+            });
+            const reqs = postFlatRequests.map((c) => c[1]);
+            handleRequests(reqs, {
+                skipState: true,
+                onError: (e) => {
+                    postFlatRequests.forEach((c) => {
+                        withLoading.delete(c[0]);
+                        withError.set(c[0], e);
+                    });
+                },
+                onSuccess: () => {
+                    postFlatRequests.forEach((c) => {
+                        withLoading.delete(c[0]);
+                    });
+                },
+            });
+        }
+        this.#flat = {
+            tree: t,
+            top: topCount,
+            center: size - topCount,
+            bottom: bottomCount,
+            rangeTree,
+            rowIndexToRow,
+            rowIdToRow,
+            rowIdToRowIndex,
+            rowIdToTreeNode,
+            errored: this.#rowsWithError,
+            loading: this.#loadingRows,
+        };
+        beforeOnFlat?.();
+        this.#onFlatten(this.#flat);
+    };
+}

package/dist/row-data-source-server/use-server-data-source.d.ts

@@ -0,0 +1,3 @@
+import type { RowDataSourceServer, RowDataSourceServerParams } from "../+types.js";
+export declare function makeServerDataSource<T>({ dataFetcher, dataInFilterItemFetcher, dataColumnPivotFetcher, cellUpdateHandler, cellUpdateOptimistically, blockSize, }: RowDataSourceServerParams<T>): RowDataSourceServer<T>;
+export declare function useServerDataSource<T>(p: RowDataSourceServerParams<T>): RowDataSourceServer<T>;