blixify-ui-web 1.2.180 → 1.2.182

package/lib/components/data/dataTemplate/index.js

@@ -82,7 +82,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.DataTemplate = void 0;
+exports.DataTemplate = exports.FORMULA_VIEW_MAX_ROWS = void 0;
 var outline_1 = require("@heroicons/react/24/outline");
 var HeroIcons = __importStar(require("@heroicons/react/24/solid"));
 // INFO: the outline bookmark, for a tab that is not the default one. HeroIcons
@@ -135,6 +135,7 @@ var link_1 = require("../../structure/link");
 var authModule_1 = require("../authModule");
 var blobModule_1 = require("../blobModule");
 var listModule_1 = require("../listModule");
+var formula_1 = require("../formula");
 var moduleUtils_1 = require("../moduleUtils");
 var queryForm_1 = require("../queryForm");
 var readModule_1 = require("../readModule");
@@ -187,6 +188,9 @@ var handleIsEmptyElement = function (element) {
 };
 // INFO: rows-per-page choices offered in the view settings panel
 var PAGE_LIMIT_OPTIONS = [10, 25, 50, 100];
+// INFO: the most rows a formula sort or filter reads into the browser; each is
+// evaluated, filtered and ordered locally, so a larger read could freeze the tab
+exports.FORMULA_VIEW_MAX_ROWS = 5000;
 var CALENDAR_VIEW_BY_SWITCH = {
     month: "dayGridMonth",
     week: "timeGridWeek",
@@ -212,10 +216,10 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
     // Every read of the view type below uses resolvedType. The distinction matters
     // most in effect dependency arrays — following props.type there would leave
     // the list never refetching while the panel is open, which fails silently.
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19, _20, _21, _22, _23, _24, _25, _26, _27, _28, _29, _30, _31, _32, _33, _34, _35, _36, _37, _38, _39, _40, _41, _42, _43, _44, _45, _46, _47, _48, _49, _50, _51, _52, _53, _54, _55, _56, _57, _58, _59, _60, _61, _62, _63, _64, _65, _66, _67, _68, _69, _70, _71, _72, _73, _74, _75, _76, _77, _78, _79, _80, _81, _82, _83, _84, _85, _86, _87, _88, _89, _90, _91, _92;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19, _20, _21, _22, _23, _24, _25, _26, _27, _28, _29, _30, _31, _32, _33, _34, _35, _36, _37, _38, _39, _40, _41, _42, _43, _44, _45, _46, _47, _48, _49, _50, _51, _52, _53, _54, _55, _56, _57, _58, _59, _60, _61, _62, _63, _64, _65, _66, _67, _68, _69, _70, _71, _72, _73, _74, _75, _76, _77, _78, _79, _80, _81, _82, _83, _84, _85, _86, _87, _88, _89, _90, _91, _92, _93, _94;
     // INFO: the panel cannot navigate its way out — handleNavigate("read") is
     // routed straight back into it — so expand-to-full-page is local state.
-    var _93 = (0, react_1.useState)(false), drawerPageView = _93[0], setDrawerPageView = _93[1];
+    var _95 = (0, react_1.useState)(false), drawerPageView = _95[0], setDrawerPageView = _95[1];
     // INFO: the panel keeps rendering the record it was opened with rather than
     // live props. Without this, navigating back to the list would re-render the
     // still-mounted panel as a second list behind the overlay.
@@ -307,18 +311,18 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
             initialFilterReferenceDate: initialFilterReferenceDate,
         };
     };
-    var _94 = intialiseDefaultFilterValues(), initialFilterSearch = _94.initialFilterSearch, initialFilterSearchParams = _94.initialFilterSearchParams, initialFilterSelection = _94.initialFilterSelection, initialFilterReference = _94.initialFilterReference, initialFilterReferenceDate = _94.initialFilterReferenceDate;
+    var _96 = intialiseDefaultFilterValues(), initialFilterSearch = _96.initialFilterSearch, initialFilterSearchParams = _96.initialFilterSearchParams, initialFilterSelection = _96.initialFilterSelection, initialFilterReference = _96.initialFilterReference, initialFilterReferenceDate = _96.initialFilterReferenceDate;
     // INFO: Persist view state hook — handles storage read/write for filter/sort/column state
-    var _95 = (0, viewStatePersistence_1.usePersistedViewState)({
+    var _97 = (0, viewStatePersistence_1.usePersistedViewState)({
         mode: (_b = props.organise) === null || _b === void 0 ? void 0 : _b.persistViewState,
         collectionId: props.collectionId,
         persistKey: (_c = props.organise) === null || _c === void 0 ? void 0 : _c.persistKey,
         type: resolvedType,
-    }), rawPersistedState = _95.persistedState, isPersistEnabled = _95.isEnabled, handleSaveView = _95.handleSaveView, handleRegisterViewSnapshot = _95.handleRegisterViewSnapshot;
+    }), rawPersistedState = _97.persistedState, isPersistEnabled = _97.isEnabled, handleSaveView = _97.handleSaveView, handleRegisterViewSnapshot = _97.handleRegisterViewSnapshot;
     // INFO: drop stored filters/sort on removed columns — they would empty the table
     var persistedState = (0, react_1.useMemo)(function () { return (0, viewStatePersistence_1.handlePruneStaleColumns)(rawPersistedState, props.model); }, [rawPersistedState, props.model]);
-    var _96 = (0, react_1.useState)(false), loading = _96[0], setLoading = _96[1];
-    var _97 = (0, react_1.useState)(), notification = _97[0], setNotification = _97[1];
+    var _98 = (0, react_1.useState)(false), loading = _98[0], setLoading = _98[1];
+    var _99 = (0, react_1.useState)(), notification = _99[0], setNotification = _99[1];
     // INFO: a success toast is confirmation, not a decision — it clears itself so
     // it never sits on the floating step bar; errors stay until dismissed
     (0, react_1.useEffect)(function () {
@@ -328,63 +332,63 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
         return function () { return clearTimeout(timer); };
     }, [notification]);
     //INFO : Used by List
-    var _98 = (0, react_1.useState)((_d = persistedState === null || persistedState === void 0 ? void 0 : persistedState.filterSearchParams) !== null && _d !== void 0 ? _d : initialFilterSearch), filterSearch = _98[0], setFilterSearch = _98[1];
-    var _99 = (0, react_1.useState)((_e = persistedState === null || persistedState === void 0 ? void 0 : persistedState.filterSearchParams) !== null && _e !== void 0 ? _e : initialFilterSearchParams), filterSearchParams = _99[0], setFilterSearchParams = _99[1];
-    var _100 = (0, react_1.useState)((_f = persistedState === null || persistedState === void 0 ? void 0 : persistedState.filterSelection) !== null && _f !== void 0 ? _f : initialFilterSelection), filterSelection = _100[0], setFilterSelection = _100[1];
-    var _101 = (0, react_1.useState)((_g = persistedState === null || persistedState === void 0 ? void 0 : persistedState.filterReference) !== null && _g !== void 0 ? _g : initialFilterReference), filterReference = _101[0], setFilterReference = _101[1];
-    var _102 = (0, react_1.useState)({}), filterReferenceSearch = _102[0], setFilterReferenceSearch = _102[1];
-    var _103 = (0, react_1.useState)({}), filterReferenceList = _103[0], setFilterReferenceList = _103[1];
-    var _104 = (0, react_1.useState)((persistedState === null || persistedState === void 0 ? void 0 : persistedState.filterReferenceDate)
+    var _100 = (0, react_1.useState)((_d = persistedState === null || persistedState === void 0 ? void 0 : persistedState.filterSearchParams) !== null && _d !== void 0 ? _d : initialFilterSearch), filterSearch = _100[0], setFilterSearch = _100[1];
+    var _101 = (0, react_1.useState)((_e = persistedState === null || persistedState === void 0 ? void 0 : persistedState.filterSearchParams) !== null && _e !== void 0 ? _e : initialFilterSearchParams), filterSearchParams = _101[0], setFilterSearchParams = _101[1];
+    var _102 = (0, react_1.useState)((_f = persistedState === null || persistedState === void 0 ? void 0 : persistedState.filterSelection) !== null && _f !== void 0 ? _f : initialFilterSelection), filterSelection = _102[0], setFilterSelection = _102[1];
+    var _103 = (0, react_1.useState)((_g = persistedState === null || persistedState === void 0 ? void 0 : persistedState.filterReference) !== null && _g !== void 0 ? _g : initialFilterReference), filterReference = _103[0], setFilterReference = _103[1];
+    var _104 = (0, react_1.useState)({}), filterReferenceSearch = _104[0], setFilterReferenceSearch = _104[1];
+    var _105 = (0, react_1.useState)({}), filterReferenceList = _105[0], setFilterReferenceList = _105[1];
+    var _106 = (0, react_1.useState)((persistedState === null || persistedState === void 0 ? void 0 : persistedState.filterReferenceDate)
         ? (0, viewStatePersistence_1.parseDateFilterState)(persistedState.filterReferenceDate)
-        : initialFilterReferenceDate), filterReferenceDate = _104[0], setFilterReferenceDate = _104[1];
-    var _105 = (0, react_1.useState)(true), tableLoading = _105[0], setTableLoading = _105[1];
-    var _106 = (0, react_1.useState)(""), cursor = _106[0], setCursor = _106[1];
-    var _107 = (0, react_1.useState)(""), lastCursor = _107[0], setLastCursor = _107[1];
-    var _108 = (0, react_1.useState)([]), tableData = _108[0], setTableData = _108[1];
-    var _109 = (0, react_1.useState)([]), spaceTableData = _109[0], setSpaceTableData = _109[1];
+        : initialFilterReferenceDate), filterReferenceDate = _106[0], setFilterReferenceDate = _106[1];
+    var _107 = (0, react_1.useState)(true), tableLoading = _107[0], setTableLoading = _107[1];
+    var _108 = (0, react_1.useState)(""), cursor = _108[0], setCursor = _108[1];
+    var _109 = (0, react_1.useState)(""), lastCursor = _109[0], setLastCursor = _109[1];
+    var _110 = (0, react_1.useState)([]), tableData = _110[0], setTableData = _110[1];
+    var _111 = (0, react_1.useState)([]), spaceTableData = _111[0], setSpaceTableData = _111[1];
     // INFO: a save resolves after later renders, so it reads the table from here —
     // the state it closed over can predate an earlier save on the same row
     var tableDataRef = (0, react_1.useRef)([]);
     var spaceTableDataRef = (0, react_1.useRef)([]);
     tableDataRef.current = tableData;
     spaceTableDataRef.current = spaceTableData;
-    var _110 = (0, react_1.useState)(0), size = _110[0], setSize = _110[1];
-    var _111 = (0, react_1.useState)((_k = (_h = persistedState === null || persistedState === void 0 ? void 0 : persistedState.pageIndex) !== null && _h !== void 0 ? _h : (_j = props.organise) === null || _j === void 0 ? void 0 : _j.pageIndex) !== null && _k !== void 0 ? _k : 0), pageIndex = _111[0], setPageIndex = _111[1];
-    var _112 = (0, react_1.useState)([]), selectedIds = _112[0], setSelectedIds = _112[1];
-    var _113 = (0, react_1.useState)(false), selectAll = _113[0], setSelectAll = _113[1];
-    var _114 = (0, react_1.useState)(""), deletePasscode = _114[0], setDeletePasscode = _114[1];
-    var _115 = (0, react_1.useState)(""), deletePasscodeInput = _115[0], setDeletePasscodeInput = _115[1];
-    var _116 = (0, react_1.useState)(""), deleteFeedId = _116[0], setDeleteFeedId = _116[1];
+    var _112 = (0, react_1.useState)(0), size = _112[0], setSize = _112[1];
+    var _113 = (0, react_1.useState)((_k = (_h = persistedState === null || persistedState === void 0 ? void 0 : persistedState.pageIndex) !== null && _h !== void 0 ? _h : (_j = props.organise) === null || _j === void 0 ? void 0 : _j.pageIndex) !== null && _k !== void 0 ? _k : 0), pageIndex = _113[0], setPageIndex = _113[1];
+    var _114 = (0, react_1.useState)([]), selectedIds = _114[0], setSelectedIds = _114[1];
+    var _115 = (0, react_1.useState)(false), selectAll = _115[0], setSelectAll = _115[1];
+    var _116 = (0, react_1.useState)(""), deletePasscode = _116[0], setDeletePasscode = _116[1];
+    var _117 = (0, react_1.useState)(""), deletePasscodeInput = _117[0], setDeletePasscodeInput = _117[1];
+    var _118 = (0, react_1.useState)(""), deleteFeedId = _118[0], setDeleteFeedId = _118[1];
     //INFO : Used by List Organise
     // INFO: Internal sort state that overrides props.organise?.sort when
     // persistViewState is enabled and a persisted sort exists
-    var _117 = (0, react_1.useState)((_l = persistedState === null || persistedState === void 0 ? void 0 : persistedState.sort) !== null && _l !== void 0 ? _l : undefined), persistedSort = _117[0], setPersistedSort = _117[1];
-    var _118 = (0, react_1.useState)(false), filterDraft = _118[0], setFilterDraft = _118[1];
-    var _119 = (0, react_1.useState)(false), addTabModal = _119[0], setAddTabModal = _119[1];
-    var _120 = (0, react_1.useState)(-1), editTabIndex = _120[0], setEditTabIndex = _120[1];
+    var _119 = (0, react_1.useState)((_l = persistedState === null || persistedState === void 0 ? void 0 : persistedState.sort) !== null && _l !== void 0 ? _l : undefined), persistedSort = _119[0], setPersistedSort = _119[1];
+    var _120 = (0, react_1.useState)(false), filterDraft = _120[0], setFilterDraft = _120[1];
+    var _121 = (0, react_1.useState)(false), addTabModal = _121[0], setAddTabModal = _121[1];
+    var _122 = (0, react_1.useState)(-1), editTabIndex = _122[0], setEditTabIndex = _122[1];
     //INFO : resolve the initial tab synchronously so the mount cond is already
     // tab-scoped — an empty initial tab caused a second wasted list fetch
-    var _121 = (0, react_1.useState)(function () {
+    var _123 = (0, react_1.useState)(function () {
         var _a, _b;
         return (0, listModule_1.renderSelectedRefreshTab)(props.localURLEndpoint, resolvedType, props.collectionId, props.id, (_a = props.organise) === null || _a === void 0 ? void 0 : _a.extendedTabs, (_b = props.organise) === null || _b === void 0 ? void 0 : _b.viewId);
-    }), selectedTab = _121[0], setSelectedTab = _121[1];
-    var _122 = (0, react_1.useState)("dayGridMonth"), calendarView = _122[0], setCalendarView = _122[1];
+    }), selectedTab = _123[0], setSelectedTab = _123[1];
+    var _124 = (0, react_1.useState)("dayGridMonth"), calendarView = _124[0], setCalendarView = _124[1];
     // INFO: bareNewDTW calendar viewSwitch mode — drives the NewCalendar variant
     // (calendarView above drives the matching range query)
