@multiplatform.one/frappe-ui 7.28.0 → 7.29.0

package/dist/esm/FrappeReportBuilder.native.js

@@ -1,229 +1,423 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useDocTypeMeta, useFrappeDoctypeEvents } from "@multiplatform.one/frappe";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { BarChart, EmptyState, ScrollView, Spinner, YStack, isWeb, notify } from "@multiplatform.one/components";
+import { Order, frappeFieldTypes, useDocTypeMeta } from "@multiplatform.one/frappe";
+import { Button } from "@multiplatform.one/forms";
 import { downloadBlob } from "@multiplatform.one/platform";
-import { ReportBuilder, PopoverContent, Separator } from "@multiplatform.one/components";
-import { Button, Input, Spinner, formCommonColors } from "@multiplatform.one/forms";
 import { storage } from "@multiplatform.one/store";
-import React, { useMemo, useState, useCallback, useEffect, useRef } from "react";
-import { useTranslation } from "react-i18next";
-import { Popover, Text, XStack, YStack } from "tamagui";
-import { FloppyDiskIcon, FolderOpenIcon, TrashIcon } from "@phosphor-icons/react";
+import { DataTablePagination } from "@multiplatform.one/table";
 import { useResolvedKnobs } from "@multiplatform.one/theme";
+import React, { useCallback, useEffect, useMemo, useState } from "react";
+import { useTranslation } from "react-i18next";
+import { FrappeNotConfigured } from "./FrappeNotConfigured.native.js";
 import { useFrappeConfig } from "./FrappeProvider.native.js";
+import { isPermissionError, refusalReason } from "./liveErrors.native.js";
+import { recordKeyLabel, useRecordShape } from "./recordShape.native.js";
+import { ReportGrid } from "./report/ReportGrid.native.js";
+import { ReportViewToolbar } from "./report/ReportViewToolbar.native.js";
+import { DEFAULT_REPORT_PAGE_SIZE, REPORT_PAGE_SIZES, buildGridRows, buildReportCsv, columnFilterTuples, computeTotals, defaultReportFieldnames, orderReportRows, reportColumnsFromMeta, resolveSelectedColumns } from "./report/reportViewModel.native.js";
+import { useSavedReports } from "./report/savedReports.native.js";
 import { useFrappeRows } from "./useFrappeRows.native.js";
