@1771technologies/lytenyte-pro 1.0.0-beta.12 → 1.0.0-beta.14

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

@@ -7,689 +7,676 @@ import { getRequestId } from "./utils/get-request-id.js";
 import { RangeTree } from "./range-tree/range-tree.js";
 import { getNodePath } from "./utils/get-node-path.js";
 import { equal } from "@1771technologies/lytenyte-js-utils";
-export function makeServerDataSource({
-  dataFetcher,
-  dataColumnPivotFetcher,
-  dataInFilterItemFetcher,
-  cellUpdateHandler,
-  cellUpdateOptimistically = true,
-  blockSize = 200,
-}) {
-  let grid = null;
-  const snapshot$ = atom(Date.now());
-  const rdsStore = createStore();
-  const tree$ = atom(makeAsyncTree());
-  const tree = makeGridAtom(tree$, rdsStore);
-  const isLoading$ = atom(false);
-  const isLoading = makeGridAtom(isLoading$, rdsStore);
-  const error$ = atom();
-  const loadError = makeGridAtom(error$, rdsStore);
-  const nodesWithError = atom(new Map());
-  const initialized = atom(false);
-  const model$ = atom({
-    sorts: [],
-    filters: {},
-    filtersIn: {},
-    quickSearch: null,
-    group: [],
-    groupExpansions: {},
-    aggregations: {},
-    pivotGroupExpansions: {},
-    pivotMode: false,
-    pivotModel: {
-      columns: [],
-      filters: {},
-      filtersIn: {},
-      rows: [],
-      sorts: [],
-      values: [],
-    },
-  });
-  const model = makeGridAtom(model$, rdsStore);
-  const pivotGroupExpansions = atom((g) => g(model$).pivotGroupExpansions);
-  const rowGroupExpansions = atom((g) => g(model$).groupExpansions);
-  const pivotMode = atom((g) => g(model$).pivotMode);
-  const topData = atom([]);
-  const botData = atom([]);
-  const seenRequests = new Set();
-  const dataResponseHandler = (res) => {
-    const t = tree.get();
-    const dataResponses = res.filter((r) => {
-      return !("kind" in r && (r.kind === "top" || r.kind === "bottom"));
+export function makeServerDataSource({ dataFetcher, dataColumnPivotFetcher, dataInFilterItemFetcher, cellUpdateHandler, cellUpdateOptimistically = true, blockSize = 200, }) {
+    let grid = null;
+    const snapshot$ = atom(Date.now());
+    const rdsStore = createStore();
+    const tree$ = atom(makeAsyncTree());
+    const tree = makeGridAtom(tree$, rdsStore);
+    const isLoading$ = atom(false);
+    const isLoading = makeGridAtom(isLoading$, rdsStore);
+    const error$ = atom();
+    const loadError = makeGridAtom(error$, rdsStore);
+    const nodesWithError = atom(new Map());
+    const initialized = atom(false);
+    const model$ = atom({
+        sorts: [],
+        filters: {},
+        filtersIn: {},
+        quickSearch: null,
+        group: [],
+        groupExpansions: {},
+        aggregations: {},
+        pivotGroupExpansions: {},
+        pivotMode: false,
+        pivotModel: {
+            columns: [],
+            filters: {},
+            filtersIn: {},
+            rows: [],
+            sorts: [],
+            values: [],
+        },
     });
-    dataResponses.sort((l, r) => l.path.length - r.path.length);
-    const pinResponses = res.filter((r) => {
-      return "kind" in r && (r.kind === "top" || r.kind === "bottom");
-    });
-    pinResponses.forEach((p) => {
-      if (p.kind === "top") {
-        rdsStore.set(topData, p.data);
-      } else {
-        rdsStore.set(botData, p.data);
-      }
-    });
-    dataResponses.forEach((r) => {
-      t.set({
-        path: r.path,
-        items: r.data.map((c, i) => {
-          if (c.kind === "leaf") {
-            return {
-              kind: "leaf",
-              data: c,
-              relIndex: r.start + i,
-            };
-          } else {
-            return {
-              kind: "parent",
-              data: c,
-              path: c.key,
-              relIndex: r.start + i,
-              size: c.childCount,
-            };
-          }
-        }),
-        size: r.size,
-      });
-    });
-  };
-  const dataRequestHandler = async (p, force = false, onSuccess, onFailure) => {
-    if (!grid) return;
-    const unseen = p.filter((x) => force || !seenRequests.has(x.id));
-    unseen.forEach((x) => seenRequests.add(x.id));
-    if (unseen.length === 0) {
-      onSuccess?.();
-      return;
-    }
-    rdsStore.set(nodesWithError, (prev) => {
-      const next = new Map(prev);
-      p.forEach((r) => {
-        for (let i = r.rowStartIndex; i < r.rowEndIndex; i++) {
-          next.delete(i);
-        }
-      });
-      return prev;
-    });
-    try {
-      const res = await dataFetcher({
-        grid: grid,
-        model: model.get(),
-        reqTime: Date.now(),
-        requests: p,
-      });
-      dataResponseHandler(res);
-      onSuccess?.();
-    } catch (e) {
-      // Mark them as unseen since the request failed.
-      unseen.forEach((x) => seenRequests.delete(x.id));
-      onFailure?.(e);
-      console.error(e);
-    } finally {
-      rdsStore.set(snapshot$, Date.now());
-      grid.state.rowDataStore.rowClearCache();
-    }
-  };
-  const viewChange = () => {
-    if (!grid) return;
-    const bounds = grid.state.viewBounds.get();
-    const f = flat.get();
-    const te = bounds.rowTopEnd;
-    const seen = new Set();
-    const requests = [];
-    for (let i = bounds.rowCenterStart - te; i < bounds.rowCenterEnd - te; i++) {
-      const ranges = f.rangeTree.findRangesForRowIndex(i);
-      ranges.forEach((c) => {
-        if (c.parent.kind === "root") {
-          const blockIndex = Math.floor(i / blockSize);
-          const start = blockIndex * blockSize;
-          const end = Math.min(start + blockSize, c.parent.size);
-          const reqId = getRequestId([], start, end);
-          if (seen.has(reqId)) return;
-          seen.add(reqId);
-          const size = start + blockSize > c.parent.size ? c.parent.size - start : blockSize;
-          requests.push({
-            id: reqId,
-            path: [],
-            start,
-            end,
-            rowStartIndex: i,
-            rowEndIndex: i + size,
-          });
-        } else {
-          const blockIndex = Math.floor(c.parent.relIndex / blockSize);
-          const start = blockIndex * blockSize;
-          const end = Math.min(start + blockSize, c.parent.size);
-          const path = getNodePath(c.parent);
-          const reqId = getRequestId(path, start, end);
-          if (seen.has(reqId)) return;
-          seen.add(reqId);
-          const size = start + blockSize > c.parent.size ? c.parent.size - start : blockSize;
-          requests.push({
-            id: reqId,
-            path,
-            start,
-            end,
-            rowStartIndex: i,
-            rowEndIndex: i + size,
-          });
+    const model = makeGridAtom(model$, rdsStore);
+    const pivotGroupExpansions = atom((g) => g(model$).pivotGroupExpansions);
+    const rowGroupExpansions = atom((g) => g(model$).groupExpansions);
+    const pivotMode = atom((g) => g(model$).pivotMode);
+    const topData = atom([]);
+    const botData = atom([]);
+    const seenRequests = new Set();
+    const dataResponseHandler = (res) => {
+        const t = tree.get();
+        const dataResponses = res.filter((r) => {
+            return !("kind" in r && (r.kind === "top" || r.kind === "bottom"));
+        });
+        dataResponses.sort((l, r) => l.path.length - r.path.length);
+        const pinResponses = res.filter((r) => {
+            return "kind" in r && (r.kind === "top" || r.kind === "bottom");
+        });
+        pinResponses.forEach((p) => {
+            if (p.kind === "top") {
+                rdsStore.set(topData, p.data);
+            }
+            else {
+                rdsStore.set(botData, p.data);
+            }
+        });
+        dataResponses.forEach((r) => {
+            t.set({
+                path: r.path,
+                items: r.data.map((c, i) => {
+                    if (c.kind === "leaf") {
+                        return {
+                            kind: "leaf",
+                            data: c,
+                            relIndex: r.start + i,
+                        };
+                    }
+                    else {
+                        return {
+                            kind: "parent",
+                            data: c,
+                            path: c.key,
+                            relIndex: r.start + i,
+                            size: c.childCount,
+                        };
+                    }
+                }),
+                size: r.size,
+            });
+        });
+    };
+    const dataRequestHandler = async (p, force = false, onSuccess, onFailure) => {
+        if (!grid)
+            return;
+        const unseen = p.filter((x) => force || !seenRequests.has(x.id));
+        unseen.forEach((x) => seenRequests.add(x.id));
+        if (unseen.length === 0) {
+            onSuccess?.();
+            return;
         }
-      });
-    }
-    dataRequestHandler(
-      requests,
-      false,
-      () => {},
-      (e) => {
         rdsStore.set(nodesWithError, (prev) => {
-          const next = new Map(prev);
-          requests.forEach((r) => {
-            for (let i = r.rowStartIndex; i < r.rowEndIndex; i++) {
-              next.set(i, e);
-            }
-          });
-          return prev;
+            const next = new Map(prev);
+            p.forEach((r) => {
+                for (let i = r.rowStartIndex; i < r.rowEndIndex; i++) {
+                    next.delete(i);
+                }
+            });
+            return prev;
         });
-      },
-    );
-  };
-  const resetRequest = async () => {
-    seenRequests.clear();
-    tree.set(makeAsyncTree());
-    rdsStore.set(nodesWithError, new Map());
-    // Initialize the grid.
-    const initialDataRequest = {
-      path: [],
-      id: getRequestId([], 0, blockSize),
-      rowStartIndex: 0,
-      rowEndIndex: blockSize,
-      start: 0,
-      end: blockSize,
+        try {
+            const res = await dataFetcher({
+                grid: grid,
+                model: model.get(),
+                reqTime: Date.now(),
+                requests: p,
+            });
+            dataResponseHandler(res);
+            onSuccess?.();
+        }
+        catch (e) {
+            // Mark them as unseen since the request failed.
+            unseen.forEach((x) => seenRequests.delete(x.id));
+            onFailure?.(e);
+            console.error(e);
+        }
+        finally {
+            rdsStore.set(snapshot$, Date.now());
+            grid.state.rowDataStore.rowClearCache();
+        }
     };
-    loadError.set(null);
-    isLoading.set(true);
-    await dataRequestHandler(
-      [initialDataRequest],
-      false,
-      () => {},
-      (e) => {
-        loadError.set(e);
-      },
-    );
-    isLoading.set(false);
-  };
-  const flat$ = atom((g) => {
-    g(snapshot$);
-    const mode = rdsStore.get(pivotMode);
-    const expansions = mode ? g(pivotGroupExpansions) : g(rowGroupExpansions);
-    const t = g(tree$);
-    const rowIdToRow = new Map();
-    const rowIndexToRow = new Map();
-    const rowIdToRowIndex = new Map();
-    const ranges = [];
-    function processParent(node, start) {
-      const rows = [...node.byIndex.values()].sort((l, r) => l.relIndex - r.relIndex);
-      // Track the additional rows added by expanded groups
-      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);
-        rowIdToRowIndex.set(row.data.id, rowIndex);
-        rowIdToRow.set(row.data.id, row);
-        if (row.kind === "parent" && expansions[row.data.id]) {
-          offset += processParent(row, rowIndex + 1);
+    const viewChange = () => {
+        if (!grid)
+            return;
+        const bounds = grid.state.viewBounds.get();
+        const f = flat.get();
+        const te = bounds.rowTopEnd;
+        const seen = new Set();
+        const requests = [];
+        for (let i = bounds.rowCenterStart - te; i < bounds.rowCenterEnd - te; i++) {
+            const ranges = f.rangeTree.findRangesForRowIndex(i);
+            ranges.forEach((c) => {
+                if (c.parent.kind === "root") {
+                    const blockIndex = Math.floor(i / blockSize);
+                    const start = blockIndex * blockSize;
+                    const end = Math.min(start + blockSize, c.parent.size);
+                    const reqId = getRequestId([], start, end);
+                    if (seen.has(reqId))
+                        return;
+                    seen.add(reqId);
+                    const size = start + blockSize > c.parent.size ? c.parent.size - start : blockSize;
+                    requests.push({
+                        id: reqId,
+                        path: [],
+                        start,
+                        end,
+                        rowStartIndex: i,
+                        rowEndIndex: i + size,
+                    });
+                }
+                else {
+                    const blockIndex = Math.floor(c.parent.relIndex / blockSize);
+                    const start = blockIndex * blockSize;
+                    const end = Math.min(start + blockSize, c.parent.size);
+                    const path = getNodePath(c.parent);
+                    const reqId = getRequestId(path, start, end);
+                    if (seen.has(reqId))
+                        return;
+                    seen.add(reqId);
+                    const size = start + blockSize > c.parent.size ? c.parent.size - start : blockSize;
+                    requests.push({
+                        id: reqId,
+                        path,
+                        start,
+                        end,
+                        rowStartIndex: i,
+                        rowEndIndex: i + size,
+                    });
+                }
+            });
         }
-      }
-      ranges.push({ rowStart: start, rowEnd: offset + node.size + start, parent: node });
-      return offset + node.size;
-    }
-    const size = processParent(t, 0);
-    const rangeTree = new RangeTree(ranges);
-    return {
-      size,
-      rowIndexToRow,
-      rowIdToRow,
-      rowIdToRowIndex,
-      rangeTree,
+        dataRequestHandler(requests, false, () => { }, (e) => {
+            rdsStore.set(nodesWithError, (prev) => {
+                const next = new Map(prev);
+                requests.forEach((r) => {
+                    for (let i = r.rowStartIndex; i < r.rowEndIndex; i++) {
+                        next.set(i, e);
+                    }
+                });
+                return prev;
+            });
+        });
     };
-  });
-  const flat = makeGridAtom(flat$, rdsStore);
-  const cleanup = [];
-  const init = (g) => {
-    grid = g;
-    const sorts = g.state.sortModel.get();
-    const filters = g.state.filterModel.get();
-    const filtersIn = g.state.filterInModel.get();
-    const quickSearch = g.state.quickSearch.get();
-    const group = g.state.rowGroupModel.get();
-    const groupExpansions = g.state.rowGroupExpansions.get();
-    const aggregations = g.state.aggModel.get();
-    const pivotMode = g.state.columnPivotMode.get();
-    const pivotModel = g.state.columnPivotModel.get();
-    const pivotGroupExpansions = g.state.columnPivotRowGroupExpansions.get();
-    rdsStore.set(model$, {
-      sorts,
-      filters,
-      filtersIn,
-      quickSearch,
-      aggregations,
-      group,
-      groupExpansions,
-      pivotMode,
-      pivotModel,
-      pivotGroupExpansions,
-    });
-    rdsStore.set(initialized, true);
-    // Handle row count changes
-    const f = flat.get();
-    g.state.rowDataStore.rowCenterCount.set(f.size);
-    g.state.rowDataStore.rowBottomCount.set(rdsStore.get(botData).length);
-    g.state.rowDataStore.rowTopCount.set(rdsStore.get(topData).length);
-    rdsStore.sub(flat$, () => {
-      const f = flat.get();
-      g.state.rowDataStore.rowCenterCount.set(f.size);
-      viewChange();
-    });
-    rdsStore.sub(topData, () => {
-      g.state.rowDataStore.rowTopCount.set(rdsStore.get(topData).length);
-      g.state.rowDataStore.rowClearCache();
-    });
-    rdsStore.sub(botData, () => {
-      g.state.rowDataStore.rowBottomCount.set(rdsStore.get(botData).length);
-      g.state.rowDataStore.rowClearCache();
-    });
-    resetRequest();
-    // Watch the view bound changes.
-    g.state.viewBounds.watch(() => {
-      viewChange();
-    });
-    let prevPivotColumnModel = pivotModel.columns;
-    let prevPivotColumnValues = pivotModel.values;
-    const updatePivotColumns = async (mdl, ignoreEqualCheck = false) => {
-      if (
-        !ignoreEqualCheck &&
-        equal(prevPivotColumnModel, mdl.columns) &&
-        equal(prevPivotColumnValues, mdl.values)
-      )
-        return;
-      const cols = await dataColumnPivotFetcher?.({
-        grid: grid,
-        model: model.get(),
-        reqTime: Date.now(),
-      });
-      if (cols) grid?.state.columnPivotColumns.set(cols);
-      resetRequest();
-      prevPivotColumnModel = mdl.columns;
-      prevPivotColumnValues = mdl.values;
+    const resetRequest = async () => {
+        seenRequests.clear();
+        tree.set(makeAsyncTree());
+        rdsStore.set(nodesWithError, new Map());
+        // Initialize the grid.
+        const initialDataRequest = {
+            path: [],
+            id: getRequestId([], 0, blockSize),
+            rowStartIndex: 0,
+            rowEndIndex: blockSize,
+            start: 0,
+            end: blockSize,
+        };
+        loadError.set(null);
+        isLoading.set(true);
+        await dataRequestHandler([initialDataRequest], false, () => { }, (e) => {
+            loadError.set(e);
+        });
+        isLoading.set(false);
     };
-    if (pivotMode) updatePivotColumns(pivotModel);
-    // Make these deep equality checks
-    cleanup.push(
-      g.state.columnPivotMode.watch(() => {
-        const model = g.state.columnPivotModel.get();
-        updatePivotColumns(model, true);
-        rdsStore.set(model$, (prev) => ({ ...prev, pivotMode: g.state.columnPivotMode.get() }));
-        g.state.rowDataStore.rowClearCache();
-      }),
-    );
-    cleanup.push(
-      g.state.columnPivotModel.watch(() => {
-        const model = g.state.columnPivotModel.get();
-        updatePivotColumns(model);
-        rdsStore.set(model$, (prev) => ({
-          ...prev,
-          pivotModel: model,
-        }));
-        g.state.rowDataStore.rowClearCache();
-      }),
-    );
-    g.state.columnPivotRowGroupExpansions.watch(() => {
-      rdsStore.set(model$, (prev) => ({
-        ...prev,
-        columnPivotGroupExpansions: g.state.columnPivotRowGroupExpansions.get(),
-      }));
-      grid?.state.rowDataStore.rowClearCache();
+    const flat$ = atom((g) => {
+        g(snapshot$);
+        const mode = rdsStore.get(pivotMode);
+        const expansions = mode ? g(pivotGroupExpansions) : g(rowGroupExpansions);
+        const t = g(tree$);
+        const rowIdToRow = new Map();
+        const rowIndexToRow = new Map();
+        const rowIdToRowIndex = new Map();
+        const ranges = [];
+        function processParent(node, start) {
+            const rows = [...node.byIndex.values()].sort((l, r) => l.relIndex - r.relIndex);
+            // Track the additional rows added by expanded groups
+            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);
+                rowIdToRowIndex.set(row.data.id, rowIndex);
+                rowIdToRow.set(row.data.id, row);
+                if (row.kind === "parent" && expansions[row.data.id]) {
+                    offset += processParent(row, rowIndex + 1);
+                }
+            }
+            ranges.push({ rowStart: start, rowEnd: offset + node.size + start, parent: node });
+            return offset + node.size;
+        }
+        const size = processParent(t, 0);
+        const rangeTree = new RangeTree(ranges);
+        return {
+            size,
+            rowIndexToRow,
+            rowIdToRow,
+            rowIdToRowIndex,
+            rangeTree,
+        };
     });
-    // Sort model monitoring
-    cleanup.push(
-      g.state.sortModel.watch(() => {
-        rdsStore.set(model$, (prev) => ({ ...prev, sorts: g.state.sortModel.get() }));
-        resetRequest();
-      }),
-    );
-    // Filter model monitoring
-    cleanup.push(
-      g.state.filterModel.watch(() => {
-        rdsStore.set(model$, (prev) => ({ ...prev, filters: g.state.filterModel.get() }));
-        resetRequest();
-      }),
-    );
-    cleanup.push(
-      g.state.quickSearch.watch(() => {
-        rdsStore.set(model$, (prev) => ({ ...prev, quickSearch: g.state.quickSearch.get() }));
-        resetRequest();
-      }),
-    );
-    cleanup.push(
-      g.state.filterInModel.watch(() => {
-        rdsStore.set(model$, (prev) => ({ ...prev, filtersIn: g.state.filterInModel.get() }));
-        resetRequest();
-      }),
-    );
-    // Row group model monitoring
-    cleanup.push(
-      g.state.rowGroupModel.watch(() => {
-        rdsStore.set(model$, (prev) => ({ ...prev, group: g.state.rowGroupModel.get() }));
+    const flat = makeGridAtom(flat$, rdsStore);
+    const cleanup = [];
+    const init = (g) => {
+        grid = g;
+        const sorts = g.state.sortModel.get();
+        const filters = g.state.filterModel.get();
+        const filtersIn = g.state.filterInModel.get();
+        const quickSearch = g.state.quickSearch.get();
+        const group = g.state.rowGroupModel.get();
+        const groupExpansions = g.state.rowGroupExpansions.get();
+        const aggregations = g.state.aggModel.get();
+        const pivotMode = g.state.columnPivotMode.get();
+        const pivotModel = g.state.columnPivotModel.get();
+        const pivotGroupExpansions = g.state.columnPivotRowGroupExpansions.get();
+        rdsStore.set(model$, {
+            sorts,
+            filters,
+            filtersIn,
+            quickSearch,
+            aggregations,
+            group,
+            groupExpansions,
+            pivotMode,
+            pivotModel,
+            pivotGroupExpansions,
+        });
+        rdsStore.set(initialized, true);
+        // Handle row count changes
+        const f = flat.get();
+        g.state.rowDataStore.rowCenterCount.set(f.size);
+        g.state.rowDataStore.rowBottomCount.set(rdsStore.get(botData).length);
+        g.state.rowDataStore.rowTopCount.set(rdsStore.get(topData).length);
+        rdsStore.sub(flat$, () => {
+            const f = flat.get();
+            g.state.rowDataStore.rowCenterCount.set(f.size);
+            viewChange();
+        });
+        rdsStore.sub(topData, () => {
+            g.state.rowDataStore.rowTopCount.set(rdsStore.get(topData).length);
+            g.state.rowDataStore.rowClearCache();
+        });
+        rdsStore.sub(botData, () => {
+            g.state.rowDataStore.rowBottomCount.set(rdsStore.get(botData).length);
+            g.state.rowDataStore.rowClearCache();
+        });
         resetRequest();
-      }),
-    );
-    // Row group expansions monitoring
-    cleanup.push(
-      g.state.rowGroupExpansions.watch(() => {
-        rdsStore.set(model$, (prev) => ({
-          ...prev,
-          groupExpansions: g.state.rowGroupExpansions.get(),
+        // Watch the view bound changes.
+        g.state.viewBounds.watch(() => {
+            viewChange();
+        });
+        let prevPivotColumnModel = pivotModel.columns;
+        let prevPivotColumnValues = pivotModel.values;
+        const updatePivotColumns = async (mdl, ignoreEqualCheck = false) => {
+            if (!ignoreEqualCheck &&
+                equal(prevPivotColumnModel, mdl.columns) &&
+                equal(prevPivotColumnValues, mdl.values))
+                return;
+            const cols = await dataColumnPivotFetcher?.({
+                grid: grid,
+                model: model.get(),
+                reqTime: Date.now(),
+            });
+            if (cols)
+                grid?.state.columnPivotColumns.set(cols);
+            resetRequest();
+            prevPivotColumnModel = mdl.columns;
+            prevPivotColumnValues = mdl.values;
+        };
+        if (pivotMode)
+            updatePivotColumns(pivotModel);
+        // Make these deep equality checks
+        cleanup.push(g.state.columnPivotMode.watch(() => {
+            const model = g.state.columnPivotModel.get();
+            updatePivotColumns(model, true);
+            rdsStore.set(model$, (prev) => ({ ...prev, pivotMode: g.state.columnPivotMode.get() }));
+            g.state.rowDataStore.rowClearCache();
+        }));
+        cleanup.push(g.state.columnPivotModel.watch(() => {
+            const model = g.state.columnPivotModel.get();
+            updatePivotColumns(model);
+            rdsStore.set(model$, (prev) => ({
+                ...prev,
+                pivotModel: model,
+            }));
+            g.state.rowDataStore.rowClearCache();
+        }));
+        g.state.columnPivotRowGroupExpansions.watch(() => {
+            rdsStore.set(model$, (prev) => ({
+                ...prev,
+                columnPivotGroupExpansions: g.state.columnPivotRowGroupExpansions.get(),
+            }));
+            grid?.state.rowDataStore.rowClearCache();
+        });
+        // Sort model monitoring
+        cleanup.push(g.state.sortModel.watch(() => {
+            rdsStore.set(model$, (prev) => ({ ...prev, sorts: g.state.sortModel.get() }));
+            resetRequest();
+        }));
+        // Filter model monitoring
+        cleanup.push(g.state.filterModel.watch(() => {
+            rdsStore.set(model$, (prev) => ({ ...prev, filters: g.state.filterModel.get() }));
+            resetRequest();
+        }));
+        cleanup.push(g.state.quickSearch.watch(() => {
+            rdsStore.set(model$, (prev) => ({ ...prev, quickSearch: g.state.quickSearch.get() }));
+            resetRequest();
+        }));
+        cleanup.push(g.state.filterInModel.watch(() => {
+            rdsStore.set(model$, (prev) => ({ ...prev, filtersIn: g.state.filterInModel.get() }));
+            resetRequest();
+        }));
+        // Row group model monitoring
+        cleanup.push(g.state.rowGroupModel.watch(() => {
+            rdsStore.set(model$, (prev) => ({ ...prev, group: g.state.rowGroupModel.get() }));
+            resetRequest();
+        }));
+        // Row group expansions monitoring
+        cleanup.push(g.state.rowGroupExpansions.watch(() => {
+            rdsStore.set(model$, (prev) => ({
+                ...prev,
+                groupExpansions: g.state.rowGroupExpansions.get(),
+            }));
+            grid?.state.rowDataStore.rowClearCache();
+        }));
+        // Agg model monitoring
+        cleanup.push(g.state.aggModel.watch(() => {
+            rdsStore.set(model$, (prev) => ({ ...prev, agg: g.state.aggModel.get() }));
+            resetRequest();
         }));
-        grid?.state.rowDataStore.rowClearCache();
-      }),
-    );
-    // Agg model monitoring
-    cleanup.push(
-      g.state.aggModel.watch(() => {
-        rdsStore.set(model$, (prev) => ({ ...prev, agg: g.state.aggModel.get() }));
-        resetRequest();
-      }),
-    );
-  };
-  const rowById = (id) => {
-    const f = flat.get();
-    const node = f.rowIdToRow.get(id);
-    if (!node) {
-      {
-        const top = rdsStore.get(topData);
-        const node = top.find((c) => c.id === id);
-        if (node) return { kind: "leaf", data: node.data, id: node.id };
-      }
-      {
-        const bot = rdsStore.get(topData);
-        const node = bot.find((c) => c.id === id);
-        if (node) return { kind: "leaf", data: node.data, id: node.id };
-      }
-      return null;
-    }
-    if (node.kind === "parent") {
-      return {
-        kind: "branch",
-        data: node.data.data,
-        id: node.data.id,
-        key: node.path,
-        depth: getNodeDepth(node),
-      };
-    }
-    return {
-      kind: "leaf",
-      data: node.data.data,
-      id: node.data.id,
     };
-  };
-  const rowAllChildIds = (rowId) => {
-    const f = flat.get();
-    const row = f.rowIdToRow.get(rowId);
-    if (!row || row.kind === "leaf") return [];
-    const ids = new Set();
-    const stack = [...row.byPath.values()];
-    while (stack.length) {
-      const item = stack.pop();
-      if (item.kind === "leaf") {
-        ids.add(item.data.id);
-      } else {
-        stack.push(...item.byPath.values());
-        ids.add(item.data.id);
-      }
-    }
-    return [...ids];
-  };
-  const rowByIndex = (ri) => {
-    const f = flat.get();
-    const top = rdsStore.get(topData);
-    const bot = rdsStore.get(botData);
-    const errors = rdsStore.get(nodesWithError);
-    const error = errors.get(ri);
-    if (ri == null || ri < 0 || ri >= f.size + top.length + bot.length) return null;
-    // Top node
-    if (ri < top.length) {
-      const row = top[ri];
-      if (!row) return null;
-      return { kind: "leaf", data: row.data, id: row.id, error };
-    }
-    if (ri >= f.size + top.length) {
-      const i = ri - f.size - top.length;
-      const row = bot[i];
-      if (!row) return null;
-      return { kind: "leaf", data: row.data, id: row.id, error };
-    }
-    const node = f.rowIndexToRow.get(ri - top.length);
-    if (!node && error)
-      return { kind: "leaf", data: null, id: `error-${ri}`, loading: false, error };
-    if (!node) return { kind: "leaf", data: null, id: `loading-${ri}`, loading: true, error: null };
-    if (node.kind === "parent") {
-      return {
-        kind: "branch",
-        data: node.data.data,
-        id: node.data.id,
-        key: node.path,
-        depth: getNodeDepth(node),
-        error,
-      };
-    }
-    return {
-      kind: "leaf",
-      data: node.data.data,
-      id: node.data.id,
-      error,
+    const rowById = (id) => {
+        const f = flat.get();
+        const node = f.rowIdToRow.get(id);
+        if (!node) {
+            {
+                const top = rdsStore.get(topData);
+                const node = top.find((c) => c.id === id);
+                if (node)
+                    return { kind: "leaf", data: node.data, id: node.id };
+            }
+            {
+                const bot = rdsStore.get(topData);
+                const node = bot.find((c) => c.id === id);
+                if (node)
+                    return { kind: "leaf", data: node.data, id: node.id };
+            }
+            return null;
+        }
+        if (node.kind === "parent") {
+            return {
+                kind: "branch",
+                data: node.data.data,
+                id: node.data.id,
+                key: node.path,
+                depth: getNodeDepth(node),
+            };
+        }
+        return {
+            kind: "leaf",
+            data: node.data.data,
+            id: node.data.id,
+        };
+    };
+    const rowAllChildIds = (rowId) => {
+        const f = flat.get();
+        const row = f.rowIdToRow.get(rowId);
+        if (!row || row.kind === "leaf")
+            return [];
+        const ids = new Set();
+        const stack = [...row.byPath.values()];
+        while (stack.length) {
+            const item = stack.pop();
+            if (item.kind === "leaf") {
+                ids.add(item.data.id);
+            }
+            else {
+                stack.push(...item.byPath.values());
+                ids.add(item.data.id);
+            }
+        }
+        return [...ids];
     };
-  };
-  const rowExpand = (p) => {
-    const f = flat.get();
-    const rowIndices = [];
-    const requests = Object.entries(p)
-      .map(([rowId, state]) => {
-        if (!state) return null;
-        const rowIndex = rowToIndex(rowId);
-        if (rowIndex == null) return null;
-        const row = f.rowIndexToRow.get(rowIndex);
-        if (!row || row.kind === "leaf") return null;
-        const path = getNodePath(row);
-        rowIndices.push(rowIndex);
+    const rowByIndex = (ri) => {
+        const f = flat.get();
+        const top = rdsStore.get(topData);
+        const bot = rdsStore.get(botData);
+        const errors = rdsStore.get(nodesWithError);
+        const error = errors.get(ri);
+        if (ri == null || ri < 0 || ri >= f.size + top.length + bot.length)
+            return null;
+        // Top node
+        if (ri < top.length) {
+            const row = top[ri];
+            if (!row)
+                return null;
+            return { kind: "leaf", data: row.data, id: row.id, error };
+        }
+        if (ri >= f.size + top.length) {
+            const i = ri - f.size - top.length;
+            const row = bot[i];
+            if (!row)
+                return null;
+            return { kind: "leaf", data: row.data, id: row.id, error };
+        }
+        const node = f.rowIndexToRow.get(ri - top.length);
+        if (!node && error)
+            return { kind: "leaf", data: null, id: `error-${ri}`, loading: false, error };
+        if (!node)
+            return { kind: "leaf", data: null, id: `loading-${ri}`, loading: true, error: null };
+        if (node.kind === "parent") {
+            return {
+                kind: "branch",
+                data: node.data.data,
+                id: node.data.id,
+                key: node.path,
+                depth: getNodeDepth(node),
+                error,
+            };
+        }
         return {
-          id: getRequestId(path, 0, Math.min(blockSize, row.size)),
-          start: 0,
-          end: Math.min(blockSize, row.size),
-          path,
-          rowStartIndex: rowIndex + 1,
-          rowEndIndex: Math.min(row.size, rowIndex + blockSize + 1),
+            kind: "leaf",
+            data: node.data.data,
+            id: node.data.id,
+            error,
         };
-      })
-      .filter((c) => !!c);
-    const mode = rdsStore.get(pivotMode);
-    // Remove the errors before requesting.
-    const errorRows = rdsStore.get(nodesWithError);
-    if (rowIndices.some((c) => errorRows.has(c))) {
-      rdsStore.set(nodesWithError, (prev) => {
-        const n = new Map(prev);
-        rowIndices.forEach((c) => n.delete(c));
-        return prev;
-      });
-    }
-    dataRequestHandler(
-      requests,
-      false,
-      () => {
-        if (mode) grid?.state.columnPivotColumnGroupExpansions.set((prev) => ({ ...prev, ...p }));
-        else grid?.state.rowGroupExpansions.set((prev) => ({ ...prev, ...p }));
-      },
-      (error) => {
-        rdsStore.set(nodesWithError, (prev) => {
-          const n = new Map(prev);
-          rowIndices.forEach((c) => n.set(c, error));
-          return prev;
+    };
+    const rowExpand = (p) => {
+        const f = flat.get();
+        const rowIndices = [];
+        const requests = Object.entries(p)
+            .map(([rowId, state]) => {
+            if (!state)
+                return null;
+            const rowIndex = rowToIndex(rowId);
+            if (rowIndex == null)
+                return null;
+            const row = f.rowIndexToRow.get(rowIndex);
+            if (!row || row.kind === "leaf")
+                return null;
+            const path = getNodePath(row);
+            rowIndices.push(rowIndex);
+            return {
+                id: getRequestId(path, 0, Math.min(blockSize, row.size)),
+                start: 0,
+                end: Math.min(blockSize, row.size),
+                path,
+                rowStartIndex: rowIndex + 1,
+                rowEndIndex: Math.min(row.size, rowIndex + blockSize + 1),
+            };
+        })
+            .filter((c) => !!c);
+        const mode = rdsStore.get(pivotMode);
+        // Remove the errors before requesting.
+        const errorRows = rdsStore.get(nodesWithError);
+        if (rowIndices.some((c) => errorRows.has(c))) {
+            rdsStore.set(nodesWithError, (prev) => {
+                const n = new Map(prev);
+                rowIndices.forEach((c) => n.delete(c));
+                return prev;
+            });
+        }
+        dataRequestHandler(requests, false, () => {
+            if (mode)
+                grid?.state.columnPivotColumnGroupExpansions.set((prev) => ({ ...prev, ...p }));
+            else
+                grid?.state.rowGroupExpansions.set((prev) => ({ ...prev, ...p }));
+        }, (error) => {
+            rdsStore.set(nodesWithError, (prev) => {
+                const n = new Map(prev);
+                rowIndices.forEach((c) => n.set(c, error));
+                return prev;
+            });
         });
-      },
-    );
-  };
-  const rowToIndex = (rowId) => {
-    const f = flat.get();
-    return f.rowIdToRowIndex.get(rowId) ?? null;
-  };
-  const rowSelect = (params) => {
-    if (!grid || params.mode === "none") return;
-    if (params.mode === "single") {
-      if (params.deselect) {
-        grid.state.rowSelectedIds.set(new Set());
-      } else {
-        grid.state.rowSelectedIds.set(new Set([params.startId]));
-      }
-      return;
-    }
-    const ids = new Set();
-    if (params.startId === params.endId) {
-      ids.add(params.startId);
-      if (params.selectChildren) {
-        rowAllChildIds(params.startId).forEach((c) => ids.add(c));
-      }
-    } else {
-      const first = rowToIndex(params.startId);
-      const last = rowToIndex(params.endId);
-      if (first == null || last == null) return;
-      const start = Math.min(first, last);
-      const end = Math.max(first, last);
-      for (let i = start; i <= end; i++) {
-        const row = rowByIndex(i);
-        if (!row) continue;
-        if (params.selectChildren) {
-          rowAllChildIds(row.id).forEach((c) => ids.add(c));
+    };
+    const rowToIndex = (rowId) => {
+        const f = flat.get();
+        return f.rowIdToRowIndex.get(rowId) ?? null;
+    };
+    const rowSelect = (params) => {
+        if (!grid || params.mode === "none")
+            return;
+        if (params.mode === "single") {
+            if (params.deselect) {
+                grid.state.rowSelectedIds.set(new Set());
+            }
+            else {
+                grid.state.rowSelectedIds.set(new Set([params.startId]));
+            }
+            return;
         }
-        if (row?.id) ids.add(row.id);
-      }
-    }
-    if (params.deselect) {
-      const current = grid.state.rowSelectedIds.get();
-      const next = current.difference(ids);
-      grid.state.rowSelectedIds.set(next);
-    } else {
-      const current = grid.state.rowSelectedIds.get();
-      const next = current.union(ids);
-      grid.state.rowSelectedIds.set(next);
-    }
-  };
-  const rowSelectAll = (params) => {
-    if (!grid) return;
-    if (params.deselect) {
-      grid.state.rowSelectedIds.set(new Set());
-      return;
-    }
-    const t = flat.get();
-    grid.state.rowSelectedIds.set(new Set(t.rowIdToRow.keys()));
-  };
-  const rowSetBotData = () => {
-    throw new Error(
-      `Server data source does not support directly setting pinned rows. Instead send a DataResponsePinned object via the pushData method`,
-    );
-  };
-  const rowSetTopData = () => {
-    throw new Error(
-      `Server data source does not support directly setting pinned rows. Instead send a DataResponsePinned object via the pushData method`,
-    );
-  };
-  // CRUD ops
-  const rowAdd = () => {
-    throw new Error(
-      `Server data source does not support adding rows directly. Instead push updates via the pushResponses or pushRequests method`,
-    );
-  };
-  const rowDelete = () => {
-    throw new Error(
-      `Server data source does not support deleting rows directly. Instead push updates via the pushResponses or pushRequests method`,
-    );
-  };
-  const rowUpdate = (updates) => {
-    const f = flat.get();
-    const top = rdsStore.get(topData);
-    const bot = rdsStore.get(botData);
-    const firstBot = f.size + top.length;
-    const idMap = new Map(
-      [...updates.entries()]
-        .map(([key, data]) => {
-          if (typeof key === "string") return [key, data];
-          const row = rowByIndex(key);
-          if (!row) return null;
-          return [row.id, data];
+        const ids = new Set();
+        if (params.startId === params.endId) {
+            ids.add(params.startId);
+            if (params.selectChildren) {
+                rowAllChildIds(params.startId).forEach((c) => ids.add(c));
+            }
+        }
+        else {
+            const first = rowToIndex(params.startId);
+            const last = rowToIndex(params.endId);
+            if (first == null || last == null)
+                return;
+            const start = Math.min(first, last);
+            const end = Math.max(first, last);
+            for (let i = start; i <= end; i++) {
+                const row = rowByIndex(i);
+                if (!row)
+                    continue;
+                if (params.selectChildren) {
+                    rowAllChildIds(row.id).forEach((c) => ids.add(c));
+                }
+                if (row?.id)
+                    ids.add(row.id);
+            }
+        }
+        if (params.deselect) {
+            const current = grid.state.rowSelectedIds.get();
+            const next = current.difference(ids);
+            grid.state.rowSelectedIds.set(next);
+        }
+        else {
+            const current = grid.state.rowSelectedIds.get();
+            const next = current.union(ids);
+            grid.state.rowSelectedIds.set(next);
+        }
+    };
+    const rowSelectAll = (params) => {
+        if (!grid)
+            return;
+        if (params.deselect) {
+            grid.state.rowSelectedIds.set(new Set());
+            return;
+        }
+        const t = flat.get();
+        grid.state.rowSelectedIds.set(new Set(t.rowIdToRow.keys()));
+    };
+    const rowSetBotData = () => {
+        throw new Error(`Server data source does not support directly setting pinned rows. Instead send a DataResponsePinned object via the pushData method`);
+    };
+    const rowSetTopData = () => {
+        throw new Error(`Server data source does not support directly setting pinned rows. Instead send a DataResponsePinned object via the pushData method`);
+    };
+    // CRUD ops
+    const rowAdd = () => {
+        throw new Error(`Server data source does not support adding rows directly. Instead push updates via the pushResponses or pushRequests method`);
+    };
+    const rowDelete = () => {
+        throw new Error(`Server data source does not support deleting rows directly. Instead push updates via the pushResponses or pushRequests method`);
+    };
+    const rowUpdate = (updates) => {
+        const f = flat.get();
+        const top = rdsStore.get(topData);
+        const bot = rdsStore.get(botData);
+        const firstBot = f.size + top.length;
+        const idMap = new Map([...updates.entries()]
+            .map(([key, data]) => {
+            if (typeof key === "string")
+                return [key, data];
+            const row = rowByIndex(key);
+            if (!row)
+                return null;
+            return [row.id, data];
         })
-        .filter((n) => n != null),
-    );
-    cellUpdateHandler?.(idMap);
-    if (!cellUpdateOptimistically) return;
-    for (const [key, data] of updates.entries()) {
-      const rowIndex = typeof key === "number" ? key : rowToIndex(key);
-      const row = rowByIndex(rowIndex);
-      if (!row || !grid) {
-        console.error(`Failed to find the row at index ${rowIndex} which is being updated.`);
-        continue;
-      }
-      if (rowIndex < top.length) {
-        top[rowIndex].data = data;
-      } else if (rowIndex >= firstBot) {
-        bot[rowIndex].data = data;
-      } else {
-        const node = f.rowIndexToRow.get(rowIndex - top.length);
-        if (node) node.data.data = data;
-      }
-      grid.state.rowDataStore.rowInvalidateIndex(rowIndex);
-    }
-  };
-  const inFilterItems = (c) => {
-    if (!dataInFilterItemFetcher || !grid) return [];
-    return dataInFilterItemFetcher({ column: c, grid, reqTime: Date.now() });
-  };
-  const rowAreAllSelected = () => {
-    return false;
-  };
-  return {
-    init,
-    rowAdd,
-    rowById,
-    rowAllChildIds,
-    rowByIndex,
-    rowDelete,
-    rowExpand,
-    rowSelect,
-    rowSelectAll,
-    rowSetBotData,
-    rowSetCenterData: () => {
-      throw new Error("Server side data source does not support full row updates");
-    },
-    rowSetTopData,
-    rowToIndex,
-    rowUpdate,
-    inFilterItems,
-    rowAreAllSelected,
-    isLoading,
-    loadError,
-    pushResponses: (res) => {
-      dataResponseHandler(res);
-    },
-    pushRequests: (req, onSuccess, onFailure) => {
-      dataRequestHandler(req, true, onSuccess, onFailure);
-    },
-    reset: resetRequest,
-    retry: () => {
-      viewChange();
-    },
-  };
+            .filter((n) => n != null));
+        cellUpdateHandler?.(idMap);
+        if (!cellUpdateOptimistically)
+            return;
+        for (const [key, data] of updates.entries()) {
+            const rowIndex = typeof key === "number" ? key : rowToIndex(key);
+            const row = rowByIndex(rowIndex);
+            if (!row || !grid) {
+                console.error(`Failed to find the row at index ${rowIndex} which is being updated.`);
+                continue;
+            }
+            if (rowIndex < top.length) {
+                top[rowIndex].data = data;
+            }
+            else if (rowIndex >= firstBot) {
+                bot[rowIndex].data = data;
+            }
+            else {
+                const node = f.rowIndexToRow.get(rowIndex - top.length);
+                if (node)
+                    node.data.data = data;
+            }
+            grid.state.rowDataStore.rowInvalidateIndex(rowIndex);
+        }
+    };
+    const inFilterItems = (c) => {
+        if (!dataInFilterItemFetcher || !grid)
+            return [];
+        return dataInFilterItemFetcher({ column: c, grid, reqTime: Date.now() });
+    };
+    const rowAreAllSelected = () => {
+        return false;
+    };
+    return {
+        init,
+        rowAdd,
+        rowById,
+        rowAllChildIds,
+        rowByIndex,
+        rowDelete,
+        rowExpand,
+        rowSelect,
+        rowSelectAll,
+        rowSetBotData,
+        rowSetCenterData: () => {
+            throw new Error("Server side data source does not support full row updates");
+        },
+        rowSetTopData,
+        rowToIndex,
+        rowUpdate,
+        inFilterItems,
+        rowAreAllSelected,
+        isLoading,
+        loadError,
+        pushResponses: (res) => {
+            dataResponseHandler(res);
+        },
+        pushRequests: (req, onSuccess, onFailure) => {
+            dataRequestHandler(req, true, onSuccess, onFailure);
+        },
+        reset: resetRequest,
+        retry: () => {
+            viewChange();
+        },
+    };
 }
 export function useServerDataSource(p) {
-  const ds = useRef(null);
-  if (!ds.current) {
-    ds.current = makeServerDataSource(p);
-  }
-  return ds.current;
+    const ds = useRef(null);
+    if (!ds.current) {
+        ds.current = makeServerDataSource(p);
+    }
+    return ds.current;
 }