-    var _123 = (0, react_1.useState)("month"), newCalendarViewMode = _123[0], setNewCalendarViewMode = _123[1];
-    var _124 = (0, react_1.useState)(new Date()), calendarTabMonth = _124[0], setCalendarTabMonth = _124[1];
+    var _125 = (0, react_1.useState)("month"), newCalendarViewMode = _125[0], setNewCalendarViewMode = _125[1];
+    var _126 = (0, react_1.useState)(new Date()), calendarTabMonth = _126[0], setCalendarTabMonth = _126[1];
     // INFO: defaultViewSwitch picks the opening view only — the tab re-inits
     // whenever its settings change, and that must not undo the user's switch
     var calendarViewInitRef = (0, react_1.useRef)(false);
-    var _125 = (0, react_1.useState)(true), kanbanDroppable = _125[0], setKanbanDroppable = _125[1];
-    var _126 = (0, react_1.useState)([]), kanbanOptions = _126[0], setKanbanOptions = _126[1];
-    var _127 = (0, react_1.useState)(false), queryForm = _127[0], setQueryForm = _127[1];
-    var _128 = (0, react_1.useState)(false), batchUpdateModal = _128[0], setBatchUpdateModal = _128[1];
-    var _129 = (0, react_1.useState)({
+    var _127 = (0, react_1.useState)(true), kanbanDroppable = _127[0], setKanbanDroppable = _127[1];
+    var _128 = (0, react_1.useState)([]), kanbanOptions = _128[0], setKanbanOptions = _128[1];
+    var _129 = (0, react_1.useState)(false), queryForm = _129[0], setQueryForm = _129[1];
+    var _130 = (0, react_1.useState)(false), batchUpdateModal = _130[0], setBatchUpdateModal = _130[1];
+    var _131 = (0, react_1.useState)({
         columnId: "",
         columnData: {},
-    }), batchUpdateData = _129[0], setBatchUpdateData = _129[1];
-    var _130 = (0, react_1.useState)(function () {
+    }), batchUpdateData = _131[0], setBatchUpdateData = _131[1];
+    var _132 = (0, react_1.useState)(function () {
         var baseModel = (props === null || props === void 0 ? void 0 : props.model) || [];
         if (!persistedState)
             return baseModel;
@@ -410,8 +414,8 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
             });
         }
         return model;
-    }), structure = _130[0], setStructure = _130[1];
-    var _131 = (0, react_1.useState)(((_m = props === null || props === void 0 ? void 0 : props.organise) === null || _m === void 0 ? void 0 : _m.additionalQuery) || []), additionalQuery = _131[0], setAdditionalQuery = _131[1];
+    }), structure = _132[0], setStructure = _132[1];
+    var _133 = (0, react_1.useState)(((_m = props === null || props === void 0 ? void 0 : props.organise) === null || _m === void 0 ? void 0 : _m.additionalQuery) || []), additionalQuery = _133[0], setAdditionalQuery = _133[1];
     // INFO: State for user-configurable flex filters (Monday.com-style)
     // INFO: Initialize with one empty row so users see inputs immediately without clicking "Add Filter"
     var defaultFlexFilterRow = [
@@ -422,9 +426,9 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
             value: undefined,
         },
     ];
-    var _132 = (0, react_1.useState)((persistedState === null || persistedState === void 0 ? void 0 : persistedState.flexFilters) && persistedState.flexFilters.length > 0
+    var _134 = (0, react_1.useState)((persistedState === null || persistedState === void 0 ? void 0 : persistedState.flexFilters) && persistedState.flexFilters.length > 0
         ? persistedState.flexFilters
-        : defaultFlexFilterRow), flexFilters = _132[0], setFlexFilters = _132[1];
+        : defaultFlexFilterRow), flexFilters = _134[0], setFlexFilters = _134[1];
     // INFO: always-current mirror of flexFilters, read by the imperative apply/
     // clear methods so chained calls in one tick aren't stale.
     var flexFiltersRef = (0, react_1.useRef)(flexFilters);
@@ -437,74 +441,74 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
     }, [flexFilters]);
     // INFO: Debounced version of flexFilters used by renderImpSearchFilterConditions
     // to prevent API calls on every keystroke when typing in value inputs
-    var _133 = (0, react_1.useState)((persistedState === null || persistedState === void 0 ? void 0 : persistedState.flexFilters) && persistedState.flexFilters.length > 0
+    var _135 = (0, react_1.useState)((persistedState === null || persistedState === void 0 ? void 0 : persistedState.flexFilters) && persistedState.flexFilters.length > 0
         ? persistedState.flexFilters
-        : defaultFlexFilterRow), flexFiltersDebounced = _133[0], setFlexFiltersDebounced = _133[1];
-    var _134 = (0, react_1.useState)({}), flexFilterReferenceOptions = _134[0], setFlexFilterReferenceOptions = _134[1];
-    var _135 = (0, react_1.useState)({}), flexFilterReferenceSearch = _135[0], setFlexFilterReferenceSearch = _135[1];
-    var _136 = (0, react_1.useState)(false), flexFilterModalOpen = _136[0], setFlexFilterModalOpen = _136[1];
-    var _137 = (0, react_1.useState)(false), viewSettingsModalOpen = _137[0], setViewSettingsModalOpen = _137[1];
+        : defaultFlexFilterRow), flexFiltersDebounced = _135[0], setFlexFiltersDebounced = _135[1];
+    var _136 = (0, react_1.useState)({}), flexFilterReferenceOptions = _136[0], setFlexFilterReferenceOptions = _136[1];
+    var _137 = (0, react_1.useState)({}), flexFilterReferenceSearch = _137[0], setFlexFilterReferenceSearch = _137[1];
+    var _138 = (0, react_1.useState)(false), flexFilterModalOpen = _138[0], setFlexFilterModalOpen = _138[1];
+    var _139 = (0, react_1.useState)(false), viewSettingsModalOpen = _139[0], setViewSettingsModalOpen = _139[1];
     // INFO: Columns the end user chose to hide (bareSettings.bareViewSettings).
     // Deliberately kept out of `structure`: the props-sync effect below resets
     // structure to props.model whenever props change, which would wipe the
     // choice, and the persist effect derives schema-level hiddenColumnIds from
     // structure — writing user hides there would blur the two concepts.
-    var _138 = (0, react_1.useState)((_o = persistedState === null || persistedState === void 0 ? void 0 : persistedState.userHiddenColumnIds) !== null && _o !== void 0 ? _o : []), userHiddenColumnIds = _138[0], setUserHiddenColumnIds = _138[1];
-    var _139 = (0, react_1.useState)(""), columnSearch = _139[0], setColumnSearch = _139[1];
-    var _140 = (0, react_1.useState)([]), savedViews = _140[0], setSavedViews = _140[1];
-    var _141 = (0, react_1.useState)(null), activeSavedViewId = _141[0], setActiveSavedViewId = _141[1];
+    var _140 = (0, react_1.useState)((_o = persistedState === null || persistedState === void 0 ? void 0 : persistedState.userHiddenColumnIds) !== null && _o !== void 0 ? _o : []), userHiddenColumnIds = _140[0], setUserHiddenColumnIds = _140[1];
+    var _141 = (0, react_1.useState)(""), columnSearch = _141[0], setColumnSearch = _141[1];
+    var _142 = (0, react_1.useState)([]), savedViews = _142[0], setSavedViews = _142[1];
+    var _143 = (0, react_1.useState)(null), activeSavedViewId = _143[0], setActiveSavedViewId = _143[1];
     // INFO: null while the name box is closed
-    var _142 = (0, react_1.useState)(null), savedViewName = _142[0], setSavedViewName = _142[1];
-    var _143 = (0, react_1.useState)(null), deletingSavedViewId = _143[0], setDeletingSavedViewId = _143[1];
-    var _144 = (0, react_1.useState)(null), draggingColumnId = _144[0], setDraggingColumnId = _144[1];
+    var _144 = (0, react_1.useState)(null), savedViewName = _144[0], setSavedViewName = _144[1];
+    var _145 = (0, react_1.useState)(null), deletingSavedViewId = _145[0], setDeletingSavedViewId = _145[1];
+    var _146 = (0, react_1.useState)(null), draggingColumnId = _146[0], setDraggingColumnId = _146[1];
     var columnRowRefs = (0, react_1.useRef)({});
     //INFO : Used by Auth
-    var _145 = (0, react_1.useState)({
+    var _147 = (0, react_1.useState)({
         email: "",
         google: "",
         phone: "",
         disabled: false,
         create: false,
-    }), authMethods = _145[0], setAuthMethods = _145[1];
-    var _146 = (0, react_1.useState)(""), selectedAuthMethod = _146[0], setSelectedAuthMethod = _146[1];
+    }), authMethods = _147[0], setAuthMethods = _147[1];
+    var _148 = (0, react_1.useState)(""), selectedAuthMethod = _148[0], setSelectedAuthMethod = _148[1];
     // INFO: the sign-in check of a users datasheet's record is running; the
     // panel shows a spinner rather than nothing, which read as "no login"
-    var _147 = (0, react_1.useState)(false), authLoading = _147[0], setAuthLoading = _147[1];
+    var _149 = (0, react_1.useState)(false), authLoading = _149[0], setAuthLoading = _149[1];
     // INFO: a delete is running — the ref answers a second tap at once, before
     // the state has rendered, and the state disables the confirm button
     var deletingRef = (0, react_1.useRef)(false);
-    var _148 = (0, react_1.useState)(false), deleting = _148[0], setDeleting = _148[1];
+    var _150 = (0, react_1.useState)(false), deleting = _150[0], setDeleting = _150[1];
     // INFO: Used by Activity Log
-    var _149 = (0, react_1.useState)(false), activityModal = _149[0], setActivityModal = _149[1];
-    var _150 = (0, react_1.useState)(""), activityId = _150[0], setActivityId = _150[1];
+    var _151 = (0, react_1.useState)(false), activityModal = _151[0], setActivityModal = _151[1];
+    var _152 = (0, react_1.useState)(""), activityId = _152[0], setActivityId = _152[1];
     //INFO : Used by Export
-    var _151 = (0, react_1.useState)(null), csvFile = _151[0], setCSVFile = _151[1];
-    var _152 = (0, react_1.useState)([]), csvFileData = _152[0], setCSVFileData = _152[1];
-    var _153 = (0, react_1.useState)(0), stepCSVIndex = _153[0], setStepCSVIndex = _153[1];
-    var _154 = (0, react_1.useState)({}), listCSVMapAttribute = _154[0], setListCSVMapAttribute = _154[1];
-    var _155 = (0, react_1.useState)({}), listCSVObjAttribute = _155[0], setListCSVObjAttribute = _155[1];
-    var _156 = (0, react_1.useState)([]), csvAPIAttribute = _156[0], setCSVAPIAttribute = _156[1];
-    var _157 = (0, react_1.useState)(((_p = props.devSettings.currentUser) === null || _p === void 0 ? void 0 : _p.userEmail) || ""), exportCSVEmail = _157[0], setExportCSVEmail = _157[1];
-    var _158 = (0, react_1.useState)(((_r = (_q = props.organise) === null || _q === void 0 ? void 0 : _q.exportSettings) === null || _r === void 0 ? void 0 : _r.defaultExportPDFName) || ""), exportPDFTitle = _158[0], setExportPDFTitle = _158[1];
-    var _159 = (0, react_1.useState)(false), exportPDFLoading = _159[0], setExportPDFLoading = _159[1];
-    var _160 = (0, react_1.useState)(false), exportReadPDFLoading = _160[0], setExportReadPDFLoading = _160[1];
-    var _161 = (0, react_1.useState)((_u = (_t = (_s = props.organise) === null || _s === void 0 ? void 0 : _s.exportSettings) === null || _t === void 0 ? void 0 : _t.sumColumnId) !== null && _u !== void 0 ? _u : []), exportSumAttributeIds = _161[0], setExportSumAttributeIds = _161[1];
-    var _162 = (0, react_1.useState)((_x = (_w = (_v = props.organise) === null || _v === void 0 ? void 0 : _v.exportSettings) === null || _w === void 0 ? void 0 : _w.hideSubItems) !== null && _x !== void 0 ? _x : false), hideSubItems = _162[0], setHideSubItems = _162[1];
-    var _163 = (0, react_1.useState)([]), importTableData = _163[0], setImportTableData = _163[1];
-    var _164 = (0, react_1.useState)([]), queryList = _164[0], setQueryList = _164[1];
-    var _165 = (0, react_1.useState)(undefined), allQueryList = _165[0], setAllQueryList = _165[1];
-    var _166 = (0, react_1.useState)(-1), queryIndex = _166[0], setQueryIndex = _166[1];
+    var _153 = (0, react_1.useState)(null), csvFile = _153[0], setCSVFile = _153[1];
+    var _154 = (0, react_1.useState)([]), csvFileData = _154[0], setCSVFileData = _154[1];
+    var _155 = (0, react_1.useState)(0), stepCSVIndex = _155[0], setStepCSVIndex = _155[1];
+    var _156 = (0, react_1.useState)({}), listCSVMapAttribute = _156[0], setListCSVMapAttribute = _156[1];
+    var _157 = (0, react_1.useState)({}), listCSVObjAttribute = _157[0], setListCSVObjAttribute = _157[1];
+    var _158 = (0, react_1.useState)([]), csvAPIAttribute = _158[0], setCSVAPIAttribute = _158[1];
+    var _159 = (0, react_1.useState)(((_p = props.devSettings.currentUser) === null || _p === void 0 ? void 0 : _p.userEmail) || ""), exportCSVEmail = _159[0], setExportCSVEmail = _159[1];
+    var _160 = (0, react_1.useState)(((_r = (_q = props.organise) === null || _q === void 0 ? void 0 : _q.exportSettings) === null || _r === void 0 ? void 0 : _r.defaultExportPDFName) || ""), exportPDFTitle = _160[0], setExportPDFTitle = _160[1];
+    var _161 = (0, react_1.useState)(false), exportPDFLoading = _161[0], setExportPDFLoading = _161[1];
+    var _162 = (0, react_1.useState)(false), exportReadPDFLoading = _162[0], setExportReadPDFLoading = _162[1];
+    var _163 = (0, react_1.useState)((_u = (_t = (_s = props.organise) === null || _s === void 0 ? void 0 : _s.exportSettings) === null || _t === void 0 ? void 0 : _t.sumColumnId) !== null && _u !== void 0 ? _u : []), exportSumAttributeIds = _163[0], setExportSumAttributeIds = _163[1];
+    var _164 = (0, react_1.useState)((_x = (_w = (_v = props.organise) === null || _v === void 0 ? void 0 : _v.exportSettings) === null || _w === void 0 ? void 0 : _w.hideSubItems) !== null && _x !== void 0 ? _x : false), hideSubItems = _164[0], setHideSubItems = _164[1];
+    var _165 = (0, react_1.useState)([]), importTableData = _165[0], setImportTableData = _165[1];
+    var _166 = (0, react_1.useState)([]), queryList = _166[0], setQueryList = _166[1];
+    var _167 = (0, react_1.useState)(undefined), allQueryList = _167[0], setAllQueryList = _167[1];
+    var _168 = (0, react_1.useState)(-1), queryIndex = _168[0], setQueryIndex = _168[1];
     // INFO: a restored state wins over the prop; its "" is a list the user
     // ungrouped, so it opens ungrouped