-function getSavedReportsKey(doctype) {
-  return `frappe-report-${doctype}`;
+function _instanceof(left, right) {
+  "@swc/helpers - instanceof";
+
+  if (right != null && typeof Symbol !== "undefined" && right[Symbol.hasInstance]) {
+    return !!right[Symbol.hasInstance](left);
+  } else {
+    return left instanceof right;
+  }
+}
+function _type_of(obj) {
+  "@swc/helpers - typeof";
+
+  return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj;
+}
+var EMPTY_FILTERS = [];
+var COLUMN_FILTER_DEBOUNCE_MS = 350;
+function columnsStorageKey(doctype) {
+  return `backoffice.report.columns.${doctype}`;
 }
-async function loadSavedReports(doctype) {
+async function readStoredColumns(doctype) {
   try {
-    var raw = await Promise.resolve(storage.getItem(getSavedReportsKey(doctype)));
-    if (raw) return JSON.parse(raw);
+    var raw = await Promise.resolve(storage.getItem(columnsStorageKey(doctype)));
+    if (!raw) return void 0;
+    var parsed = JSON.parse(raw);
+    if (Array.isArray(parsed) && parsed.every(function (entry) {
+      return typeof entry === "string";
+    })) {
+      return parsed;
+    }
   } catch (unused) {}
-  return [];
+  return void 0;
 }
-async function persistSavedReports(doctype, reports) {
+function persistStoredColumns(doctype, fieldnames) {
   try {
-    await Promise.resolve(storage.setItem(getSavedReportsKey(doctype), JSON.stringify(reports)));
+    void Promise.resolve(storage.setItem(columnsStorageKey(doctype), JSON.stringify(fieldnames)));
   } catch (unused) {}
 }
+function toReportFilters(filters) {
+  if (!filters) return void 0;
+  if (Array.isArray(filters)) return filters.length > 0 ? filters : void 0;
+  var tuples = Object.entries(filters).map(function (param) {
+    var [field, value] = param;
+    return [field, "=", value];
+  });
+  return tuples.length > 0 ? tuples : void 0;
+}
+function initialFieldnames(columns) {
+  if (!columns) return null;
+  var fieldnames = columns.flatMap(function (column) {
+    return typeof column === "string" ? [column] : column.enabled ? [column.fieldname] : [];
+  });
+  return fieldnames.length > 0 ? fieldnames : null;
+}
+function asFieldType(fieldtype) {
+  var _frappeFieldTypes_find;
+  return (_frappeFieldTypes_find = frappeFieldTypes.find(function (known) {
+    return known === fieldtype;
+  })) !== null && _frappeFieldTypes_find !== void 0 ? _frappeFieldTypes_find : "Data";
+}
+function refusedMetaFields(initialColumns, recordFields) {
+  var declared = (initialColumns !== null && initialColumns !== void 0 ? initialColumns : []).map(function (column) {
+    return typeof column === "string" ? {
+      fieldname: column,
+      label: recordKeyLabel(column),
+      fieldtype: "Data"
+    } : {
+      fieldname: column.fieldname,
+      label: column.label,
+      fieldtype: asFieldType(column.fieldtype)
+    };
+  });
+  return (declared.length > 0 ? declared : recordFields !== null && recordFields !== void 0 ? recordFields : []).filter(function (field) {
+    return field.fieldname !== "name";
+  }).map(function (field) {
+    return {
+      ...field,
+      read_only: 1,
+      in_list_view: 1
+    };
+  });
+}
+function asError(error) {
+  return _instanceof(error, Error) ? error : new Error(String(error));
+}
+function groupField(groupBy) {
+  if (!groupBy) return null;
+  return typeof groupBy === "string" ? groupBy : groupBy.field;
+}
+function aggregateGroups(rows, field, config) {
+  var groups = /* @__PURE__ */new Map();
+  var _iteratorNormalCompletion = true,
+    _didIteratorError = false,
+    _iteratorError = void 0;
+  try {
+    for (var _iterator = rows[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
+      var row = _step.value;
+      var key = row[field] === null || row[field] === void 0 ? "" : String(row[field]);
+      var bucket = groups.get(key);
+      if (bucket) bucket.push(row);else groups.set(key, [row]);
+    }
+  } catch (err) {
+    _didIteratorError = true;
+    _iteratorError = err;
+  } finally {
+    try {
+      if (!_iteratorNormalCompletion && _iterator.return != null) {
+        _iterator.return();
+      }
+    } finally {
+      if (_didIteratorError) {
+        throw _iteratorError;
+      }
+    }
+  }
+  var numbers = function numbers2(group) {
+    return group.map(function (row2) {
+      return Number((config === null || config === void 0 ? void 0 : config.aggregationField) ? row2[config.aggregationField] : 0) || 0;
+    });
+  };
+  return [...groups.entries()].map(function (param) {
+    var [label, group] = param;
+    switch ((config === null || config === void 0 ? void 0 : config.aggregationField) ? config.aggregation : "count") {
+      case "sum":
+        return {
+          label,
+          value: numbers(group).reduce(function (sum, value) {
+            return sum + value;
+          }, 0)
+        };
+      case "avg":
+        return {
+          label,
+          value: numbers(group).reduce(function (sum, value) {
+            return sum + value;
+          }, 0) / group.length
+        };
+      case "min":
+        return {
+          label,
+          value: Math.min(...numbers(group))
+        };
+      case "max":
+        return {
+          label,
+          value: Math.max(...numbers(group))
+        };
+      default:
+        return {
+          label,
+          value: group.length
+        };
+    }
+  });
+}
 function canDownloadCsv() {
   return typeof document !== "undefined" && typeof document.createElement === "function" && typeof Blob !== "undefined" && typeof URL !== "undefined" && typeof URL.createObjectURL === "function";
 }
-function FrappeReportBuilder(param) {
+function FrappeReportBuilder(props) {
+  var _props_baseURL;
+  var config = useFrappeConfig();
+  if (!((_props_baseURL = props.baseURL) !== null && _props_baseURL !== void 0 ? _props_baseURL : config === null || config === void 0 ? void 0 : config.baseURL) && !(config === null || config === void 0 ? void 0 : config.fixtures)) {
+    return /* @__PURE__ */_jsx(FrappeNotConfigured, {
+      doctype: props.doctype
+    });
+  }
+  return /* @__PURE__ */_jsx(FrappeReportBuilderBody, {
+    ...props
+  });
+}
+function FrappeReportBuilderBody(param) {
   var {
     doctype,
+    filters,
+    scopeFilters,
+    onClearFilters,
     initialColumns,
     initialGroupBy,
-    filters,
     showChart = false,
-    onExport,
+    onOpenRow,
     onRowPress,
+    onOpenLink,
+    report: reportProp,
+    onReportChange,
+    onExport,
+    loading: loadingFallback,
+    error: errorFallback,
     baseURL,
     auth,
     syncOptions,
     ...stackProps
   } = param;
-  var config = useFrappeConfig();
-  var {
-    knobProps
-  } = useResolvedKnobs();
+  var _ref, _ref1, _ref2;
   var {
     t
   } = useTranslation();
+  var {
+    knobProps
+  } = useResolvedKnobs();
+  var config = useFrappeConfig();
   var finalBaseURL = baseURL !== null && baseURL !== void 0 ? baseURL : config === null || config === void 0 ? void 0 : config.baseURL;
   var finalAuth = auth !== null && auth !== void 0 ? auth : config === null || config === void 0 ? void 0 : config.auth;
   var finalSyncOptions = syncOptions !== null && syncOptions !== void 0 ? syncOptions : config === null || config === void 0 ? void 0 : config.syncOptions;
-  if (!finalBaseURL && !(config === null || config === void 0 ? void 0 : config.fixtures)) {
-    throw new Error("FrappeReportBuilder requires baseURL prop or FrappeProvider with baseURL or fixtures");
-  }
-  var connectionConfig = {
-    baseURL: finalBaseURL,
-    socketPort: config === null || config === void 0 ? void 0 : config.socketPort,
-    siteName: config === null || config === void 0 ? void 0 : config.siteName,
-    socketBaseURL: config === null || config === void 0 ? void 0 : config.socketBaseURL,
-    auth: finalAuth,
-    syncOptions: finalSyncOptions,
-    realtime: config === null || config === void 0 ? void 0 : config.realtime,
-    fixtures: config === null || config === void 0 ? void 0 : config.fixtures
-  };
+  var fixtureMode = Boolean(config === null || config === void 0 ? void 0 : config.fixtures);
+  var connection = useMemo(function () {
+    return {
+      baseURL: finalBaseURL,
+      socketPort: config === null || config === void 0 ? void 0 : config.socketPort,
+      siteName: config === null || config === void 0 ? void 0 : config.siteName,
+      socketBaseURL: config === null || config === void 0 ? void 0 : config.socketBaseURL,
+      auth: finalAuth,
+      syncOptions: finalSyncOptions,
+      realtime: config === null || config === void 0 ? void 0 : config.realtime,
+      fixtures: config === null || config === void 0 ? void 0 : config.fixtures
+    };
+  }, [finalBaseURL, config === null || config === void 0 ? void 0 : config.socketPort, config === null || config === void 0 ? void 0 : config.siteName, config === null || config === void 0 ? void 0 : config.socketBaseURL, finalAuth, finalSyncOptions, config === null || config === void 0 ? void 0 : config.realtime, config === null || config === void 0 ? void 0 : config.fixtures]);
   var {
     meta,
-    isLoading: isMetaLoading,
+    isLoading: metaLoading,
     error: metaError
-  } = useDocTypeMeta(connectionConfig, doctype);
+  } = useDocTypeMeta(connection, doctype);
+  var metaRefused = !meta && metaError !== void 0 && isPermissionError(metaError);
+  var initialColumnsJson = JSON.stringify(initialColumns !== null && initialColumns !== void 0 ? initialColumns : []);
+  var declaresColumns = initialColumnsJson !== "[]";
+  var recordShape = useRecordShape(connection, doctype, metaRefused && !declaresColumns);
+  var layoutMeta = useMemo(function () {
+    if (meta) return meta;
+    if (!metaRefused) return void 0;
+    var fields = refusedMetaFields(JSON.parse(initialColumnsJson), recordShape.fields);
+    return fields.length > 0 ? {
+      fields
+    } : void 0;
+  }, [meta, metaRefused, initialColumnsJson, recordShape.fields]);
+  var readsWithoutMeta = !meta && layoutMeta !== void 0;
+  var savedReports = useSavedReports(doctype, useMemo(function () {
+    var _connection_baseURL;
+    return {
+      baseURL: metaRefused ? "" : (_connection_baseURL = connection.baseURL) !== null && _connection_baseURL !== void 0 ? _connection_baseURL : "",
+      auth: connection.auth,
+      fixtures: connection.fixtures
+    };
+  }, [metaRefused, connection.baseURL, connection.auth, connection.fixtures]));
+  var [internalReport, setInternalReport] = useState(null);
+  var currentReport = reportProp !== void 0 ? reportProp : internalReport;
   var allColumns = useMemo(function () {
-    if (initialColumns) return initialColumns;
-    if (!meta) return [];
-    return meta.fields.filter(function (f) {
-      return f.fieldtype !== "Section Break" && f.fieldtype !== "Column Break" && f.fieldtype !== "Tab Break";
-    }).map(function (f) {
-      return {
-        fieldname: f.fieldname,
-        label: f.label || f.fieldname,
-        fieldtype: f.fieldtype,
-        enabled: !!f.in_list_view
-      };
+    var columns = reportColumnsFromMeta(layoutMeta);
+    if (!readsWithoutMeta || !layoutMeta) return columns;
+    var own = new Set(layoutMeta.fields.map(function (field) {
+      return field.fieldname;
+    }));
+    return columns.filter(function (column) {
+      return column.fieldname === "name" || own.has(column.fieldname);
     });
-  }, [initialColumns, meta]);
-  var fetchFields = useMemo(function () {
-    var fieldNames = allColumns.map(function (c) {
-      return c.fieldname;
+  }, [layoutMeta, readsWithoutMeta]);
+  var defaultFieldnames = useMemo(function () {
+    return readsWithoutMeta && layoutMeta ? ["name", ...layoutMeta.fields.map(function (field) {
+      return field.fieldname;
+    })] : defaultReportFieldnames(layoutMeta);
+  }, [layoutMeta, readsWithoutMeta]);
+  var initialColumnsKey = JSON.stringify(initialFieldnames(initialColumns));
+  var startFieldnames = useMemo(function () {
+    return JSON.parse(initialColumnsKey);
+  }, [initialColumnsKey]);
+  var [storedColumns, setStoredColumns] = useState(void 0);
+  var [selectedOverride, setSelectedOverride] = useState(null);
+  useEffect(function () {
+    if (fixtureMode) return;
+    var cancelled = false;
+    void readStoredColumns(doctype).then(function (stored) {
+      if (!cancelled) setStoredColumns(stored);
     });
-    if (!fieldNames.includes("name")) {
-      fieldNames.unshift("name");
-    }
-    return fieldNames;
-  }, [allColumns]);
-  var {
-    rows,
-    isQueryLoading: isLoading,
-    isError
-  } = useFrappeRows(connectionConfig, doctype, {
-    fields: fetchFields,
-    filters,
-    limit: null
-  });
-  var data = rows;
-  var [isLiveStale, setIsLiveStale] = useState(false);
-  var staleTimerRef = useRef(void 0);
-  var clearStaleTimer = useCallback(function () {
-    if (staleTimerRef.current) {
-      clearTimeout(staleTimerRef.current);
-      staleTimerRef.current = void 0;
-    }
-  }, []);
-  useFrappeDoctypeEvents(connectionConfig, doctype, function (event) {
-    if (event.type !== "doc_update" && event.type !== "list_update" && event.type !== "doc_deleted" && event.type !== "doc_changed") {
-      return;
-    }
-    setIsLiveStale(true);
-    clearStaleTimer();
-    staleTimerRef.current = setTimeout(function () {
-      return setIsLiveStale(false);
-    }, 2500);
-  });
-  var isFirstData = useRef(true);
+    return function () {
+      cancelled = true;
+    };
+  }, [doctype, fixtureMode]);
+  var selectedFieldnames = (_ref = (_ref1 = selectedOverride !== null && selectedOverride !== void 0 ? selectedOverride : startFieldnames) !== null && _ref1 !== void 0 ? _ref1 : storedColumns) !== null && _ref !== void 0 ? _ref : defaultFieldnames;
+  var selectedColumns = useMemo(function () {
+    return resolveSelectedColumns(allColumns, selectedFieldnames);
+  }, [allColumns, selectedFieldnames]);
+  var filtersKey = JSON.stringify(filters !== null && filters !== void 0 ? filters : null);
+  var propFilters = useMemo(function () {
+    return toReportFilters(JSON.parse(filtersKey));
+  }, [filtersKey]);
+  var [filtersCleared, setFiltersCleared] = useState(false);
+  var [reportFilters, setReportFilters] = useState(null);
+  var baseFilters = filtersCleared ? EMPTY_FILTERS : (_ref2 = reportFilters !== null && reportFilters !== void 0 ? reportFilters : propFilters) !== null && _ref2 !== void 0 ? _ref2 : EMPTY_FILTERS;
+  var [filterDrafts, setFilterDrafts] = useState({});
+  var [committedFilters, setCommittedFilters] = useState({});
   useEffect(function () {
-    if (isFirstData.current) {
-      isFirstData.current = false;
-      return;
-    }
-    setIsLiveStale(false);
-    clearStaleTimer();
-  }, [data, clearStaleTimer]);
+    var handle = setTimeout(function () {
+      setCommittedFilters(function (previous) {
+        return JSON.stringify(previous) === JSON.stringify(filterDrafts) ? previous : filterDrafts;
+      });
+    }, COLUMN_FILTER_DEBOUNCE_MS);
+    return function () {
+      return clearTimeout(handle);
+    };
+  }, [filterDrafts]);
+  var columnTuples = useMemo(function () {
+    return columnFilterTuples(selectedColumns, committedFilters);
+  }, [selectedColumns, committedFilters]);
+  var scopeKey = JSON.stringify(scopeFilters !== null && scopeFilters !== void 0 ? scopeFilters : []);
+  var scope = useMemo(function () {
+    return JSON.parse(scopeKey);
+  }, [scopeKey]);
+  var effectiveFilters = useMemo(function () {
+    return [...scope, ...baseFilters, ...columnTuples];
+  }, [scope, baseFilters, columnTuples]);
+  var metaSort = useMemo(function () {
+    return {
+      field: ((meta === null || meta === void 0 ? void 0 : meta.sort_field) || "modified").split(" ")[0],
+      order: ((meta === null || meta === void 0 ? void 0 : meta.sort_order) || "DESC").toLowerCase() === "asc" ? "asc" : "desc"
+    };
+  }, [meta === null || meta === void 0 ? void 0 : meta.sort_field, meta === null || meta === void 0 ? void 0 : meta.sort_order]);
+  var [sortOverride, setSortOverride] = useState(null);
+  var sort = sortOverride !== null && sortOverride !== void 0 ? sortOverride : metaSort;
+  var startGroupBy = groupField(initialGroupBy);
+  var chartConfig = (typeof initialGroupBy === "undefined" ? "undefined" : _type_of(initialGroupBy)) === "object" ? initialGroupBy : void 0;
+  var [groupBy, setGroupBy] = useState(startGroupBy);
+  var [pageSize, setPageSize] = useState(DEFAULT_REPORT_PAGE_SIZE);
+  var [page, setPage] = useState(0);
   useEffect(function () {
-    return clearStaleTimer;
-  }, [clearStaleTimer]);
-  var [groupBy, setGroupBy] = useState(initialGroupBy !== null && initialGroupBy !== void 0 ? initialGroupBy : null);
-  var [enabledColumns, setEnabledColumns] = useState([]);
+    setSelectedOverride(null);
+    setStoredColumns(void 0);
+    setSortOverride(null);
+    setGroupBy(startGroupBy);
+    setPage(0);
+    setPageSize(DEFAULT_REPORT_PAGE_SIZE);
+    setFilterDrafts({});
+    setCommittedFilters({});
+    setFiltersCleared(false);
+    setReportFilters(null);
+  },
+  // startGroupBy is the mount-time seed; only a doctype swap re-seeds.
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  [doctype]);
   useEffect(function () {
-    if (allColumns.length > 0 && enabledColumns.length === 0) {
-      var initial = allColumns.filter(function (c) {
-        return c.enabled;
-      }).map(function (c) {
-        return c.fieldname;
-      });
-      if (initial.length === 0) {
-        setEnabledColumns(allColumns.slice(0, 5).map(function (c) {
-          return c.fieldname;
-        }));
-      } else {
-        setEnabledColumns(initial);
-      }
-    }
-  }, [allColumns, enabledColumns.length]);
-  var [savedReports, setSavedReports] = useState([]);
-  var [saveDialogOpen, setSaveDialogOpen] = useState(false);
-  var [saveReportName, setSaveReportName] = useState("");
+    return setFiltersCleared(false);
+  }, [filtersKey]);
+  var effectiveFiltersKey = useMemo(function () {
+    return JSON.stringify(effectiveFilters);
+  }, [effectiveFilters]);
   useEffect(function () {
+    setPage(0);
+  }, [effectiveFiltersKey, pageSize, groupBy]);
+  useEffect(function () {
+    if (!currentReport) {
+      setReportFilters(null);
+      return;
+    }
     var cancelled = false;
-    void async function () {
-      var reports = await loadSavedReports(doctype);
-      if (!cancelled) {
-        setSavedReports(reports);
+    void savedReports.load(currentReport).then(function (saved) {
+      var _saved_groupBy;
+      if (cancelled || !saved) return;
+      setSelectedOverride(saved.fieldnames.length > 0 ? saved.fieldnames : null);
+      setReportFilters(saved.filters);
+      setFilterDrafts({});
+      setCommittedFilters({});
+      setFiltersCleared(false);
+      if (saved.sort) setSortOverride(saved.sort);
+      if (saved.pageSize && REPORT_PAGE_SIZES.some(function (size) {
+        return size === saved.pageSize;
+      })) {
+        setPageSize(saved.pageSize);
       }
-    }();
+      setGroupBy((_saved_groupBy = saved.groupBy) !== null && _saved_groupBy !== void 0 ? _saved_groupBy : null);
+    });
     return function () {
       cancelled = true;
     };
-  }, [doctype]);
-  var handleSaveReport = useCallback(function () {
-    if (!saveReportName.trim()) return;
-    var report = {
-      name: saveReportName.trim(),
-      columns: enabledColumns,
-      groupBy,
-      filters
-    };
-    var updated = [...savedReports.filter(function (r) {
-      return r.name !== report.name;
-    }), report];
-    setSavedReports(updated);
-    void persistSavedReports(doctype, updated);
-    setSaveDialogOpen(false);
-    setSaveReportName("");
-  }, [saveReportName, enabledColumns, groupBy, filters, savedReports, doctype]);
-  var handleLoadReport = useCallback(function (report) {
-    setEnabledColumns(report.columns);
-    setGroupBy(report.groupBy);
-  }, []);
-  var handleDeleteReport = useCallback(function (name) {
-    var updated = savedReports.filter(function (r) {
-      return r.name !== name;
-    });
-    setSavedReports(updated);
-    void persistSavedReports(doctype, updated);
-  }, [savedReports, doctype]);
-  var handleExport = useCallback(function (exportData) {
-    if (onExport) {
-      onExport(exportData);
-      return;
-    }
-    var cols = allColumns.filter(function (c) {
-      return enabledColumns.includes(c.fieldname);
-    });
-    var headers = cols.map(function (c) {
-      return c.label;
+  },
+  // savedReports.load changes identity with its report list; reloading the
+  // config on list refreshes would clobber in-progress edits — key on the
+  // selected report (and doctype via load's closure) only.
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  [currentReport, doctype]);
+  var handleToggleColumn = useCallback(function (fieldname) {
+    setSelectedOverride(function (previous) {
+      var _ref3, _ref12;
+      var current = (_ref3 = (_ref12 = previous !== null && previous !== void 0 ? previous : startFieldnames) !== null && _ref12 !== void 0 ? _ref12 : storedColumns) !== null && _ref3 !== void 0 ? _ref3 : defaultFieldnames;
+      var next = current.includes(fieldname) ? current.length === 1 ? current : current.filter(function (entry) {
+        return entry !== fieldname;
+      }) : [...current, fieldname];
+      if (!fixtureMode && !currentReport) persistStoredColumns(doctype, next);
+      return next;
     });
-    var csvRows = [headers.join(",")];
+  }, [startFieldnames, storedColumns, defaultFieldnames, fixtureMode, currentReport, doctype]);
+  var handleResetColumns = useCallback(function () {
+    setSelectedOverride(defaultFieldnames);
+    setStoredColumns(void 0);
+    if (!fixtureMode) persistStoredColumns(doctype, defaultFieldnames);
+  }, [defaultFieldnames, fixtureMode, doctype]);
+  var fetchFields = useMemo(function () {
+    var fields = /* @__PURE__ */new Set(["name", sort.field]);
     var _iteratorNormalCompletion = true,
       _didIteratorError = false,
       _iteratorError = void 0;
     try {
-      var _loop = function () {
-        var row = _step.value;
-        var values = cols.map(function (col) {
-          var val = row[col.fieldname];
-          if (val === null || val === void 0) return "";
-          var str = String(val);
-          if (str.includes(",") || str.includes('"') || str.includes("\n")) {
-            return `"${str.replace(/"/g, '""')}"`;
-          }
-          return str;
-        });
-        csvRows.push(values.join(","));
-      };
-      for (var _iterator = exportData[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) _loop();
+      for (var _iterator = selectedColumns[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
+        var column = _step.value;
+        fields.add(column.fieldname);
+      }
     } catch (err) {
       _didIteratorError = true;
       _iteratorError = err;
@@ -238,211 +432,322 @@ function FrappeReportBuilder(param) {
         }
       }
     }
-    var csvContent = csvRows.join("\n");
-    var blob = new Blob([csvContent], {
-      type: "text/csv;charset=utf-8;"
+    if (groupBy) fields.add(groupBy);
+    if (chartConfig === null || chartConfig === void 0 ? void 0 : chartConfig.aggregationField) fields.add(chartConfig.aggregationField);
+    return [...fields];
+  }, [selectedColumns, sort.field, groupBy, chartConfig === null || chartConfig === void 0 ? void 0 : chartConfig.aggregationField]);
+  var orderBy = useMemo(function () {
+    return [{
+      field: sort.field,
+      order: sort.order === "asc" ? Order.Asc : Order.Desc
+    }];
+  }, [sort.field, sort.order]);
+  var {
+    rows: rowsData,
+    syncError,
+    isLoading: rowsLoading
+  } = useFrappeRows(connection, doctype, {
+    fields: fetchFields,
+    filters: effectiveFilters,
+    orderBy,
+    limit: null,
+    enabled: layoutMeta !== void 0,
+    mapError: asError
+  });
+  var orderedRows = useMemo(function () {
+    return orderReportRows(rowsData, sort, groupBy);
+  }, [rowsData, sort, groupBy]);
+  var total = orderedRows.length;
+  var pageCount = Math.max(1, Math.ceil(total / pageSize));
+  var effectivePage = Math.min(page, pageCount - 1);
+  var gridRows = useMemo(function () {
+    return buildGridRows(orderedRows, effectivePage * pageSize, pageSize, groupBy);
+  }, [orderedRows, effectivePage, pageSize, groupBy]);
+  var totals = useMemo(function () {
+    return computeTotals(selectedColumns, orderedRows);
+  }, [selectedColumns, orderedRows]);
+  var groupByColumn = groupBy ? allColumns.find(function (column) {
+    return column.fieldname === groupBy;
+  }) : void 0;
+  var chartData = useMemo(function () {
+    return showChart && groupBy ? aggregateGroups(orderedRows, groupBy, chartConfig) : [];
+  }, [showChart, groupBy, orderedRows, chartConfig]);
+  var rowsPressable = Boolean(onOpenRow || onRowPress);
+  var handleOpenRow = useCallback(function (name) {
+    onOpenRow === null || onOpenRow === void 0 ? void 0 : onOpenRow(name);
+    if (onRowPress) {
+      var index = orderedRows.findIndex(function (row) {
+        return row.name === name;
+      });
+      if (index >= 0) onRowPress(orderedRows[index], index);
+    }
+  }, [onOpenRow, onRowPress, orderedRows]);
+  var handleSelectReport = useCallback(function (name) {
+    if (reportProp === void 0) setInternalReport(name);
+    onReportChange === null || onReportChange === void 0 ? void 0 : onReportChange(name);
+    if (!name) {
+      setReportFilters(null);
+      setSelectedOverride(null);
+      setSortOverride(null);
+      setGroupBy(null);
+    }
+  }, [reportProp, onReportChange]);
+  var handleClearBaseFilters = useCallback(function () {
+    setFiltersCleared(true);
+    if (propFilters && !reportFilters) onClearFilters === null || onClearFilters === void 0 ? void 0 : onClearFilters();
+  }, [propFilters, reportFilters, onClearFilters]);
+  var handleSaveReport = useCallback(function (name) {
+    void savedReports.save(name, {
+      fieldnames: [...selectedFieldnames],
+      filters: effectiveFilters,
+      sort,
+      pageSize,
+      groupBy,
+      addTotals: totals.length > 0
+    }).then(function (savedName) {
+      notify({
+        severity: "success",
+        scope: "page",
+        body: t("report.saveDone", {
+          defaultValue: "Saved report \u201C{{name}}\u201D",
+          name: savedName
+        })
+      });
+      if (savedName !== currentReport) handleSelectReport(savedName);
+    }).catch(function (error) {
+      notify({
+        severity: "error",
+        scope: "page",
+        body: _instanceof(error, Error) ? error.message : t("report.saveFailed", "Could not save the report")
+      });
     });
-    downloadBlob(blob, `${doctype}_report.csv`);
-  }, [allColumns, enabledColumns, onExport, doctype]);
+  }, [savedReports, selectedFieldnames, effectiveFilters, sort, pageSize, groupBy, totals.length, currentReport, handleSelectReport, t]);
+  var handleDeleteReport = useCallback(function (name) {
+    void savedReports.remove(name).then(function () {
+      notify({
+        severity: "success",
+        scope: "page",
+        body: t("report.deleteDone", {
+          defaultValue: "Deleted report \u201C{{name}}\u201D",
+          name
+        })
+      });
+      if (name === currentReport) handleSelectReport(null);
+    }).catch(function (error) {
+      notify({
+        severity: "error",
+        scope: "page",
+        body: _instanceof(error, Error) ? error.message : t("report.deleteFailed", "Could not delete the report")
+      });
+    });
+  }, [savedReports, currentReport, handleSelectReport, t]);
   var exportEnabled = Boolean(onExport) || canDownloadCsv();
-  if (isMetaLoading) {
-    return /* @__PURE__ */_jsxs(YStack, {
-      ...knobProps.panelPadding,
-      alignItems: "center",
-      justifyContent: "center",
-      gap: "$2",
-      ...stackProps,
-      children: [/* @__PURE__ */_jsx(Spinner, {
-        size: "large"
-      }), /* @__PURE__ */_jsx(Text, {
-        color: "$color10",
-        children: t("Loading {{doctype}} schema...", {
-          doctype
+  var handleExport = useCallback(function () {
+    if (onExport) {
+      onExport(orderedRows);
+      return;
+    }
+    downloadBlob(new Blob([buildReportCsv(selectedColumns, orderedRows)], {
+      type: "text/csv;charset=utf-8;"
+    }), `${doctype}_report.csv`);
+    notify({
+      severity: "success",
+      scope: "page",
+      body: t("report.exportDone", {
+        count: orderedRows.length,
+        defaultValue_one: "Exported {{count}} row to CSV",
+        defaultValue_other: "Exported {{count}} rows to CSV"
+      })
+    });
+  }, [onExport, selectedColumns, orderedRows, doctype, t]);
+  var handleColumnFilterChange = useCallback(function (fieldname, value) {
+    setFilterDrafts(function (previous) {
+      if (value === "") {
+        if (!(fieldname in previous)) return previous;
+        var {
+          [fieldname]: _dropped,
+          ...rest
+        } = previous;
+        return rest;
+      }
+      return {
+        ...previous,
+        [fieldname]: value
+      };
+    });
+  }, []);
+  var handleClearColumnFilters = useCallback(function () {
+    setFilterDrafts({});
+    setCommittedFilters({});
+  }, []);
+  if (metaLoading && !meta) {
+    return /* @__PURE__ */_jsx(_Fragment, {
+      children: loadingFallback !== null && loadingFallback !== void 0 ? loadingFallback : /* @__PURE__ */_jsx(YStack, {
+        flex: 1,
+        alignItems: "center",
+        justifyContent: "center",
+        ...stackProps,
+        children: /* @__PURE__ */_jsx(Spinner, {
+          size: "large"
         })
-      })]
+      })
     });
   }
-  if (metaError && !meta) {
-    return /* @__PURE__ */_jsxs(YStack, {
-      ...knobProps.panelPadding,
-      alignItems: "center",
-      ...knobProps.gap,
-      ...stackProps,
-      children: [/* @__PURE__ */_jsx(Text, {
-        color: "$red11",
-        children: t("Failed to load {{doctype}} schema", {
-          doctype
+  if (metaError && metaRefused && !layoutMeta) {
+    if (recordShape.status === "pending") {
+      return /* @__PURE__ */_jsx(_Fragment, {
+        children: loadingFallback !== null && loadingFallback !== void 0 ? loadingFallback : /* @__PURE__ */_jsx(YStack, {
+          flex: 1,
+          alignItems: "center",
+          justifyContent: "center",
+          ...stackProps,
+          children: /* @__PURE__ */_jsx(Spinner, {
+            size: "large"
+          })
         })
-      }), /* @__PURE__ */_jsx(Text, {
-        color: "$color10",
-        fontSize: "$2",
-        children: metaError.message
-      })]
+      });
+    }
+    return /* @__PURE__ */_jsx(_Fragment, {
+      children: errorFallback ? errorFallback(metaError) : /* @__PURE__ */_jsx(EmptyState, {
+        testID: "frappe-report-not-permitted",
+        title: t("report.notPermitted", {
+          defaultValue: "You can't open the {{doctype}} report",
+          doctype
+        }),
+        description: refusalReason(metaError)
+      })
     });
   }
-  if (isLoading) {
-    return /* @__PURE__ */_jsxs(YStack, {
-      ...knobProps.panelPadding,
-      alignItems: "center",
-      gap: "$1",
-      ...stackProps,
-      children: [/* @__PURE__ */_jsx(Spinner, {
-        size: "small"
-      }), /* @__PURE__ */_jsx(Text, {
-        color: "$color10",
-        fontSize: "$2",
-        children: t("Loading data...")
-      })]
+  if (metaError && !meta && !readsWithoutMeta) {
+    return /* @__PURE__ */_jsx(_Fragment, {
+      children: errorFallback ? errorFallback(metaError) : /* @__PURE__ */_jsx(EmptyState, {
+        intent: "error",
+        title: t("report.metaFailed", {
+          defaultValue: "Couldn't load the {{doctype}} report",
+          doctype
+        }),
+        description: metaError.message
+      })
     });
   }
-  if (isError) {
-    return /* @__PURE__ */_jsxs(YStack, {
-      ...knobProps.panelPadding,
+  var body;
+  if (syncError && isPermissionError(syncError)) {
+    body = /* @__PURE__ */_jsx(EmptyState, {
+      testID: "frappe-report-not-permitted",
+      title: t("report.notPermitted", {
+        defaultValue: "You can't open the {{doctype}} report",
+        doctype
+      }),
+      description: refusalReason(syncError)
+    });
+  } else if (syncError) {
+    body = /* @__PURE__ */_jsx(EmptyState, {
+      intent: "error",
+      title: t("report.loadFailed", "Couldn't load report rows"),
+      description: syncError.message
+    });
+  } else if (rowsLoading && total === 0) {
+    body = /* @__PURE__ */_jsx(YStack, {
+      flex: 1,
       alignItems: "center",
+      justifyContent: "center",
+      children: /* @__PURE__ */_jsx(Spinner, {
+        size: "large"
+      })
+    });
+  } else if (total === 0) {
+    var hasFilters = effectiveFilters.length > 0;
+    body = /* @__PURE__ */_jsx(EmptyState, {
+      title: t("report.emptyTitle", "No results"),
+      description: hasFilters ? t("report.emptyFiltered", "No rows match the current filters") : t("report.emptyDescription", {
+        defaultValue: "There are no {{doctype}} records yet",
+        doctype
+      }),
+      action: hasFilters ? /* @__PURE__ */_jsx(Button, {
+        size: "$3",
+        onPress: function onPress() {
+          handleClearColumnFilters();
+          handleClearBaseFilters();
+        },
+        children: t("report.clearAllFilters", "Clear all filters")
+      }) : void 0
+    });
+  } else {
+    body = /* @__PURE__ */_jsxs(YStack, {
+      flex: 1,
+      minWidth: 0,
       ...knobProps.gap,
-      ...stackProps,
-      children: [/* @__PURE__ */_jsx(Text, {
-        color: "$red11",
-        children: t("Failed to load {{doctype}} data", {
-          doctype
+      children: [chartData.length > 0 && /* @__PURE__ */_jsx(YStack, {
+        ...knobProps.surface,
+        ...knobProps.containerRadius,
+        ...knobProps.panelPadding,
+        children: /* @__PURE__ */_jsx(BarChart, {
+          data: chartData
         })
-      }), /* @__PURE__ */_jsx(Text, {
-        color: "$color10",
-        fontSize: "$2",
-        children: t("The live query could not load report rows.")
+      }), /* @__PURE__ */_jsx(ReportGrid, {
+        columns: selectedColumns,
+        rows: gridRows,
+        sort,
+        onSortChange: setSortOverride,
+        columnFilters: filterDrafts,
+        onColumnFilterChange: handleColumnFilterChange,
+        onOpenRow: rowsPressable ? handleOpenRow : void 0,
+        onOpenLink,
+        totals,
+        groupByColumn
       })]
     });
   }
-  return /* @__PURE__ */_jsxs(YStack, {
+  var content = /* @__PURE__ */_jsxs(YStack, {
     flex: 1,
-    ...knobProps.borderRadius,
+    minWidth: 0,
     ...stackProps,
-    children: [/* Frappe-specific toolbar: Save/Load reports */
-    /* @__PURE__ */_jsxs(XStack, {
-      ...knobProps.panelPadding,
-      ...knobProps.surface,
-      ...knobProps.gap,
-      alignItems: "center",
-      borderBottomWidth: 1,
-      borderBottomColor: "$borderColor",
-      children: [/* Subtle stale affordance while a post-event refresh reconciles */
-      isLiveStale ? /* @__PURE__ */_jsxs(XStack, {
-        gap: "$2",
-        alignItems: "center",
-        children: [/* @__PURE__ */_jsx(Spinner, {
-          size: "small",
-          "aria-label": t("Updating")
-        }), /* @__PURE__ */_jsx(Text, {
-          ...knobProps.label,
-          color: formCommonColors.muted,
-          children: t("Updating...")
-        })]
-      }) : null, /* @__PURE__ */_jsx(XStack, {
-        flex: 1
-      }), /* Save */
-      /* @__PURE__ */_jsxs(Popover, {
-        placement: "bottom-end",
-        open: saveDialogOpen,
-        onOpenChange: setSaveDialogOpen,
-        children: [/* @__PURE__ */_jsx(Popover.Trigger, {
-          asChild: true,
-          children: /* @__PURE__ */_jsx(Button, {
-            size: "$2",
-            icon: FloppyDiskIcon,
-            children: t("Save")
-          })
-        }), /* @__PURE__ */_jsx(PopoverContent, {
-          children: /* @__PURE__ */_jsxs(YStack, {
-            ...knobProps.gap,
-            minWidth: 220,
-            children: [/* @__PURE__ */_jsx(Text, {
-              ...knobProps.label,
-              fontWeight: "400",
-              children: t("Save Report")
-            }), /* @__PURE__ */_jsx(Input, {
-              label: t("Report name"),
-              labelHidden: true,
-              placeholder: t("Report name"),
-              value: saveReportName,
-              onChangeText: setSaveReportName,
-              inputProps: {
-                onSubmitEditing: handleSaveReport
-              }
-            }), /* @__PURE__ */_jsx(Button, {
-              size: "$2",
-              onPress: handleSaveReport,
-              disabled: !saveReportName.trim(),
-              children: t("Save")
-            })]
-          })
-        })]
-      }), /* Load */
-      savedReports.length > 0 && /* @__PURE__ */_jsxs(Popover, {
-        placement: "bottom-end",
-        children: [/* @__PURE__ */_jsx(Popover.Trigger, {
-          asChild: true,
-          children: /* @__PURE__ */_jsx(Button, {
-            size: "$2",
-            icon: FolderOpenIcon,
-            children: t("Load")
-          })
-        }), /* @__PURE__ */_jsx(PopoverContent, {
-          children: /* @__PURE__ */_jsxs(YStack, {
-            ...knobProps.gap,
-            minWidth: 180,
-            children: [/* @__PURE__ */_jsx(Text, {
-              ...knobProps.label,
-              fontWeight: "400",
-              color: formCommonColors.muted,
-              children: t("Saved Reports")
-            }), /* @__PURE__ */_jsx(Separator, {}), savedReports.map(function (report) {
-              return /* @__PURE__ */_jsxs(XStack, {
-                alignItems: "center",
-                justifyContent: "space-between",
-                padding: "$2",
-                ...knobProps.containerRadius,
-                hoverStyle: {
-                  backgroundColor: "$color2"
-                },
-                cursor: "pointer",
-                onPress: function onPress() {
-                  return handleLoadReport(report);
-                },
-                children: [/* @__PURE__ */_jsx(Text, {
-                  ...knobProps.body,
-                  flex: 1,
-                  children: report.name
-                }), /* @__PURE__ */_jsx(Button, {
-                  size: "$2",
-                  circular: true,
-                  chromeless: true,
-                  icon: TrashIcon,
-                  onPress: function onPress(e) {
-                    e.stopPropagation();
-                    handleDeleteReport(report.name);
-                  },
-                  "aria-label": t("Delete {{name}}", {
-                    name: report.name
-                  })
-                })]
-              }, report.name);
-            })]
-          })
-        })]
-      })]
-    }), /* Delegate to generic ReportBuilder */
-    /* @__PURE__ */_jsx(ReportBuilder, {
+    children: [/* @__PURE__ */_jsx(ReportViewToolbar, {
       columns: allColumns,
-      data,
-      groupBy: groupBy !== null && groupBy !== void 0 ? groupBy : void 0,
+      selected: selectedFieldnames,
+      onToggleColumn: handleToggleColumn,
+      onResetColumns: handleResetColumns,
+      groupBy,
       onGroupByChange: setGroupBy,
-      onColumnsChange: setEnabledColumns,
+      baseFilters,
+      onClearBaseFilters: baseFilters.length > 0 ? handleClearBaseFilters : void 0,
+      columnFilterCount: columnTuples.length,
+      onClearColumnFilters: handleClearColumnFilters,
+      savedReports: savedReports.reports,
+      currentReport,
+      onSelectReport: handleSelectReport,
+      onSaveReport: readsWithoutMeta ? void 0 : handleSaveReport,
+      onDeleteReport: readsWithoutMeta ? void 0 : handleDeleteReport,
       onExport: exportEnabled ? handleExport : void 0,
-      onRowPress,
-      showChart,
-      flex: 1
+      exportDisabled: total === 0
+    }), /* @__PURE__ */_jsx(YStack, {
+      flex: 1,
+      minWidth: 0,
+      paddingHorizontal: "$3",
+      children: body
+    }), total > 0 && !syncError && /* @__PURE__ */_jsx(YStack, {
+      paddingHorizontal: "$3",
+      paddingVertical: "$2",
+      children: /* @__PURE__ */_jsx(DataTablePagination, {
+        pagination: {
+          pageIndex: effectivePage,
+          pageSize,
+          totalCount: total,
+          totalPages: pageCount
+        },
+        onPaginationChange: function onPaginationChange(next) {
+          setPage(next.pageIndex);
+          setPageSize(next.pageSize);
+        },
+        pageSizeOptions: [...REPORT_PAGE_SIZES],
+        compact: true
+      })
     })]
   });
+  return isWeb ? content : /* @__PURE__ */_jsx(ScrollView, {
+    flex: 1,
+    children: content
+  });
 }
 export { FrappeReportBuilder };
 //# sourceMappingURL=FrappeReportBuilder.native.js.map