-    var _167 = (0, react_1.useState)((persistedState === null || persistedState === void 0 ? void 0 : persistedState.groupBy) !== undefined
+    var _169 = (0, react_1.useState)((persistedState === null || persistedState === void 0 ? void 0 : persistedState.groupBy) !== undefined
         ? persistedState.groupBy || undefined
-        : (_y = props.organise) === null || _y === void 0 ? void 0 : _y.groupBy), groupId = _167[0], setGroupId = _167[1];
+        : (_y = props.organise) === null || _y === void 0 ? void 0 : _y.groupBy), groupId = _169[0], setGroupId = _169[1];
     // INFO: Monday-board per-group paging. Keyed by the group key that
     // handleBuildNewTableGroups() produces (a list option or "Unknown/No Value").
     // Each group tracks its own loaded cursor + total so it can lazily load its
     // next page as the user scrolls inside that band, independent of every other
     // group. Only used when renderCheckGroupPaging() is true.
-    var _168 = (0, react_1.useState)({}), groupPageState = _168[0], setGroupPageState = _168[1];
+    var _170 = (0, react_1.useState)({}), groupPageState = _170[0], setGroupPageState = _170[1];
     // INFO: read fresh inside the async per-group fetch so chained scroll fires
     // in one tick do not re-fetch an already in-flight page.
     var groupPageStateRef = (0, react_1.useRef)({});
@@ -513,59 +517,59 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
     // list was re-read (new search, filter, sort or grouping) is dropped on
     // arrival instead of appending rows that belong to the old list
     var groupPagingGenRef = (0, react_1.useRef)(0);
-    var _169 = (0, react_1.useState)(""), readTabSection = _169[0], setReadTabSection = _169[1];
-    var _170 = (0, react_1.useState)(false), readFloatingNav = _170[0], setReadFloatingNav = _170[1];
+    var _171 = (0, react_1.useState)(""), readTabSection = _171[0], setReadTabSection = _171[1];
+    var _172 = (0, react_1.useState)(false), readFloatingNav = _172[0], setReadFloatingNav = _172[1];
     var readTabSectionRefs = (0, react_1.useRef)({});
     //INFO : Used by Read
     //INFO : Used by Update
-    var _171 = (0, react_1.useState)(false), modalVisible = _171[0], setModalVisible = _171[1];
-    var _172 = (0, react_1.useState)(false), deleteModal = _172[0], setDeleteModal = _172[1];
-    var _173 = (0, react_1.useState)(false), excelModal = _173[0], setExcelModal = _173[1];
-    var _174 = (0, react_1.useState)(false), exportExcel = _174[0], setExportExcel = _174[1];
-    var _175 = (0, react_1.useState)(""), exportType = _175[0], setExportType = _175[1];
-    var _176 = (0, react_1.useState)(false), exportQR = _176[0], setExportQR = _176[1];
-    var _177 = (0, react_1.useState)(function () {
+    var _173 = (0, react_1.useState)(false), modalVisible = _173[0], setModalVisible = _173[1];
+    var _174 = (0, react_1.useState)(false), deleteModal = _174[0], setDeleteModal = _174[1];
+    var _175 = (0, react_1.useState)(false), excelModal = _175[0], setExcelModal = _175[1];
+    var _176 = (0, react_1.useState)(false), exportExcel = _176[0], setExportExcel = _176[1];
+    var _177 = (0, react_1.useState)(""), exportType = _177[0], setExportType = _177[1];
+    var _178 = (0, react_1.useState)(false), exportQR = _178[0], setExportQR = _178[1];
+    var _179 = (0, react_1.useState)(function () {
         var _a, _b;
         var firstTabId = (_b = (_a = structure.find(function (item) { return item.tabId; })) === null || _a === void 0 ? void 0 : _a.tabId) !== null && _b !== void 0 ? _b : "";
         return firstTabId;
-    }), activeTab = _177[0], setActiveTab = _177[1];
-    var _178 = (0, react_1.useState)(false), signatureSigning = _178[0], setSignatureSigning = _178[1];
-    var _179 = (0, react_1.useState)({}), selectedData = _179[0], setSelectedData = _179[1];
-    var _180 = (0, react_1.useState)(""), selectedObjectStructureId = _180[0], setSelectedObjectStructureId = _180[1];
-    var _181 = (0, react_1.useState)(""), selectedObjectId = _181[0], setSelectedObjectId = _181[1];
-    var _182 = (0, react_1.useState)(""), selectedListAddressId = _182[0], setSelectedListAddressId = _182[1];
-    var _183 = (0, react_1.useState)(-1), selectedListAddressIndex = _183[0], setSelectedListAddressIndex = _183[1];
-    var _184 = (0, react_1.useState)({
+    }), activeTab = _179[0], setActiveTab = _179[1];
+    var _180 = (0, react_1.useState)(false), signatureSigning = _180[0], setSignatureSigning = _180[1];
+    var _181 = (0, react_1.useState)({}), selectedData = _181[0], setSelectedData = _181[1];
+    var _182 = (0, react_1.useState)(""), selectedObjectStructureId = _182[0], setSelectedObjectStructureId = _182[1];
+    var _183 = (0, react_1.useState)(""), selectedObjectId = _183[0], setSelectedObjectId = _183[1];
+    var _184 = (0, react_1.useState)(""), selectedListAddressId = _184[0], setSelectedListAddressId = _184[1];
+    var _185 = (0, react_1.useState)(-1), selectedListAddressIndex = _185[0], setSelectedListAddressIndex = _185[1];
+    var _186 = (0, react_1.useState)({
         lat: 0,
         lng: 0,
         name: "",
-    }), selectedListAddress = _184[0], setSelectedListAddress = _184[1];
-    var _185 = (0, react_1.useState)({}), selectedObjectData = _185[0], setSelectedObjectData = _185[1];
-    var _186 = (0, react_1.useState)(null), objectCellEdit = _186[0], setObjectCellEdit = _186[1];
-    var _187 = (0, react_1.useState)(false), referenceLoading = _187[0], setReferenceLoading = _187[1];
-    var _188 = (0, react_1.useState)({}), referencesOptions = _188[0], setReferencesOptions = _188[1];
-    var _189 = (0, react_1.useState)({}), referencesDetails = _189[0], setReferencesDetails = _189[1];
-    var _190 = (0, react_1.useState)({}), listReferencesOptions = _190[0], setListReferencesOptions = _190[1];
-    var _191 = (0, react_1.useState)({}), referenceDeleteTableData = _191[0], setReferenceDeleteTableData = _191[1];
-    var _192 = (0, react_1.useState)([]), relatedSections = _192[0], setRelatedSections = _192[1];
-    var _193 = (0, react_1.useState)(0), referenceDeleteIndex = _193[0], setReferenceDeleteIndex = _193[1];
-    var _194 = (0, react_1.useState)({
+    }), selectedListAddress = _186[0], setSelectedListAddress = _186[1];
+    var _187 = (0, react_1.useState)({}), selectedObjectData = _187[0], setSelectedObjectData = _187[1];
+    var _188 = (0, react_1.useState)(null), objectCellEdit = _188[0], setObjectCellEdit = _188[1];
+    var _189 = (0, react_1.useState)(false), referenceLoading = _189[0], setReferenceLoading = _189[1];
+    var _190 = (0, react_1.useState)({}), referencesOptions = _190[0], setReferencesOptions = _190[1];
+    var _191 = (0, react_1.useState)({}), referencesDetails = _191[0], setReferencesDetails = _191[1];
+    var _192 = (0, react_1.useState)({}), listReferencesOptions = _192[0], setListReferencesOptions = _192[1];
+    var _193 = (0, react_1.useState)({}), referenceDeleteTableData = _193[0], setReferenceDeleteTableData = _193[1];
+    var _194 = (0, react_1.useState)([]), relatedSections = _194[0], setRelatedSections = _194[1];
+    var _195 = (0, react_1.useState)(0), referenceDeleteIndex = _195[0], setReferenceDeleteIndex = _195[1];
+    var _196 = (0, react_1.useState)({
         id: "",
         name: "",
         type: "string",
-    }), referenceCreationModal = _194[0], setReferenceCreationModal = _194[1];
-    var _195 = (0, react_1.useState)({}), referenceModelSchema = _195[0], setReferenceSchema = _195[1];
-    var _196 = (0, react_1.useState)([]), kanbanChecked = _196[0], setKanbanChecked = _196[1];
+    }), referenceCreationModal = _196[0], setReferenceCreationModal = _196[1];
+    var _197 = (0, react_1.useState)({}), referenceModelSchema = _197[0], setReferenceSchema = _197[1];
+    var _198 = (0, react_1.useState)([]), kanbanChecked = _198[0], setKanbanChecked = _198[1];
     //INFO : Offline
-    var _197 = (0, react_1.useState)(0), offlineDataLength = _197[0], setOfflineDataLength = _197[1];
-    var _198 = (0, react_1.useState)(false), offlineModal = _198[0], setOfflineModal = _198[1];
+    var _199 = (0, react_1.useState)(0), offlineDataLength = _199[0], setOfflineDataLength = _199[1];
+    var _200 = (0, react_1.useState)(false), offlineModal = _200[0], setOfflineModal = _200[1];
     // INFO: live-stream state — driven by socket connection and navigator.onLine
-    var _199 = (0, react_1.useState)(false), isLive = _199[0], setIsLive = _199[1];
-    var _200 = (0, react_1.useState)(false), isLiveOffline = _200[0], setIsLiveOffline = _200[1];
+    var _201 = (0, react_1.useState)(false), isLive = _201[0], setIsLive = _201[1];
+    var _202 = (0, react_1.useState)(false), isLiveOffline = _202[0], setIsLiveOffline = _202[1];
     // INFO: true when navigator is offline — used to switch ReadQueryHoc between
     // server reads (online, full pagination) and IndexedDB reads (offline, cached data).
     // Independent of SSE status so it works even when bareSocketName is not set.
-    var _201 = (0, react_1.useState)(typeof navigator !== "undefined" ? !navigator.onLine : false), isNetworkOffline = _201[0], setIsNetworkOffline = _201[1];
+    var _203 = (0, react_1.useState)(typeof navigator !== "undefined" ? !navigator.onLine : false), isNetworkOffline = _203[0], setIsNetworkOffline = _203[1];
     var previousType = (0, react_1.useRef)(null);
     var previousSelectedData = (0, react_1.useRef)(null);
     var scrollSentinelRef = (0, react_1.useRef)(null);
@@ -785,7 +789,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
     var isSchemaHideMode = ((_10 = props.organise) === null || _10 === void 0 ? void 0 : _10.onChangeHide) ? true : false;
     // INFO: rows per page is a view setting the user can change, so it starts from
     // the persisted value and falls back to the consumer's limit
-    var _202 = (0, react_1.useState)((_12 = (_11 = (isPersistEnabled ? persistedState === null || persistedState === void 0 ? void 0 : persistedState.pageLimit : undefined)) !== null && _11 !== void 0 ? _11 : props.limit) !== null && _12 !== void 0 ? _12 : 10), pageLimit = _202[0], setPageLimit = _202[1];
+    var _204 = (0, react_1.useState)((_12 = (_11 = (isPersistEnabled ? persistedState === null || persistedState === void 0 ? void 0 : persistedState.pageLimit : undefined)) !== null && _11 !== void 0 ? _11 : props.limit) !== null && _12 !== void 0 ? _12 : 10), pageLimit = _204[0], setPageLimit = _204[1];
     var limit = pageLimit;
     var isSavedViewsEnabled = !!((_13 = props.organise) === null || _13 === void 0 ? void 0 : _13.savedViews) && resolvedType === "list";
     // INFO: an app that stores views takes over from this browser's storage, so
@@ -810,18 +814,84 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
         setCursor("");
         setLastCursor("");
     };
-    var _203 = (0, permissions_1.handleResolveDataTemplateWritePermissions)(props.edit), canUpdateRecord = _203.canUpdateRecord, canInlineUpdate = _203.canInlineUpdate, canBatchUpdate = _203.canBatchUpdate, canDeleteRecord = _203.canDeleteRecord;
-    var isEditor = ((_17 = props.edit) === null || _17 === void 0 ? void 0 : _17.allEditable) ? true : false;
-    var isOffline = (_18 = props.bareSettings) === null || _18 === void 0 ? void 0 : _18.bareOffline;
+    //=====================================================================================
+    //SECTION: Formula columns — sorted and filtered on their computed value
+    //=====================================================================================
+    // INFO: a formula has no stored field, so a server sort or filter on one
+    // matches nothing. monday sorts and filters a formula on the value it shows,
+    // so the list does the same: the request leaves the formula out, reads every
+    // matching row, and the rows are filtered and ordered here. Only
+    // type "formula" columns take part — math columns behave as they always have.
+    var formulaColumnIds = structure
+        .filter(function (eachModel) { return eachModel.type === "formula"; })
+        .map(function (eachModel) { return eachModel.id; });
+    // INFO: Firebase pages by document cursor and a union by skip, so neither
+    // can hand over the whole set — there formula columns are not offered for
+    // sorting or filtering, rather than ordering one page
+    var isFormulaViewSupported = !isFirebase && !((_18 = (_17 = props.organise) === null || _17 === void 0 ? void 0 : _17.unionCollections) === null || _18 === void 0 ? void 0 : _18.length);
+    var formulaSort = isFormulaViewSupported &&
+        (activeSortId === null || activeSortId === void 0 ? void 0 : activeSortId.sortId) &&
+        formulaColumnIds.includes(activeSortId.sortId)
+        ? activeSortId
+        : undefined;
+    var formulaFlexQueries = isFormulaViewSupported && formulaColumnIds.length > 0
+        ? (0, listModule_1.renderFlexFilterConditions)(flexFiltersDebounced, structure).filter(function (eachQuery) { var _a; return formulaColumnIds.includes((_a = eachQuery.queryId) !== null && _a !== void 0 ? _a : ""); })
+        : [];
+    var isFormulaView = !!formulaSort || formulaFlexQueries.length > 0;
+    // INFO: the columns the flex filters offer — formulas only where they can
+    // be filtered on
+    var flexFilterStructure = isFormulaViewSupported
+        ? structure
+        : structure.filter(function (eachModel) { return eachModel.type !== "formula"; });
+    // INFO: every matching row of a formula view, unsorted — pages are cut
+    // from it locally, so paging does not read the collection again
+    // INFO: the formula sort and filter the row cap was last announced for
+    var formulaCapNoticeRef = (0, react_1.useRef)("");
+    var formulaFullReadRef = (0, react_1.useRef)(null);
+    var handleApplyFormulaView = function (rows, displayRows) {
+        if (!isFormulaView)
+            return { rows: rows, displayRows: displayRows };
+        var entries = rows.map(function (eachRow, index) { return ({
+            row: eachRow,
+            displayRow: displayRows[index],
+            results: (0, formula_1.handleEvaluateFormulaRow)(eachRow, displayRows[index], structure),
+        }); });
+        var filtered = entries.filter(function (eachEntry) {
+            return formulaFlexQueries.every(function (eachQuery) {
+                var _a;
+                return (0, formula_1.handleMatchFormulaQuery)(eachEntry.results[(_a = eachQuery.queryId) !== null && _a !== void 0 ? _a : ""], eachQuery);
+            });
+        });
+        if (formulaSort) {
+            var direction_1 = formulaSort.type === "asc" ? 1 : -1;
+            filtered.sort(function (a, b) {
+                var aResult = a.results[formulaSort.sortId];
+                var bResult = b.results[formulaSort.sortId];
+                var aEmpty = (0, formula_1.handleIsFormulaEmpty)(aResult);
+                var bEmpty = (0, formula_1.handleIsFormulaEmpty)(bResult);
+                // INFO: blanks and errors sink to the bottom in either direction
+                if (aEmpty || bEmpty)
+                    return aEmpty === bEmpty ? 0 : aEmpty ? 1 : -1;
+                return direction_1 * (0, formula_1.handleCompareFormulaResults)(aResult, bResult);
+            });
+        }
+        return {
+            rows: filtered.map(function (eachEntry) { return eachEntry.row; }),
+            displayRows: filtered.map(function (eachEntry) { return eachEntry.displayRow; }),
+        };
+    };
+    var _205 = (0, permissions_1.handleResolveDataTemplateWritePermissions)(props.edit), canUpdateRecord = _205.canUpdateRecord, canInlineUpdate = _205.canInlineUpdate, canBatchUpdate = _205.canBatchUpdate, canDeleteRecord = _205.canDeleteRecord;
+    var isEditor = ((_19 = props.edit) === null || _19 === void 0 ? void 0 : _19.allEditable) ? true : false;
+    var isOffline = (_20 = props.bareSettings) === null || _20 === void 0 ? void 0 : _20.bareOffline;
     // INFO: when bareOfflineNetworkAware is true, the save path is also gated on
     // the live network state — online saves go to the server even if bareOffline
     // is true, offline saves go to IDB as normal.
-    var isOfflineNetworkListener = isOffline && ((_19 = props.bareSettings) === null || _19 === void 0 ? void 0 : _19.bareOfflineNetworkListener);
-    var showId = (_20 = props.space) === null || _20 === void 0 ? void 0 : _20.showId;
+    var isOfflineNetworkListener = isOffline && ((_21 = props.bareSettings) === null || _21 === void 0 ? void 0 : _21.bareOfflineNetworkListener);
+    var showId = (_22 = props.space) === null || _22 === void 0 ? void 0 : _22.showId;
     var remainId = showId || selectedObjectStructureId ? true : false;
-    var idField = ((_21 = props.space) === null || _21 === void 0 ? void 0 : _21.idField) || ((_22 = props.organise) === null || _22 === void 0 ? void 0 : _22.idField);
-    var pipeline = (_23 = props === null || props === void 0 ? void 0 : props.space) === null || _23 === void 0 ? void 0 : _23.pipeline;
-    if ((_24 = props.bareSettings) === null || _24 === void 0 ? void 0 : _24.bareListPipeline) {
+    var idField = ((_23 = props.space) === null || _23 === void 0 ? void 0 : _23.idField) || ((_24 = props.organise) === null || _24 === void 0 ? void 0 : _24.idField);
+    var pipeline = (_25 = props === null || props === void 0 ? void 0 : props.space) === null || _25 === void 0 ? void 0 : _25.pipeline;
+    if ((_26 = props.bareSettings) === null || _26 === void 0 ? void 0 : _26.bareListPipeline) {
         pipeline = pipeline
             ? __spreadArray(__spreadArray([], pipeline, true), props.bareSettings.bareListPipeline, true) : props.bareSettings.bareListPipeline;
     }
@@ -834,24 +904,24 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
      * three records came back instead of five files, and each tile received the
      * whole array rather than one file, so every one of them read "Attachment".
      */
-    var fileViewColumnId = (_28 = (_27 = ((_26 = (_25 = props.organise) === null || _25 === void 0 ? void 0 : _25.extendedTabs) !== null && _26 !== void 0 ? _26 : []).find(function (eachTab) {
+    var fileViewColumnId = (_30 = (_29 = ((_28 = (_27 = props.organise) === null || _27 === void 0 ? void 0 : _27.extendedTabs) !== null && _28 !== void 0 ? _28 : []).find(function (eachTab) {
         return eachTab.viewType === "file" &&
             (0, utils_1.lowercaseTextToId)(eachTab.name) === viewType;
-    })) === null || _27 === void 0 ? void 0 : _27.fileSettings) === null || _28 === void 0 ? void 0 : _28.columnId;
-    var hasNavigation = ((_29 = props.organise) === null || _29 === void 0 ? void 0 : _29.handleNavigate) ? true : false;
+    })) === null || _29 === void 0 ? void 0 : _29.fileSettings) === null || _30 === void 0 ? void 0 : _30.columnId;
+    var hasNavigation = ((_31 = props.organise) === null || _31 === void 0 ? void 0 : _31.handleNavigate) ? true : false;
     var formColumn = "grid-cols-12";
-    var useMobileView = (_31 = (_30 = props.bareSettings) === null || _30 === void 0 ? void 0 : _30.bareUpdateMobileView) !== null && _31 !== void 0 ? _31 : false;
+    var useMobileView = (_33 = (_32 = props.bareSettings) === null || _32 === void 0 ? void 0 : _32.bareUpdateMobileView) !== null && _33 !== void 0 ? _33 : false;
     var gridGap = useMobileView ? "gap-x-6 gap-y-2 md:gap-y-6" : "gap-6";
-    var isActivityLog = (((_33 = (_32 = props.edit) === null || _32 === void 0 ? void 0 : _32.activityLog) === null || _33 === void 0 ? void 0 : _33.enableComments) &&
-        ((_34 = props.edit) === null || _34 === void 0 ? void 0 : _34.activityLog.commentCollectionId)) ||
-        (((_36 = (_35 = props.edit) === null || _35 === void 0 ? void 0 : _35.activityLog) === null || _36 === void 0 ? void 0 : _36.enableLogs) &&
-            ((_37 = props.edit) === null || _37 === void 0 ? void 0 : _37.activityLog.logsCollectionId));
-    var customPaginationSize = ((_38 = props.organise) === null || _38 === void 0 ? void 0 : _38.customPaginationCount)
+    var isActivityLog = (((_35 = (_34 = props.edit) === null || _34 === void 0 ? void 0 : _34.activityLog) === null || _35 === void 0 ? void 0 : _35.enableComments) &&
+        ((_36 = props.edit) === null || _36 === void 0 ? void 0 : _36.activityLog.commentCollectionId)) ||
+        (((_38 = (_37 = props.edit) === null || _37 === void 0 ? void 0 : _37.activityLog) === null || _38 === void 0 ? void 0 : _38.enableLogs) &&
+            ((_39 = props.edit) === null || _39 === void 0 ? void 0 : _39.activityLog.logsCollectionId));
+    var customPaginationSize = ((_40 = props.organise) === null || _40 === void 0 ? void 0 : _40.customPaginationCount)
         ? props.organise.customPaginationCount(size)
         : undefined;
     //TODO : Code - Pass ...devSettings, search dbEndpoint:
     var writeServerQuery = new writeQuery_1.WriteQuery({
-        dbModule: (_39 = props.lib) === null || _39 === void 0 ? void 0 : _39.axios,
+        dbModule: (_41 = props.lib) === null || _41 === void 0 ? void 0 : _41.axios,
         dbType: devSettings.server,
         dbCollection: props.collectionId,
         dbEndpoint: devSettings.dbEndpoint,
@@ -859,7 +929,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
         dbUserToken: devSettings.dbUserToken,
     });
     var readServerQuery = new readQuery_1.ReadQuery({
-        dbModule: (_40 = props.lib) === null || _40 === void 0 ? void 0 : _40.axios,
+        dbModule: (_42 = props.lib) === null || _42 === void 0 ? void 0 : _42.axios,
         dbType: devSettings.server,
         dbCollection: props.collectionId,
         dbEndpoint: devSettings.dbEndpoint,
@@ -867,12 +937,12 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
         dbUserToken: devSettings.dbUserToken,
     });
     var moreButtonPopUp = [
-        ((_41 = props.edit) === null || _41 === void 0 ? void 0 : _41.allEditable) &&
+        ((_43 = props.edit) === null || _43 === void 0 ? void 0 : _43.allEditable) &&
             // INFO: the import runs on the server (importEndpoint), so a Firestore
             // datasheet served through one can import; only the browser-direct
             // Firebase client has no server to import through
             !isFirebaseClient &&
-            !((_43 = (_42 = props.organise) === null || _42 === void 0 ? void 0 : _42.exportSettings) === null || _43 === void 0 ? void 0 : _43.hideImportCSV)
+            !((_45 = (_44 = props.organise) === null || _44 === void 0 ? void 0 : _44.exportSettings) === null || _45 === void 0 ? void 0 : _45.hideImportCSV)
             ? {
                 text: "Import Excel",
                 onClick: function () {
@@ -881,7 +951,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                 },
             }
             : null,
-        !((_45 = (_44 = props.organise) === null || _44 === void 0 ? void 0 : _44.exportSettings) === null || _45 === void 0 ? void 0 : _45.hideExportCSV)
+        !((_47 = (_46 = props.organise) === null || _46 === void 0 ? void 0 : _46.exportSettings) === null || _47 === void 0 ? void 0 : _47.hideExportCSV)
             ? {
                 text: "Export CSV",
                 onClick: function () {
@@ -891,7 +961,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                 },
             }
             : null,
-        !((_47 = (_46 = props.organise) === null || _46 === void 0 ? void 0 : _46.exportSettings) === null || _47 === void 0 ? void 0 : _47.hideExportExcel)
+        !((_49 = (_48 = props.organise) === null || _48 === void 0 ? void 0 : _48.exportSettings) === null || _49 === void 0 ? void 0 : _49.hideExportExcel)
             ? {
                 text: "Export Excel",
                 onClick: function () {
@@ -901,7 +971,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                 },
             }
             : null,
-        !((_49 = (_48 = props.organise) === null || _48 === void 0 ? void 0 : _48.exportSettings) === null || _49 === void 0 ? void 0 : _49.hideExportPDF)
+        !((_51 = (_50 = props.organise) === null || _50 === void 0 ? void 0 : _50.exportSettings) === null || _51 === void 0 ? void 0 : _51.hideExportPDF)
             ? {
                 text: "Export PDF",
                 onClick: function () {
@@ -911,7 +981,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                 },
             }
             : null,
-        !((_51 = (_50 = props.organise) === null || _50 === void 0 ? void 0 : _50.exportSettings) === null || _51 === void 0 ? void 0 : _51.hideExportQR)
+        !((_53 = (_52 = props.organise) === null || _52 === void 0 ? void 0 : _52.exportSettings) === null || _53 === void 0 ? void 0 : _53.hideExportQR)
             ? {
                 text: "Export QR",
                 onClick: function () {
@@ -921,7 +991,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                 },
             }
             : null,
-        !((_53 = (_52 = props.organise) === null || _52 === void 0 ? void 0 : _52.exportSettings) === null || _53 === void 0 ? void 0 : _53.hideExportQR)
+        !((_55 = (_54 = props.organise) === null || _54 === void 0 ? void 0 : _54.exportSettings) === null || _55 === void 0 ? void 0 : _55.hideExportQR)
             ? {
                 text: "Export QR(Data)",
                 onClick: function () {
@@ -931,7 +1001,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                 },
             }
             : null,
-        !((_55 = (_54 = props.organise) === null || _54 === void 0 ? void 0 : _54.exportSettings) === null || _55 === void 0 ? void 0 : _55.hideExportPrint)
+        !((_57 = (_56 = props.organise) === null || _56 === void 0 ? void 0 : _56.exportSettings) === null || _57 === void 0 ? void 0 : _57.hideExportPrint)
             ? {
                 text: "Print",
                 onClick: function () {
@@ -941,7 +1011,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                 },
             }
             : null,
-        !((_57 = (_56 = props.organise) === null || _56 === void 0 ? void 0 : _56.exportSettings) === null || _57 === void 0 ? void 0 : _57.hideExportDraft)
+        !((_59 = (_58 = props.organise) === null || _58 === void 0 ? void 0 : _58.exportSettings) === null || _59 === void 0 ? void 0 : _59.hideExportDraft)
             ? {
                 text: filterDraft ? "Show All Items" : "Filter Draft",
                 onClick: function () {
@@ -950,7 +1020,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
             }
             : null,
     ].filter(Boolean);
-    if ((_58 = props.organise) === null || _58 === void 0 ? void 0 : _58.moreSettings)
+    if ((_60 = props.organise) === null || _60 === void 0 ? void 0 : _60.moreSettings)
         moreButtonPopUp = moreButtonPopUp.concat(props.organise.moreSettings);
     //=====================================================================================
     //SECTION: User Column Visibility Handlers
@@ -1186,7 +1256,9 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
         }, additionalQuery !== null && additionalQuery !== void 0 ? additionalQuery : [], (_a = props.bareSettings) === null || _a === void 0 ? void 0 : _a.bareListFilterQuery, selectedTab);
         // INFO: Merge flex filter conditions into the query array (uses debounced state to avoid API calls on every keystroke)
         if (flexFiltersDebounced.length > 0) {
-            var flexQuery = (0, listModule_1.renderFlexFilterConditions)(flexFiltersDebounced, structure);
+            // INFO: formula conditions never reach the server — the field is not
+            // stored — and are applied to the rows by handleApplyFormulaView
+            var flexQuery = (0, listModule_1.renderFlexFilterConditions)(flexFiltersDebounced, structure).filter(function (eachQuery) { var _a; return !formulaColumnIds.includes((_a = eachQuery.queryId) !== null && _a !== void 0 ? _a : ""); });
             if (flexQuery.length > 0) {
                 if (query) {
                     query = __spreadArray(__spreadArray([], query, true), flexQuery, true);
@@ -1261,7 +1333,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
     //=====================================================================================
     //SECTION: Saved Views
     //=====================================================================================
-    var savedViewsKey = (0, viewStatePersistence_1.buildSavedViewsKey)(props.collectionId, (_59 = props.organise) === null || _59 === void 0 ? void 0 : _59.persistKey, (_60 = devSettings.currentUser) === null || _60 === void 0 ? void 0 : _60.userEmail);
+    var savedViewsKey = (0, viewStatePersistence_1.buildSavedViewsKey)(props.collectionId, (_61 = props.organise) === null || _61 === void 0 ? void 0 : _61.persistKey, (_62 = devSettings.currentUser) === null || _62 === void 0 ? void 0 : _62.userEmail);
     (0, react_1.useEffect)(function () {
         if (isSavedViewsEnabled && !isAppViews)
             setSavedViews((0, viewStatePersistence_1.handleReadSavedViews)(savedViewsKey));
@@ -1316,7 +1388,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
     var lastSentSharedViewsRef = (0, react_1.useRef)(null);
     (0, react_1.useEffect)(function () {
         lastSentSharedViewsRef.current = null;
-    }, [(_61 = props.organise) === null || _61 === void 0 ? void 0 : _61.sharedViews]);
+    }, [(_63 = props.organise) === null || _63 === void 0 ? void 0 : _63.sharedViews]);
     var handleStoreSharedViews = function (update) {
         var _a, _b, _c;
         if (!((_a = props.organise) === null || _a === void 0 ? void 0 : _a.onChangeSharedViews))
@@ -1352,13 +1424,13 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
         /* eslint-disable */
     }, [
         isSavedViewsEnabled,
-        (_62 = props.organise) === null || _62 === void 0 ? void 0 : _62.initialSavedViewId,
-        (_63 = props.organise) === null || _63 === void 0 ? void 0 : _63.defaultSavedViewId,
-        (_64 = props.organise) === null || _64 === void 0 ? void 0 : _64.sharedViews,
+        (_64 = props.organise) === null || _64 === void 0 ? void 0 : _64.initialSavedViewId,
+        (_65 = props.organise) === null || _65 === void 0 ? void 0 : _65.defaultSavedViewId,
+        (_66 = props.organise) === null || _66 === void 0 ? void 0 : _66.sharedViews,
         savedViews,
     ]);
     /* eslint-enable */
-    var defaultSavedViewIds = ((_66 = (_65 = props.organise) === null || _65 === void 0 ? void 0 : _65.defaultSavedViews) !== null && _66 !== void 0 ? _66 : [])
+    var defaultSavedViewIds = ((_68 = (_67 = props.organise) === null || _67 === void 0 ? void 0 : _67.defaultSavedViews) !== null && _68 !== void 0 ? _68 : [])
         .map(function (eachView) { var _a; return (_a = eachView.id) !== null && _a !== void 0 ? _a : ""; })
         .join("|");
     // INFO: keyed on the ids, not the array, so an inline literal passed on every
@@ -1623,7 +1695,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
         var isOtherListReturn = !(0, viewStatePersistence_1.handleIsLastDrill)(props.collectionId, (_c = props.organise) === null || _c === void 0 ? void 0 : _c.persistKey);
         scrollRestoredRef.current = isSwitch || isOtherListReturn;
         /* eslint-disable */
-    }, [props.collectionId, (_67 = props.organise) === null || _67 === void 0 ? void 0 : _67.persistKey]);
+    }, [props.collectionId, (_69 = props.organise) === null || _69 === void 0 ? void 0 : _69.persistKey]);
     /* eslint-enable */
     // INFO: wait a frame — rows land in state one tick before layout
     (0, react_1.useEffect)(function () {
@@ -1658,7 +1730,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
     (0, react_1.useEffect)(function () {
         handleOfflinePrefetch();
         /* eslint-disable */
-    }, [props.collectionId, (_68 = props.bareSettings) === null || _68 === void 0 ? void 0 : _68.bareOffline]);
+    }, [props.collectionId, (_70 = props.bareSettings) === null || _70 === void 0 ? void 0 : _70.bareOffline]);
     /* eslint-enable */
     // INFO: MRQ polling — calls handleRefresh every N ms (e.g. 1500) as a fallback.
     // Calls through handleRefreshRef so the interval always dispatches the latest
@@ -1678,7 +1750,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
         }, interval);
         return function () { return clearInterval(timer); };
         /* eslint-disable */
-    }, [(_69 = props.bareSettings) === null || _69 === void 0 ? void 0 : _69.barePollingInterval, isLive, isNetworkOffline]);
+    }, [(_71 = props.bareSettings) === null || _71 === void 0 ? void 0 : _71.barePollingInterval, isLive, isNetworkOffline]);
     /* eslint-enable */
     // INFO: Pub/Sub → SSE live-stream — driven by bareSettings.bareSocketName
     // EventSource URL: {sseEndpoint}/{room}?bm_apiToken={token}
@@ -1720,7 +1792,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
         };
         /* eslint-disable */
     }, [
-        (_70 = props.bareSettings) === null || _70 === void 0 ? void 0 : _70.bareSocketName,
+        (_72 = props.bareSettings) === null || _72 === void 0 ? void 0 : _72.bareSocketName,
         props.collectionId,
         props.devSettings.sseEndpoint,
         props.devSettings.dbAPIToken,
@@ -1980,10 +2052,10 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
         props.collectionId,
         props.model,
         props.localURLEndpoint,
-        (_71 = props.organise) === null || _71 === void 0 ? void 0 : _71.extendedTabs,
-        (_72 = props.organise) === null || _72 === void 0 ? void 0 : _72.viewId,
-        (_73 = props.organise) === null || _73 === void 0 ? void 0 : _73.additionalQuery,
-        (_74 = props.organise) === null || _74 === void 0 ? void 0 : _74.groupBy,
+        (_73 = props.organise) === null || _73 === void 0 ? void 0 : _73.extendedTabs,
+        (_74 = props.organise) === null || _74 === void 0 ? void 0 : _74.viewId,
+        (_75 = props.organise) === null || _75 === void 0 ? void 0 : _75.additionalQuery,
+        (_76 = props.organise) === null || _76 === void 0 ? void 0 : _76.groupBy,
         resolvedType,
     ]);
     /**
@@ -2124,7 +2196,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
             };
         }, 100);
         return function () { return clearTimeout(timeoutId); };
-    }, [(_75 = props.organise) === null || _75 === void 0 ? void 0 : _75.showReadFloatingNav, resolvedType, props.id, loading]);
+    }, [(_77 = props.organise) === null || _77 === void 0 ? void 0 : _77.showReadFloatingNav, resolvedType, props.id, loading]);
     (0, react_1.useEffect)(function () {
         if (resolvedType !== "read")
             return;
@@ -2604,7 +2676,10 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
     };
     var handleReadQueryHocSort = function (query) {
         // INFO: Use persisted sort when persistViewState is active, otherwise fall back to prop sort
-        var sort = activeSortId || undefined;
+        // INFO: a formula sort is applied to the rows, so the server gets none
+        var sort = (activeSortId === null || activeSortId === void 0 ? void 0 : activeSortId.sortId) && formulaColumnIds.includes(activeSortId.sortId)
+            ? undefined
+            : activeSortId || undefined;
         if (isFirebase) {
             // INFO: Firestore requires the first orderBy to match the range/startAt
             // field, so a search query always forces the sort onto the search column
@@ -2779,8 +2854,123 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
             cond.skip = (0, unionPagination_1.handleGetUnionPageSkip)(pageIndex, limit);
             cond.sort = (0, unionPagination_1.handleBuildUnionPageSort)(handleReadQueryHocSort(query));
         }
+        // INFO: sorting or filtering on a formula reads the matching rows, as
+        // monday orders the whole board and not just the page on screen — up to
+        // FORMULA_VIEW_MAX_ROWS, so one header click cannot pull a whole large
+        // collection into the browser. The cursor is left out so paging cuts from
+        // the rows already read.
+        if (isFormulaView) {
+            cond.limit = exports.FORMULA_VIEW_MAX_ROWS;
+            cond.stopLimit = undefined;
+            cond.cursor = undefined;
+            cond.skip = 0;
+            // INFO: past the cap the server picks which rows come back, so a fixed
+            // order keeps those rows the same from one read to the next
+            if (!cond.sort)
+                cond.sort = { sortId: serverId, type: "asc" };
+        }
         return cond;
     };
+    // INFO: views that draw every row at once rather than a page of them — the
+    // same views handleReadQueryHocCond reads in full
+    var handleCheckFullSetView = function () {
+        var _a;
+        return (!!selectedTab &&
+            (selectedTab.viewType === "calendar" ||
+                selectedTab.viewType === "map" ||
+                selectedTab.viewType === "timeline")) ||
+            (!!groupId && !((_a = props.bareSettings) === null || _a === void 0 ? void 0 : _a.bareNewDTW));
+    };
+    var handleShowFormulaPage = function (index) {
+        var _a;
+        var cached = formulaFullReadRef.current;
+        if (!cached)
+            return;
+        var view = handleApplyFormulaView(cached.rows, cached.displayRows);
+        // INFO: page mode shows one page at a time, and so does NewTable in
+        // cursor mode — it draws whatever rows it is given, where the legacy
+        // Table cuts cursor pages itself. Scroll mode holds every row. A calendar,
+        // map, timeline or legacy grouped list draws every row, so it is never cut.
+        var paginationType = renderResolvedPaginationType();
+        if (!handleCheckFullSetView() &&
+            (paginationType === "page" ||
+                (paginationType === "cursor" && !!((_a = props.bareSettings) === null || _a === void 0 ? void 0 : _a.bareNewDTW)))) {
+            var start = index * limit;
+            handleSetListData(view.rows.slice(start, start + limit), view.displayRows.slice(start, start + limit));
+        }
+        else {
+            handleSetListData(view.rows, view.displayRows);
+            setCursor("");
+        }
+        setSize(view.rows.length);
+        setTableLoading(false);
+    };
+    // INFO: adding or changing a formula changes no stored value, so nothing is
+    // read again — the formula cells on screen are worked out afresh, as a
+    // monday formula updates the moment it is set
+    var formulaSignature = JSON.stringify(structure
+        .filter(function (eachModel) { return eachModel.type === "formula"; })
+        .map(function (eachModel) { return [eachModel.id, eachModel.formulaExpression]; }));
+    var previousFormulaSignatureRef = (0, react_1.useRef)(formulaSignature);
+    (0, react_1.useEffect)(function () {
+        if (previousFormulaSignatureRef.current === formulaSignature)
+            return;
+        previousFormulaSignatureRef.current = formulaSignature;
+        var handleRecomputeCells = function (rows, displayRows) {
+            return displayRows.map(function (eachDisplayRow, index) {
+                if (!eachDisplayRow || !rows[index])
+                    return eachDisplayRow;
+                var nextDisplayRow = __assign({}, eachDisplayRow);
+                var results = (0, formula_1.handleEvaluateFormulaRow)(rows[index], eachDisplayRow, structure);
+                Object.entries(results).forEach(function (_a) {
+                    var columnId = _a[0], result = _a[1];
+                    nextDisplayRow[columnId] = (0, formula_1.handleFormatFormulaValue)(result);
+                });
+                return nextDisplayRow;
+            });
+        };
+        var cached = formulaFullReadRef.current;
+        if (cached) {
+            cached.displayRows = handleRecomputeCells(cached.rows, cached.displayRows);
+            handleShowFormulaPage(pageIndex);
+            return;
+        }
+        if (tableDataRef.current.length === 0)
+            return;
+        handleSetListData(tableDataRef.current, handleRecomputeCells(tableDataRef.current, spaceTableDataRef.current));
+        /* eslint-disable */
+    }, [formulaSignature]);
+    /* eslint-enable */
+    // INFO: the read request of the previous render. A formula sort or filter
+    // is not part of the request, so on a view that already reads every row
+    // (calendar, map, timeline, legacy grouped) turning one on changes nothing
+    // the reader would see — then the read is asked for here.
+    var formulaCondKeyRef = (0, react_1.useRef)("");
+    (0, react_1.useEffect)(function () {
+        var _a;
+        if (formulaFullReadRef.current) {
+            // INFO: a page, page-size or formula change needs no new read — the
+            // matching rows are already held
+            handleShowFormulaPage(pageIndex);
+        }
+        else if (isFormulaView &&
+            formulaCondKeyRef.current === JSON.stringify(handleReadQueryHocCond())) {
+            (_a = listRQueryHocRef.current) === null || _a === void 0 ? void 0 : _a.handleRefresh();
+        }
+        /* eslint-disable */
+    }, [
+        pageIndex,
+        limit,
+        JSON.stringify(formulaSort !== null && formulaSort !== void 0 ? formulaSort : null),
+        JSON.stringify(formulaFlexQueries),
+    ]);
+    /* eslint-enable */
+    (0, react_1.useEffect)(function () {
+        // INFO: a table without formula columns does no formula bookkeeping
+        if (formulaColumnIds.length === 0)
+            return;
+        formulaCondKeyRef.current = JSON.stringify(handleReadQueryHocCond());
+    });
     var handleSelectIds = function (selectedIds) {
         var _a;
         setSelectedIds(selectedIds);
@@ -2914,16 +3104,16 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
         }
     };
     var handleGetListData = function (responseData, type, rowId, requestCond) { return __awaiter(void 0, void 0, void 0, function () {
-        var dataList, prettierDataList, clonedTableData, clonedSpaceTableData, dummyPrettierDataList_1, resolvedData, selectedIndex_1, isScrollMode, newTableData, newPrettierTableData, isFirstPage, listedIds_1, newIndexes, isExists, cursorResp, lastDataId, err_1;
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
-        return __generator(this, function (_l) {
-            switch (_l.label) {
+        var dataList, prettierDataList, clonedTableData, clonedSpaceTableData, dummyPrettierDataList_1, resolvedData, selectedIndex_1, cachedFormulaRows, cachedIndex, capKey, isScrollMode, newTableData, newPrettierTableData, isFirstPage, listedIds_1, newIndexes, isExists, cursorResp, lastDataId, err_1;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
+        return __generator(this, function (_p) {
+            switch (_p.label) {
                 case 0:
                     dataList = [];
                     prettierDataList = [];
-                    _l.label = 1;
+                    _p.label = 1;
                 case 1:
-                    _l.trys.push([1, 7, , 8]);
+                    _p.trys.push([1, 7, , 8]);
                     clonedTableData = __spreadArray([], tableDataRef.current, true);
                     clonedSpaceTableData = __spreadArray([], spaceTableDataRef.current, true);
                     if (!(responseData === null || responseData === void 0 ? void 0 : responseData.data)) return [3 /*break*/, 6];
@@ -2931,7 +3121,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                     dummyPrettierDataList_1 = [];
                     return [4 /*yield*/, handleResolveOfflineReferences(responseData.data)];
                 case 2:
-                    resolvedData = _l.sent();
+                    resolvedData = _p.sent();
                     resolvedData.map(function (eachData) {
                         var _a, _b;
                         var tempData = eachData;
@@ -2943,7 +3133,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                     return [3 /*break*/, 5];
                 case 3: return [4 /*yield*/, (0, listModule_1.handleListDataBasedOnModel)(responseData === null || responseData === void 0 ? void 0 : responseData.data, props.devSettings, (_b = props.lib) === null || _b === void 0 ? void 0 : _b.axios, structure, (_c = props.organise) === null || _c === void 0 ? void 0 : _c.handleNavigate, setActivityModal, setActivityId, isActivityLog ? (_d = props.edit) === null || _d === void 0 ? void 0 : _d.activityLog : undefined, (_e = props.bareSettings) === null || _e === void 0 ? void 0 : _e.bareListActionBtns, !canUpdateRecord, undefined, handleSeedListReferenceOptions)];
                 case 4:
-                    prettierDataList = _l.sent();
+                    prettierDataList = _p.sent();
                     if (props.groupId) {
                         prettierDataList.forEach(function (item, idx) {
                             var _a, _b;
@@ -2952,7 +3142,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                             }
                         });
                     }
-                    _l.label = 5;
+                    _p.label = 5;
                 case 5:
                     (_f = responseData === null || responseData === void 0 ? void 0 : responseData.data) === null || _f === void 0 ? void 0 : _f.map(function (eachData, eachIndex) {
                         if (eachData["_id"]) {
@@ -2978,7 +3168,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                         return null;
                     });
                     dataList = responseData.data;
-                    _l.label = 6;
+                    _p.label = 6;
                 case 6:
                     if (type === "update" || type === "create") {
                         try {
@@ -2998,15 +3188,54 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                                 clonedTableData.push((_h = responseData === null || responseData === void 0 ? void 0 : responseData.data) === null || _h === void 0 ? void 0 : _h[0]);
                                 clonedSpaceTableData.push(prettierDataList === null || prettierDataList === void 0 ? void 0 : prettierDataList[0]);
                             }
-                            handleSetListData(clonedTableData, clonedSpaceTableData);
+                            cachedFormulaRows = formulaFullReadRef.current;
+                            if (cachedFormulaRows) {
+                                cachedIndex = cachedFormulaRows.rows.findIndex(function (eachData) {
+                                    return (eachData === null || eachData === void 0 ? void 0 : eachData.id) === rowId || (eachData === null || eachData === void 0 ? void 0 : eachData.recordId) === rowId;
+                                });
+                                if (type === "update" && cachedIndex > -1) {
+                                    cachedFormulaRows.rows[cachedIndex] = (_j = responseData === null || responseData === void 0 ? void 0 : responseData.data) === null || _j === void 0 ? void 0 : _j[0];
+                                    cachedFormulaRows.displayRows[cachedIndex] =
+                                        prettierDataList === null || prettierDataList === void 0 ? void 0 : prettierDataList[0];
+                                }
+                                else if (type === "create") {
+                                    cachedFormulaRows.rows.push((_k = responseData === null || responseData === void 0 ? void 0 : responseData.data) === null || _k === void 0 ? void 0 : _k[0]);
+                                    cachedFormulaRows.displayRows.push(prettierDataList === null || prettierDataList === void 0 ? void 0 : prettierDataList[0]);
+                                }
+                                handleShowFormulaPage(pageIndex);
+                            }
+                            else
+                                handleSetListData(clonedTableData, clonedSpaceTableData);
                         }
                         catch (err) { }
                     }
+                    else if (isFormulaView &&
+                        (requestCond === null || requestCond === void 0 ? void 0 : requestCond.limit) === exports.FORMULA_VIEW_MAX_ROWS &&
+                        !(requestCond === null || requestCond === void 0 ? void 0 : requestCond.cursor)) {
+                        // INFO: a formula view's read — held, then filtered, ordered and paged
+                        // from here
+                        formulaFullReadRef.current = {
+                            rows: dataList,
+                            displayRows: prettierDataList,
+                        };
+                        handleShowFormulaPage(pageIndex);
+                        capKey = JSON.stringify([formulaSort, formulaFlexQueries]);
+                        if (((_l = responseData.count) !== null && _l !== void 0 ? _l : 0) > dataList.length &&
+                            formulaCapNoticeRef.current !== capKey) {
+                            formulaCapNoticeRef.current = capKey;
+                            setNotification({
+                                type: true,
+                                title: "Sorted and filtered within ".concat(exports.FORMULA_VIEW_MAX_ROWS.toLocaleString("en-US"), " rows"),
+                                msg: "A formula sort or filter reads at most ".concat(exports.FORMULA_VIEW_MAX_ROWS.toLocaleString("en-US"), " of the ").concat(Number(responseData.count).toLocaleString("en-US"), " matching rows."),
+                            });
+                        }
+                    }
                     else {
+                        formulaFullReadRef.current = null;
                         isScrollMode = renderCheckScrollMode();
                         if (!isScrollMode && !isFirebase) {
                             handleSetListData(dataList, prettierDataList);
-                            setSize((_j = responseData.count) !== null && _j !== void 0 ? _j : 0);
+                            setSize((_m = responseData.count) !== null && _m !== void 0 ? _m : 0);
                             if (renderCheckGroupPaging())
                                 handleLoadGroupFirstPages();
                         }
@@ -3066,13 +3295,13 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                             }
                             setCursor(cursorResp);
                             if (isScrollMode && !isFirebase) {
-                                setSize((_k = responseData.count) !== null && _k !== void 0 ? _k : 0);
+                                setSize((_o = responseData.count) !== null && _o !== void 0 ? _o : 0);
                             }
                         }
                     }
                     return [3 /*break*/, 8];
                 case 7:
-                    err_1 = _l.sent();
+                    err_1 = _p.sent();
                     return [3 /*break*/, 8];
                 case 8:
                     // INFO: inline writes update rows too, but do not finish a pending list read.
@@ -6340,7 +6569,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
         });
     }); };
     var handleExportCSVData = function (downloadLinkOnly, printOnly) { return __awaiter(void 0, void 0, void 0, function () {
-        var exportQueryList, baseUrl, apiEndpoint, reqData, res, dataList, csvDownloadLink, notificaitonMsg, err_27;
+        var exportQueryList, formulaRows, kept, baseUrl, apiEndpoint, reqData, res, dataList, csvDownloadLink, notificaitonMsg, err_27;
         var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0;
         return __generator(this, function (_1) {
             switch (_1.label) {
@@ -6352,6 +6581,15 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                         if (props.bareSettings.bareListFilterQuery)
                             exportQueryList.push.apply(exportQueryList, props.bareSettings.bareListFilterQuery);
                     }
+                    formulaRows = formulaFullReadRef.current;
+                    if (formulaFlexQueries.length > 0 && formulaRows) {
+                        kept = handleApplyFormulaView(formulaRows.rows, formulaRows.displayRows).rows;
+                        exportQueryList.push({
+                            type: "in",
+                            queryId: serverId,
+                            value: kept.map(function (eachRow) { return eachRow === null || eachRow === void 0 ? void 0 : eachRow[serverId]; }),
+                        });
+                    }
                     baseUrl = props.devSettings.functionEndpoint;
                     apiEndpoint = baseUrl;
                     switch (exportType) {
@@ -7037,6 +7275,35 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
     // INFO: in schema-hide mode a hidden column must stay listed so it can be
     // shown again; in per-user mode a developer-hidden column is never togglable
     var getViewSettingsColumns = function () { return getTogglableColumns(isSchemaHideMode); };
+    // INFO: the header sort options, unchanged for every other column. Formula
+    // columns sort on their computed value, so they are added where that is
+    // supported and left out where it is not (Firebase, union).
+    var handleGetSortOptions = function () {
+        var _a, _b, _c;
+        var baseOptions = (_c = (_b = (_a = props.organise) === null || _a === void 0 ? void 0 : _a.renderReferenceLabelOptions) === null || _b === void 0 ? void 0 : _b.call(_a)) !== null && _c !== void 0 ? _c : (isViewSettingsEnabled
+            ? getViewSettingsColumns().map(function (eachColumn) {
+                var _a;
+                return ({
+                    key: eachColumn.id,
+                    label: (_a = eachColumn.name) !== null && _a !== void 0 ? _a : eachColumn.id,
+                });
+            })
+            : undefined);
+        if (!baseOptions || formulaColumnIds.length === 0)
+            return baseOptions;
+        var otherOptions = baseOptions.filter(function (eachOption) { return !formulaColumnIds.includes(eachOption.key); });
+        if (!isFormulaViewSupported)
+            return otherOptions;
+        return __spreadArray(__spreadArray([], otherOptions, true), structure
+            .filter(function (eachModel) { return eachModel.type === "formula"; })
+            .map(function (eachModel) {
+            var _a;
+            return ({
+                key: eachModel.id,
+                label: (_a = eachModel.name) !== null && _a !== void 0 ? _a : eachModel.id,
+            });
+        }), true);
+    };
     var getIsColumnHidden = function (column) {
         return isSchemaHideMode
             ? !!column.hide
@@ -7093,7 +7360,11 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                 react_1.default.createElement("p", { className: "text-sm font-medium ".concat(labelColor) }, "Sort"),
                 react_1.default.createElement("div", { className: "mt-1 flex flex-row items-center gap-x-2" },
                     react_1.default.createElement("div", { className: "grow min-w-0" },
-                        react_1.default.createElement(select_1.Select, { id: "dtw-view-sort-column", portalDropdown: true, label: "", containerClassName: "min-w-0", value: (_b = activeSortId === null || activeSortId === void 0 ? void 0 : activeSortId.sortId) !== null && _b !== void 0 ? _b : "", placeholder: "Column", darkMode: (_c = props.organise) === null || _c === void 0 ? void 0 : _c.darkMode, options: viewColumns.map(function (eachColumn) {
+                        react_1.default.createElement(select_1.Select, { id: "dtw-view-sort-column", portalDropdown: true, label: "", containerClassName: "min-w-0", value: (_b = activeSortId === null || activeSortId === void 0 ? void 0 : activeSortId.sortId) !== null && _b !== void 0 ? _b : "", placeholder: "Column", darkMode: (_c = props.organise) === null || _c === void 0 ? void 0 : _c.darkMode, options: viewColumns
+                                .filter(function (eachColumn) {
+                                return isFormulaViewSupported || eachColumn.type !== "formula";
+                            })
+                                .map(function (eachColumn) {
                                 var _a;
                                 return ({
                                     key: eachColumn.id,
@@ -8329,7 +8600,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                         };
                         // INFO: Desktop — PopUp (hidden on mobile)
                         actionElementList.push(react_1.default.createElement("div", { className: "hidden md:block" },
-                            react_1.default.createElement(popUp_1.PopUp, { darkMode: (_y = props.organise) === null || _y === void 0 ? void 0 : _y.darkMode, ctaComp: flexFilterIconBtn(), renderComp: (0, flexFilter_1.renderFlexFilterPopupContent)(flexFilters, structure, devSettings, dbModule, flexFilterReferenceOptions, flexFilterReferenceSearch, flexActions, (_z = props.bareSettings) === null || _z === void 0 ? void 0 : _z.bareListFilterQuery, searchInput, (_0 = props.bareSettings) === null || _0 === void 0 ? void 0 : _0.bareListFilterAddComponent, undefined, {
+                            react_1.default.createElement(popUp_1.PopUp, { darkMode: (_y = props.organise) === null || _y === void 0 ? void 0 : _y.darkMode, ctaComp: flexFilterIconBtn(), renderComp: (0, flexFilter_1.renderFlexFilterPopupContent)(flexFilters, flexFilterStructure, devSettings, dbModule, flexFilterReferenceOptions, flexFilterReferenceSearch, flexActions, (_z = props.bareSettings) === null || _z === void 0 ? void 0 : _z.bareListFilterQuery, searchInput, (_0 = props.bareSettings) === null || _0 === void 0 ? void 0 : _0.bareListFilterAddComponent, undefined, {
                                     darkMode: (_1 = props.organise) === null || _1 === void 0 ? void 0 : _1.darkMode,
                                     darkModeBg: (_2 = props.organise) === null || _2 === void 0 ? void 0 : _2.darkModeBg,
                                 }), anchor: "right", excludePortalIds: ["datepicker-portal", "select-portal"], lib: { Transition: (_3 = props === null || props === void 0 ? void 0 : props.lib) === null || _3 === void 0 ? void 0 : _3.Transition } })));
@@ -8337,7 +8608,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                         actionElementList.push(react_1.default.createElement("div", { className: "block md:hidden" },
                             !((_4 = props.bareSettings) === null || _4 === void 0 ? void 0 : _4.bareListMobileFloatingSearch) &&
                                 flexFilterIconBtn(true),
-                            (0, flexFilter_1.renderFlexFilterModal)(flexFilterModalOpen, flexFilters, structure, devSettings, dbModule, flexFilterReferenceOptions, flexFilterReferenceSearch, flexActions, function () { return setFlexFilterModalOpen(false); }, (_5 = props.bareSettings) === null || _5 === void 0 ? void 0 : _5.bareListFilterQuery, searchInput, (_6 = props.bareSettings) === null || _6 === void 0 ? void 0 : _6.bareListFilterAddComponent, {
+                            (0, flexFilter_1.renderFlexFilterModal)(flexFilterModalOpen, flexFilters, flexFilterStructure, devSettings, dbModule, flexFilterReferenceOptions, flexFilterReferenceSearch, flexActions, function () { return setFlexFilterModalOpen(false); }, (_5 = props.bareSettings) === null || _5 === void 0 ? void 0 : _5.bareListFilterQuery, searchInput, (_6 = props.bareSettings) === null || _6 === void 0 ? void 0 : _6.bareListFilterAddComponent, {
                                 darkMode: (_7 = props.organise) === null || _7 === void 0 ? void 0 : _7.darkMode,
                                 darkModeBg: (_8 = props.organise) === null || _8 === void 0 ? void 0 : _8.darkModeBg,
                             })));
@@ -8714,6 +8985,11 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
             return false;
         if (!groupId || isFirebase)
             return false;
+        // INFO: a formula sort or filter needs every row read and ordered at
+        // once; band pages come straight from the server without it, so the bands
+        // are built from the formula-ordered rows instead
+        if (isFormulaView)
+            return false;
         // INFO: a union list pages by skip, which a per-band cursor cannot express,
         // so it keeps the single pager and groups the loaded rows
         if ((_b = (_a = props.organise) === null || _a === void 0 ? void 0 : _a.unionCollections) === null || _b === void 0 ? void 0 : _b.length)
@@ -9234,7 +9510,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
         });
     };
     var renderGroupTable = function (multipleSelect) {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19, _20, _21, _22, _23, _24, _25, _26, _27, _28, _29;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19, _20, _21, _22, _23, _24;
         if (groupId && !((_a = props.bareSettings) === null || _a === void 0 ? void 0 : _a.bareNewDTW)) {
             var groupAttributeDS_1 = structure.find(function (eachDS) { return eachDS.id === groupId; });
             var groupedSpaceTableData = spaceTableData.reduce(function (acc, eachData) {
@@ -9262,7 +9538,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
             }
             else {
                 return Object.entries(groupedSpaceTableData).map(function (_a) {
-                    var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;
+                    var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
                     var eachKey = _a[0], eachValue = _a[1];
                     var dataList = eachValue;
                     var ids = (dataList === null || dataList === void 0 ? void 0 : dataList.map(function (eachData) { return eachData._id; })) || [];
@@ -9273,7 +9549,8 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                         react_1.default.createElement("div", { className: "font-semibold text-md mt-5" },
                             "Group By ",
                             eachKey),
-                        react_1.default.createElement(table_1.Table, { showId: showId, paginationType: renderResolvedPaginationType(), data: filterTableData, spaceData: dataList !== null && dataList !== void 0 ? dataList : [], referencesOptions: listReferencesOptions, size: (_b = dataList.length) !== null && _b !== void 0 ? _b : 0, limit: 5, cursor: "", loading: tableLoading !== null && tableLoading !== void 0 ? tableLoading : true, checkbox: multipleSelect, selectAll: selectAll, selectedIds: selectedIds, selectAllText: selectAll ? "from filter" : "", disableSelectFullData: (_d = (_c = props.organise) === null || _c === void 0 ? void 0 : _c.disableSelectFullData) === null || _d === void 0 ? void 0 : _d.table, multiActionButton: react_1.default.createElement("div", { className: "flex flex-row space-x-3" },
+                        react_1.default.createElement(table_1.Table, { showId: showId, paginationType: renderResolvedPaginationType(), data: filterTableData, spaceData: dataList !== null && dataList !== void 0 ? dataList : [], referencesOptions: listReferencesOptions, size: (_b = dataList.length) !== null && _b !== void 0 ? _b : 0, limit: 5, cursor: "", loading: tableLoading !== null && tableLoading !== void 0 ? tableLoading : true, checkbox: multipleSelect, selectAll: selectAll, selectedIds: selectedIds, selectAllText: selectAll ? "from filter" : "", disableSelectFullData: ((_d = (_c = props.organise) === null || _c === void 0 ? void 0 : _c.disableSelectFullData) === null || _d === void 0 ? void 0 : _d.table) ||
+                                isFormulaView, multiActionButton: react_1.default.createElement("div", { className: "flex flex-row space-x-3" },
                                 selectedIds.length > 0 &&
                                     canBatchUpdate &&
                                     !((_e = props.bareSettings) === null || _e === void 0 ? void 0 : _e.bareHideTableExtraMultipleAction) && (react_1.default.createElement(react_1.default.Fragment, null,
@@ -9308,15 +9585,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                                 // INFO: per-column header filter is replaced by the flex filters
                                 filterEnabled: false,
                                 sortId: activeSortId,
-                                sortOptions: (_t = (_s = (_r = props.organise) === null || _r === void 0 ? void 0 : _r.renderReferenceLabelOptions) === null || _s === void 0 ? void 0 : _s.call(_r)) !== null && _t !== void 0 ? _t : (isViewSettingsEnabled
-                                    ? getViewSettingsColumns().map(function (eachColumn) {
-                                        var _a;
-                                        return ({
-                                            key: eachColumn.id,
-                                            label: (_a = eachColumn.name) !== null && _a !== void 0 ? _a : eachColumn.id,
-                                        });
-                                    })
-                                    : undefined),
+                                sortOptions: handleGetSortOptions(),
                                 onSortColumn: handleSortColumn,
                                 // INFO: header drag and the panel handle run the same reorder, so the
                                 // order persists identically whichever one the user grabs
@@ -9354,7 +9623,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                                     });
                                 }); },
                             }, onObjectEdit: handleObjectCellEdit, addable: {
-                                active: ((_u = props.edit) === null || _u === void 0 ? void 0 : _u.listAddable) ? true : false,
+                                active: ((_r = props.edit) === null || _r === void 0 ? void 0 : _r.listAddable) ? true : false,
                                 onAddData: function (data) { return __awaiter(void 0, void 0, void 0, function () {
                                     var createdId;
                                     return __generator(this, function (_a) {
@@ -9368,7 +9637,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                                         }
                                     });
                                 }); },
-                            }, darkMode: (_v = props.organise) === null || _v === void 0 ? void 0 : _v.darkMode, hidePagination: true, disableEllipsisOnLongWord: (_w = props.organise) === null || _w === void 0 ? void 0 : _w.disableEllipsisOnLongWord })));
+                            }, darkMode: (_s = props.organise) === null || _s === void 0 ? void 0 : _s.darkMode, hidePagination: true, disableEllipsisOnLongWord: (_t = props.organise) === null || _t === void 0 ? void 0 : _t.disableEllipsisOnLongWord })));
                 });
             }
         }
@@ -9384,7 +9653,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                         ? function (groupKey, page) {
                             return handleFetchGroupPage(groupKey, page);
                         }
-                        : undefined, groupLoadingStatus: renderCheckGroupPaging() ? groupPageState : undefined, size: size !== null && size !== void 0 ? size : 0, limit: limit, cursor: cursor !== null && cursor !== void 0 ? cursor : "", loading: tableLoading !== null && tableLoading !== void 0 ? tableLoading : true, checkbox: multipleSelect, selectAll: selectAll, selectedIds: selectedIds, selectAllText: selectAll ? "from filter" : "", disableSelectFullData: (_e = (_d = props.organise) === null || _d === void 0 ? void 0 : _d.disableSelectFullData) === null || _e === void 0 ? void 0 : _e.table, maxSelectedCount: (_f = props.bareSettings) === null || _f === void 0 ? void 0 : _f.bareListMaxSelectedCount, mobileView: (_g = props.bareSettings) === null || _g === void 0 ? void 0 : _g.bareListMobileView, mobileTooltip: (_h = props.bareSettings) === null || _h === void 0 ? void 0 : _h.bareMobileTooltip, multiActionFloatingBtns: __spreadArray(__spreadArray(__spreadArray(__spreadArray([], (canBatchUpdate &&
+                        : undefined, groupLoadingStatus: renderCheckGroupPaging() ? groupPageState : undefined, size: size !== null && size !== void 0 ? size : 0, limit: limit, cursor: cursor !== null && cursor !== void 0 ? cursor : "", loading: tableLoading !== null && tableLoading !== void 0 ? tableLoading : true, checkbox: multipleSelect, selectAll: selectAll, selectedIds: selectedIds, selectAllText: selectAll ? "from filter" : "", disableSelectFullData: ((_e = (_d = props.organise) === null || _d === void 0 ? void 0 : _d.disableSelectFullData) === null || _e === void 0 ? void 0 : _e.table) || isFormulaView, maxSelectedCount: (_f = props.bareSettings) === null || _f === void 0 ? void 0 : _f.bareListMaxSelectedCount, mobileView: (_g = props.bareSettings) === null || _g === void 0 ? void 0 : _g.bareListMobileView, mobileTooltip: (_h = props.bareSettings) === null || _h === void 0 ? void 0 : _h.bareMobileTooltip, multiActionFloatingBtns: __spreadArray(__spreadArray(__spreadArray(__spreadArray([], (canBatchUpdate &&
                         !((_j = props.bareSettings) === null || _j === void 0 ? void 0 : _j.bareHideTableExtraMultipleAction)
                         ? [
                             {
@@ -9454,28 +9723,23 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                                 return structure.find(function (eachColumn) { return eachColumn.id === columnId; });
                             }
                             : undefined,
-                        renderAddColumnElements: ((_z = props.bareSettings) === null || _z === void 0 ? void 0 : _z.bareAddColumns)
+                        getSchema: ((_z = props.bareSettings) === null || _z === void 0 ? void 0 : _z.bareAddColumns)
+                            ? function () { return structure; }
+                            : undefined,
+                        renderAddColumnElements: ((_0 = props.bareSettings) === null || _0 === void 0 ? void 0 : _0.bareAddColumns)
                             ? undefined
                             : renderAddMathColumn,
                         // INFO: the popup's reference pickers read from the same providers
                         // the schema editor uses — without them a reference column would be
                         // created with no target and resolve nothing
-                        renderReferenceSpaceOptions: (_0 = props.organise) === null || _0 === void 0 ? void 0 : _0.renderReferenceSpaceOptions,
-                        renderReferenceLabelOptions: (_1 = props.organise) === null || _1 === void 0 ? void 0 : _1.renderReferenceLabelOptions,
+                        renderReferenceSpaceOptions: (_1 = props.organise) === null || _1 === void 0 ? void 0 : _1.renderReferenceSpaceOptions,
+                        renderReferenceLabelOptions: (_2 = props.organise) === null || _2 === void 0 ? void 0 : _2.renderReferenceLabelOptions,
                         dragEnabled: isViewSettingsEnabled,
                         sortEnabled: isViewSettingsEnabled,
                         // INFO: per-column header filter is replaced by the flex filters
                         filterEnabled: false,
                         sortId: activeSortId,
-                        sortOptions: (_4 = (_3 = (_2 = props.organise) === null || _2 === void 0 ? void 0 : _2.renderReferenceLabelOptions) === null || _3 === void 0 ? void 0 : _3.call(_2)) !== null && _4 !== void 0 ? _4 : (isViewSettingsEnabled
-                            ? getViewSettingsColumns().map(function (eachColumn) {
-                                var _a;
-                                return ({
-                                    key: eachColumn.id,
-                                    label: (_a = eachColumn.name) !== null && _a !== void 0 ? _a : eachColumn.id,
-                                });
-                            })
-                            : undefined),
+                        sortOptions: handleGetSortOptions(),
                         onSortColumn: handleSortColumn,
                         // INFO: header drag and the panel handle run the same reorder, so the
                         // order persists identically whichever one the user grabs
@@ -9514,7 +9778,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                             });
                         }); },
                     }, onObjectEdit: handleObjectCellEdit, addable: {
-                        active: ((_5 = props.edit) === null || _5 === void 0 ? void 0 : _5.listAddable) ? true : false,
+                        active: ((_3 = props.edit) === null || _3 === void 0 ? void 0 : _3.listAddable) ? true : false,
                         onAddData: function (data) { return __awaiter(void 0, void 0, void 0, function () {
                             var createdId;
                             return __generator(this, function (_a) {
@@ -9528,16 +9792,16 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                                 }
                             });
                         }); },
-                    }, darkMode: (_6 = props.organise) === null || _6 === void 0 ? void 0 : _6.darkMode, 
+                    }, darkMode: (_4 = props.organise) === null || _4 === void 0 ? void 0 : _4.darkMode, 
                     // INFO: each band pages itself, so the list-wide pager would only
                     // page the read that seeded them
-                    hidePagination: ((_7 = props.organise) === null || _7 === void 0 ? void 0 : _7.hidePagination) ||
-                        (renderCheckGroupPaging() && !renderCheckScrollMode()), customPaginationSize: customPaginationSize, disableEllipsisOnLongWord: (_8 = props.organise) === null || _8 === void 0 ? void 0 : _8.disableEllipsisOnLongWord, pinColumns: (_9 = props.bareSettings) === null || _9 === void 0 ? void 0 : _9.bareListTablePinColumns }));
+                    hidePagination: ((_5 = props.organise) === null || _5 === void 0 ? void 0 : _5.hidePagination) ||
+                        (renderCheckGroupPaging() && !renderCheckScrollMode()), customPaginationSize: customPaginationSize, disableEllipsisOnLongWord: (_6 = props.organise) === null || _6 === void 0 ? void 0 : _6.disableEllipsisOnLongWord, pinColumns: (_7 = props.bareSettings) === null || _7 === void 0 ? void 0 : _7.bareListTablePinColumns }));
             }
-            return (react_1.default.createElement(table_1.Table, { showId: showId, paginationType: renderResolvedPaginationType(), data: tableData, spaceData: spaceTableData !== null && spaceTableData !== void 0 ? spaceTableData : [], referencesOptions: listReferencesOptions, size: size !== null && size !== void 0 ? size : 0, limit: limit, cursor: cursor !== null && cursor !== void 0 ? cursor : "", loading: tableLoading !== null && tableLoading !== void 0 ? tableLoading : true, checkbox: multipleSelect, selectAll: selectAll, selectedIds: selectedIds, selectAllText: selectAll ? "from filter" : "", disableSelectFullData: (_11 = (_10 = props.organise) === null || _10 === void 0 ? void 0 : _10.disableSelectFullData) === null || _11 === void 0 ? void 0 : _11.table, multiActionButton: react_1.default.createElement("div", { className: "flex flex-row space-x-3" },
+            return (react_1.default.createElement(table_1.Table, { showId: showId, paginationType: renderResolvedPaginationType(), data: tableData, spaceData: spaceTableData !== null && spaceTableData !== void 0 ? spaceTableData : [], referencesOptions: listReferencesOptions, size: size !== null && size !== void 0 ? size : 0, limit: limit, cursor: cursor !== null && cursor !== void 0 ? cursor : "", loading: tableLoading !== null && tableLoading !== void 0 ? tableLoading : true, checkbox: multipleSelect, selectAll: selectAll, selectedIds: selectedIds, selectAllText: selectAll ? "from filter" : "", disableSelectFullData: ((_9 = (_8 = props.organise) === null || _8 === void 0 ? void 0 : _8.disableSelectFullData) === null || _9 === void 0 ? void 0 : _9.table) || isFormulaView, multiActionButton: react_1.default.createElement("div", { className: "flex flex-row space-x-3" },
                     selectedIds.length > 0 &&
                         canBatchUpdate &&
-                        !((_12 = props.bareSettings) === null || _12 === void 0 ? void 0 : _12.bareHideTableExtraMultipleAction) && (react_1.default.createElement(react_1.default.Fragment, null,
+                        !((_10 = props.bareSettings) === null || _10 === void 0 ? void 0 : _10.bareHideTableExtraMultipleAction) && (react_1.default.createElement(react_1.default.Fragment, null,
                         react_1.default.createElement(textButton_1.TextButton, { className: "text-sm", text: "Change to Draft", disable: loading, onClick: function () {
                                 handleBatchDraftData();
                             } }),
@@ -9551,8 +9815,8 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                     !isFirebase && canBatchUpdate && (react_1.default.createElement(textButton_1.TextButton, { className: "text-sm", text: "Update", onClick: function () {
                             setBatchUpdateModal(true);
                         } })),
-                    ((_13 = props.bareSettings) === null || _13 === void 0 ? void 0 : _13.bareListMultipleSelectAddtionalActions) &&
-                        ((_15 = (_14 = props.bareSettings) === null || _14 === void 0 ? void 0 : _14.bareListMultipleSelectAddtionalActions) === null || _15 === void 0 ? void 0 : _15.map(function (eachButton) {
+                    ((_11 = props.bareSettings) === null || _11 === void 0 ? void 0 : _11.bareListMultipleSelectAddtionalActions) &&
+                        ((_13 = (_12 = props.bareSettings) === null || _12 === void 0 ? void 0 : _12.bareListMultipleSelectAddtionalActions) === null || _13 === void 0 ? void 0 : _13.map(function (eachButton) {
                             return (react_1.default.createElement(textButton_1.TextButton, { className: "text-sm ".concat(eachButton.className), text: eachButton.text, onClick: function () {
                                     var _a, _b;
                                     (_a = eachButton.onClick) === null || _a === void 0 ? void 0 : _a.call(eachButton, selectedIds, selectAll, (_b = renderImpSearchFilterConditions()) !== null && _b !== void 0 ? _b : []);
@@ -9561,25 +9825,17 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                     var _a, _b;
                     handleCaptureListScroll(id);
                     (_b = (_a = props.organise) === null || _a === void 0 ? void 0 : _a.handleNavigate) === null || _b === void 0 ? void 0 : _b.call(_a, "read", id, "general");
-                }, linkType: props.linkType, custom: props.custom, newTabUrl: (_17 = (_16 = props.newTabUrl) === null || _16 === void 0 ? void 0 : _16.default) !== null && _17 !== void 0 ? _17 : "".concat(props.localURLEndpoint, "?data="), addNewTabUrl: (_19 = (_18 = props.newTabUrl) === null || _18 === void 0 ? void 0 : _18.addons) !== null && _19 !== void 0 ? _19 : "&type=read&collection=".concat(props.collectionId, "&view=general"), handleUpdatePageIndex: function (value) {
+                }, linkType: props.linkType, custom: props.custom, newTabUrl: (_15 = (_14 = props.newTabUrl) === null || _14 === void 0 ? void 0 : _14.default) !== null && _15 !== void 0 ? _15 : "".concat(props.localURLEndpoint, "?data="), addNewTabUrl: (_17 = (_16 = props.newTabUrl) === null || _16 === void 0 ? void 0 : _16.addons) !== null && _17 !== void 0 ? _17 : "&type=read&collection=".concat(props.collectionId, "&view=general"), handleUpdatePageIndex: function (value) {
                     handlePagination(value);
-                }, className: "mt-5", lib: { axios: (_20 = props.lib) === null || _20 === void 0 ? void 0 : _20.axios }, devSettings: props.devSettings, bareSettings: props.bareSettings, fixedPagination: (_21 = props.organise) === null || _21 === void 0 ? void 0 : _21.fixedPagination, advSettings: {
-                    addColumnEnabled: (_22 = props.organise) === null || _22 === void 0 ? void 0 : _22.addColumnEnabled,
+                }, className: "mt-5", lib: { axios: (_18 = props.lib) === null || _18 === void 0 ? void 0 : _18.axios }, devSettings: props.devSettings, bareSettings: props.bareSettings, fixedPagination: (_19 = props.organise) === null || _19 === void 0 ? void 0 : _19.fixedPagination, advSettings: {
+                    addColumnEnabled: (_20 = props.organise) === null || _20 === void 0 ? void 0 : _20.addColumnEnabled,
                     renderAddColumnElements: renderAddMathColumn,
                     dragEnabled: isViewSettingsEnabled,
                     sortEnabled: isViewSettingsEnabled,
                     // INFO: per-column header filter is replaced by the flex filters
                     filterEnabled: false,
                     sortId: activeSortId,
-                    sortOptions: (_25 = (_24 = (_23 = props.organise) === null || _23 === void 0 ? void 0 : _23.renderReferenceLabelOptions) === null || _24 === void 0 ? void 0 : _24.call(_23)) !== null && _25 !== void 0 ? _25 : (isViewSettingsEnabled
-                        ? getViewSettingsColumns().map(function (eachColumn) {
-                            var _a;
-                            return ({
-                                key: eachColumn.id,
-                                label: (_a = eachColumn.name) !== null && _a !== void 0 ? _a : eachColumn.id,
-                            });
-                        })
-                        : undefined),
+                    sortOptions: handleGetSortOptions(),
                     onSortColumn: handleSortColumn,
                     // INFO: header drag and the panel handle run the same reorder, so the
                     // order persists identically whichever one the user grabs
@@ -9615,7 +9871,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                         });
                     }); },
                 }, onObjectEdit: handleObjectCellEdit, addable: {
-                    active: ((_26 = props.edit) === null || _26 === void 0 ? void 0 : _26.listAddable) ? true : false,
+                    active: ((_21 = props.edit) === null || _21 === void 0 ? void 0 : _21.listAddable) ? true : false,
                     onAddData: function (data) { return __awaiter(void 0, void 0, void 0, function () {
                         var createdId;
                         return __generator(this, function (_a) {
@@ -9629,7 +9885,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                             }
                         });
                     }); },
-                }, darkMode: (_27 = props.organise) === null || _27 === void 0 ? void 0 : _27.darkMode, hidePagination: (_28 = props.organise) === null || _28 === void 0 ? void 0 : _28.hidePagination, customPaginationSize: customPaginationSize, disableEllipsisOnLongWord: (_29 = props.organise) === null || _29 === void 0 ? void 0 : _29.disableEllipsisOnLongWord }));
+                }, darkMode: (_22 = props.organise) === null || _22 === void 0 ? void 0 : _22.darkMode, hidePagination: (_23 = props.organise) === null || _23 === void 0 ? void 0 : _23.hidePagination, customPaginationSize: customPaginationSize, disableEllipsisOnLongWord: (_24 = props.organise) === null || _24 === void 0 ? void 0 : _24.disableEllipsisOnLongWord }));
         }
     };
     // INFO: `hidden` keeps the markers out of space-y spacing
@@ -9932,7 +10188,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
             else if (selectedTabData.viewType === "list") {
                 // INFO: when bareNewDTW is enabled, render NewList instead of legacy List
                 if ((_t = props.bareSettings) === null || _t === void 0 ? void 0 : _t.bareNewDTW) {
-                    return (react_1.default.createElement(newList_1.NewList, { darkModeBg: (_u = props.organise) === null || _u === void 0 ? void 0 : _u.darkModeBg, paginationType: renderResolvedPaginationType(), list: renderGridAndListData(selectedTabData.viewImage, "list", undefined, true), size: size, limit: limit, cursor: cursor, loading: tableLoading, pageIndex: pageIndex, checkbox: multipleSelect, selectAll: selectAll, selectedIds: selectedIds, disableSelectFullData: (_w = (_v = props.organise) === null || _v === void 0 ? void 0 : _v.disableSelectFullData) === null || _w === void 0 ? void 0 : _w.list, handleSelectAll: handleSelectAllPages, handleSelectedIds: handleSelectIds, selectAllText: selectAll ? "from filter" : "", maxSelectedCount: (_x = props.bareSettings) === null || _x === void 0 ? void 0 : _x.bareListMaxSelectedCount, multiActionButton: react_1.default.createElement("div", { className: "flex flex-row space-x-3" },
+                    return (react_1.default.createElement(newList_1.NewList, { darkModeBg: (_u = props.organise) === null || _u === void 0 ? void 0 : _u.darkModeBg, paginationType: renderResolvedPaginationType(), list: renderGridAndListData(selectedTabData.viewImage, "list", undefined, true), size: size, limit: limit, cursor: cursor, loading: tableLoading, pageIndex: pageIndex, checkbox: multipleSelect, selectAll: selectAll, selectedIds: selectedIds, disableSelectFullData: ((_w = (_v = props.organise) === null || _v === void 0 ? void 0 : _v.disableSelectFullData) === null || _w === void 0 ? void 0 : _w.list) || isFormulaView, handleSelectAll: handleSelectAllPages, handleSelectedIds: handleSelectIds, selectAllText: selectAll ? "from filter" : "", maxSelectedCount: (_x = props.bareSettings) === null || _x === void 0 ? void 0 : _x.bareListMaxSelectedCount, multiActionButton: react_1.default.createElement("div", { className: "flex flex-row space-x-3" },
                             selectedIds.length > 0 && canBatchUpdate && (react_1.default.createElement(react_1.default.Fragment, null,
                                 react_1.default.createElement(textButton_1.TextButton, { className: "text-sm", text: "Change to Draft", disable: loading, onClick: function () {
                                         handleBatchDraftData();
@@ -9955,7 +10211,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                         }, darkMode: (_2 = props.organise) === null || _2 === void 0 ? void 0 : _2.darkMode, className: "mt-5", hidePagination: (_3 = props.organise) === null || _3 === void 0 ? void 0 : _3.hidePagination, customPaginationSize: customPaginationSize, mobileTooltip: (_4 = props.bareSettings) === null || _4 === void 0 ? void 0 : _4.bareListMobileTooltip }));
                 }
                 return (react_1.default.createElement(react_1.default.Fragment, null,
-                    react_1.default.createElement(list_1.List, { darkModeBg: (_5 = props.organise) === null || _5 === void 0 ? void 0 : _5.darkModeBg, paginationType: renderResolvedPaginationType(), list: renderGridAndListData(selectedTabData.viewImage, "list", undefined, true), size: size, limit: limit, cursor: cursor, loading: tableLoading, pageIndex: pageIndex, checkbox: multipleSelect, selectAll: selectAll, selectedIds: selectedIds, disableSelectFullData: (_7 = (_6 = props.organise) === null || _6 === void 0 ? void 0 : _6.disableSelectFullData) === null || _7 === void 0 ? void 0 : _7.list, handleSelectAll: handleSelectAllPages, handleSelectedIds: handleSelectIds, selectAllText: selectAll ? "from filter" : "", multiActionButton: react_1.default.createElement("div", { className: "flex flex-row space-x-3" },
+                    react_1.default.createElement(list_1.List, { darkModeBg: (_5 = props.organise) === null || _5 === void 0 ? void 0 : _5.darkModeBg, paginationType: renderResolvedPaginationType(), list: renderGridAndListData(selectedTabData.viewImage, "list", undefined, true), size: size, limit: limit, cursor: cursor, loading: tableLoading, pageIndex: pageIndex, checkbox: multipleSelect, selectAll: selectAll, selectedIds: selectedIds, disableSelectFullData: ((_7 = (_6 = props.organise) === null || _6 === void 0 ? void 0 : _6.disableSelectFullData) === null || _7 === void 0 ? void 0 : _7.list) || isFormulaView, handleSelectAll: handleSelectAllPages, handleSelectedIds: handleSelectIds, selectAllText: selectAll ? "from filter" : "", multiActionButton: react_1.default.createElement("div", { className: "flex flex-row space-x-3" },
                             selectedIds.length > 0 && canBatchUpdate && (react_1.default.createElement(react_1.default.Fragment, null,
                                 react_1.default.createElement(textButton_1.TextButton, { className: "text-sm", text: "Change to Draft", disable: loading, onClick: function () {
                                         handleBatchDraftData();
@@ -11131,7 +11387,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
     };
     return (react_1.default.createElement(react_1.default.Fragment, null,
         renderNotification("root"),
-        ((_77 = (_76 = props.renderSettings) === null || _76 === void 0 ? void 0 : _76.renderLoadingUI) === null || _77 === void 0 ? void 0 : _77.call(_76)) && loading ? ((_78 = props.renderSettings) === null || _78 === void 0 ? void 0 : _78.renderLoadingUI()) : (react_1.default.createElement(modal_1.Modal, { darkMode: (_79 = props.organise) === null || _79 === void 0 ? void 0 : _79.darkMode, darkModeBg: (_80 = props.organise) === null || _80 === void 0 ? void 0 : _80.darkModeBg, maxWidth: selectedObjectStructureId || excelModal ? "2xl" : undefined, open: modalVisible, title: renderModalTitle(), renderContent: renderModalContent, onClose: function () {
+        ((_79 = (_78 = props.renderSettings) === null || _78 === void 0 ? void 0 : _78.renderLoadingUI) === null || _79 === void 0 ? void 0 : _79.call(_78)) && loading ? ((_80 = props.renderSettings) === null || _80 === void 0 ? void 0 : _80.renderLoadingUI()) : (react_1.default.createElement(modal_1.Modal, { darkMode: (_81 = props.organise) === null || _81 === void 0 ? void 0 : _81.darkMode, darkModeBg: (_82 = props.organise) === null || _82 === void 0 ? void 0 : _82.darkModeBg, maxWidth: selectedObjectStructureId || excelModal ? "2xl" : undefined, open: modalVisible, title: renderModalTitle(), renderContent: renderModalContent, onClose: function () {
                 var _a, _b;
                 if (loading)
                     return;
@@ -11142,7 +11398,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                     setExportCSVEmail((_b = (_a = props.devSettings.currentUser) === null || _a === void 0 ? void 0 : _a.userEmail) !== null && _b !== void 0 ? _b : "");
                 }
             }, notification: react_1.default.createElement(react_1.default.Fragment, null, renderNotification("modal")) })),
-        react_1.default.createElement(modal_1.Modal, { darkMode: (_81 = props.organise) === null || _81 === void 0 ? void 0 : _81.darkMode, darkModeBg: (_82 = props.organise) === null || _82 === void 0 ? void 0 : _82.darkModeBg, maxWidth: "2xl", open: referenceCreationModal.id ? true : false, renderContent: function () {
+        react_1.default.createElement(modal_1.Modal, { darkMode: (_83 = props.organise) === null || _83 === void 0 ? void 0 : _83.darkMode, darkModeBg: (_84 = props.organise) === null || _84 === void 0 ? void 0 : _84.darkModeBg, maxWidth: "2xl", open: referenceCreationModal.id ? true : false, renderContent: function () {
                 return (react_1.default.createElement(referenceModal_1.ReferenceModal, { referenceModelSchema: referenceModelSchema, referenceDataStructure: referenceCreationModal, devSettings: props.devSettings, handleCreateRefId: function (dataId) {
                         if (dataId) {
                             var currentValue = selectedData[referenceCreationModal.id];
@@ -11158,19 +11414,19 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
             }, onClose: function () {
                 setReferenceCreationModal({ id: "", name: "", type: "string" });
             } }),
-        react_1.default.createElement(modal_1.Modal, { darkMode: (_83 = props.organise) === null || _83 === void 0 ? void 0 : _83.darkMode, darkModeBg: (_84 = props.organise) === null || _84 === void 0 ? void 0 : _84.darkModeBg, maxWidth: "2xl", open: Object.keys(referenceDeleteTableData).length > 0, renderContent: renderReferenceDeleteTable, onClose: function () {
+        react_1.default.createElement(modal_1.Modal, { darkMode: (_85 = props.organise) === null || _85 === void 0 ? void 0 : _85.darkMode, darkModeBg: (_86 = props.organise) === null || _86 === void 0 ? void 0 : _86.darkModeBg, maxWidth: "2xl", open: Object.keys(referenceDeleteTableData).length > 0, renderContent: renderReferenceDeleteTable, onClose: function () {
                 setReferenceDeleteTableData({});
             }, notification: react_1.default.createElement(react_1.default.Fragment, null, renderNotification("modal")) }),
-        react_1.default.createElement(modal_1.Modal, { darkMode: (_85 = props.organise) === null || _85 === void 0 ? void 0 : _85.darkMode, darkModeBg: (_86 = props.organise) === null || _86 === void 0 ? void 0 : _86.darkModeBg, open: deleteModal, renderContent: renderDeleteModalContent, onClose: function () {
+        react_1.default.createElement(modal_1.Modal, { darkMode: (_87 = props.organise) === null || _87 === void 0 ? void 0 : _87.darkMode, darkModeBg: (_88 = props.organise) === null || _88 === void 0 ? void 0 : _88.darkModeBg, open: deleteModal, renderContent: renderDeleteModalContent, onClose: function () {
                 setDeletePasscodeInput("");
                 setDeleteModal(!deleteModal);
                 setDeleteFeedId("");
             }, notification: react_1.default.createElement(react_1.default.Fragment, null, renderNotification("modal")) }),
-        react_1.default.createElement(modal_1.Modal, { darkMode: (_87 = props.organise) === null || _87 === void 0 ? void 0 : _87.darkMode, darkModeBg: (_88 = props.organise) === null || _88 === void 0 ? void 0 : _88.darkModeBg, open: batchUpdateModal, renderContent: renderBatchUpdateModalContent, onClose: function () {
+        react_1.default.createElement(modal_1.Modal, { darkMode: (_89 = props.organise) === null || _89 === void 0 ? void 0 : _89.darkMode, darkModeBg: (_90 = props.organise) === null || _90 === void 0 ? void 0 : _90.darkModeBg, open: batchUpdateModal, renderContent: renderBatchUpdateModalContent, onClose: function () {
                 setBatchUpdateData({ columnId: "", columnData: {} });
                 setBatchUpdateModal(false);
             }, notification: react_1.default.createElement(react_1.default.Fragment, null, renderNotification("modal")) }),
-        react_1.default.createElement(modal_1.Modal, { darkMode: (_89 = props.organise) === null || _89 === void 0 ? void 0 : _89.darkMode, darkModeBg: (_90 = props.organise) === null || _90 === void 0 ? void 0 : _90.darkModeBg, title: "Edit Auth Method", open: selectedAuthMethod ? true : false, renderContent: function () {
+        react_1.default.createElement(modal_1.Modal, { darkMode: (_91 = props.organise) === null || _91 === void 0 ? void 0 : _91.darkMode, darkModeBg: (_92 = props.organise) === null || _92 === void 0 ? void 0 : _92.darkModeBg, title: "Edit Auth Method", open: selectedAuthMethod ? true : false, renderContent: function () {
                 var _a, _b;
                 if (props.space)
                     return (react_1.default.createElement(authModal_1.AuthModal, { space: props.space, userId: (_a = props.id) !== null && _a !== void 0 ? _a : "", client: (_b = props.lib) === null || _b === void 0 ? void 0 : _b.axios, type: selectedAuthMethod, authMethods: authMethods, onComplete: handleAuthComplete }));
@@ -11178,7 +11434,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
             }, onClose: function () {
                 setSelectedAuthMethod("");
             } }),
-        isActivityLog && (react_1.default.createElement(modal_1.Modal, { darkMode: (_91 = props.organise) === null || _91 === void 0 ? void 0 : _91.darkMode, darkModeBg: (_92 = props.organise) === null || _92 === void 0 ? void 0 : _92.darkModeBg, open: activityModal, title: "Activity Log", renderContent: function () {
+        isActivityLog && (react_1.default.createElement(modal_1.Modal, { darkMode: (_93 = props.organise) === null || _93 === void 0 ? void 0 : _93.darkMode, darkModeBg: (_94 = props.organise) === null || _94 === void 0 ? void 0 : _94.darkModeBg, open: activityModal, title: "Activity Log", renderContent: function () {
                 var _a, _b;
                 return (react_1.default.createElement(activityModal_1.ActivityModal, { title: props.title && typeof props.title === "string"
                         ? props.title