blixify-ui-web 1.2.94 → 1.2.96

package/lib/components/data/dataTemplate/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/data/dataTemplate/index.tsx"],"names":[],"mappings":"AAqCA,OAAO,KASN,MAAM,OAAO,CAAC;AA0Ff,OAAO,EACL,iBAAiB,EAKlB,MAAM,kBAAkB,CAAC;AAwD1B,eAAO,MAAM,YAAY,mFA29YvB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/data/dataTemplate/index.tsx"],"names":[],"mappings":"AAqCA,OAAO,KASN,MAAM,OAAO,CAAC;AA0Ff,OAAO,EACL,iBAAiB,EAKlB,MAAM,kBAAkB,CAAC;AA0D1B,eAAO,MAAM,YAAY,mFAkoZvB,CAAC"}

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

@@ -867,6 +867,31 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
         setFlexFiltersDebounced(updatedFilters);
         setPageIndex(0);
     };
+    // INFO: applies flex filters from a parent, merged by columnId (incoming
+    // replaces same-column rows so no contradictory AND; other columns kept).
+    var handleApplyFlexFilters = function (incoming) {
+        handleClearFlexFilterTypingTimeout();
+        var incomingColumnIds = new Set(incoming.map(function (f) { return f.columnId; }));
+        var retained = flexFilters.filter(function (f) { return f.columnId && !incomingColumnIds.has(f.columnId); });
+        var merged = __spreadArray(__spreadArray([], retained, true), incoming, true);
+        setFlexFilters(merged);
+        setFlexFiltersDebounced(merged);
+        setPageIndex(0);
+    };
+    // INFO: clears flex filters by columnId (other columns preserved), or all
+    // when called with no args. Falls back to a single empty row when none remain.
+    var handleClearFlexFilters = function (columnIds) {
+        handleClearFlexFilterTypingTimeout();
+        var remaining = columnIds && columnIds.length > 0
+            ? flexFilters.filter(function (f) { return f.columnId && !columnIds.includes(f.columnId); })
+            : [];
+        var updatedFilters = remaining.length > 0
+            ? remaining
+            : [{ id: (0, uuid_1.v4)(), columnId: "", operator: "=", value: undefined }];
+        setFlexFilters(updatedFilters);
+        setFlexFiltersDebounced(updatedFilters);
+        setPageIndex(0);
+    };
     var handleFlexFilterColumnChange = function (filterId, columnId) {
         var updatedFilters = flexFilters.map(function (f) {
             if (f.id !== filterId)
@@ -954,6 +979,8 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
         },
         handleFormSubmit: handleFormSubmit,
         handleFormCheck: handleFormCheck,
+        handleApplyFlexFilters: handleApplyFlexFilters,
+        handleClearFlexFilters: handleClearFlexFilters,
         handlePopUpModal: handlePopUpModal,
         handleDeleteModal: handleDeleteModal,
         handleUploadOfflineData: handleUploadOfflineData,
@@ -973,6 +1000,13 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
         isLive: isLive,
         isLiveOffline: isLiveOffline,
     }); });
+    // INFO: notify the consumer whenever the applied flex filters change, so a
+    // parent can observe live filter state. Uses the debounced state so it fires
+    // on committed changes, not every keystroke.
+    (0, react_1.useEffect)(function () {
+        var _a, _b;
+        (_b = (_a = props.bareSettings) === null || _a === void 0 ? void 0 : _a.bareOnFlexFiltersChange) === null || _b === void 0 ? void 0 : _b.call(_a, flexFiltersDebounced);
+    }, [flexFiltersDebounced]);
     // INFO: Auto-save view state to storage whenever filters, sort, page index,
     // or column visibility change. Active for both "persistent" and "session" modes.
     var persistSaveInitialised = (0, react_1.useRef)(false);
@@ -1344,6 +1378,40 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
         (_60 = props.organise) === null || _60 === void 0 ? void 0 : _60.groupBy,
         resolvedType,
     ]);
+    /**
+     * INFO: a list tab is a different list. Switching from a file view to the
+     * table used to carry two things across: the PAGE, so a second page reached
+     * on five files opened the next tab past its two and showed nothing; and
+     * the ROWS, so the table rendered the unwound files — three rows sharing
+     * one record id — for the moment before its own fetch landed, and React,
+     * reconciling children with duplicate keys, left a stale row behind:
+     * three records showed as four. The page resets and the rows clear the
+     * instant the tab changes, and the fetch that follows starts clean.
+     *
+     * Only while a list is showing. Opening a record and coming back changes
+     * the view type on the way out and in, and that must not lose the page.
+     */
+    var previousListViewRef = (0, react_1.useRef)(null);
+    (0, react_1.useEffect)(function () {
+        var _a, _b;
+        if (resolvedType !== "list")
+            return;
+        if (previousListViewRef.current === null) {
+            previousListViewRef.current = viewType;
+            return;
+        }
+        if (previousListViewRef.current === viewType)
+            return;
+        previousListViewRef.current = viewType;
+        if (pageIndex !== 0)
+            (_b = (_a = props.organise) === null || _a === void 0 ? void 0 : _a.onChangePagination) === null || _b === void 0 ? void 0 : _b.call(_a, 0);
+        setPageIndex(0);
+        setCursor("");
+        setLastCursor("");
+        setTableLoading(true);
+        handleSetListData([], []);
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [viewType, resolvedType]);
     (0, react_1.useEffect)(function () {
         if (props.devSettings.schemaReference)
             setReferenceSchema(props.devSettings.schemaReference);
@@ -2219,11 +2287,27 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                     }
                     _m.label = 5;
                 case 5:
-                    (_g = responseData === null || responseData === void 0 ? void 0 : responseData.data) === null || _g === void 0 ? void 0 : _g.map(function (eachData) {
+                    (_g = responseData === null || responseData === void 0 ? void 0 : responseData.data) === null || _g === void 0 ? void 0 : _g.map(function (eachData, eachIndex) {
                         if (eachData["_id"]) {
                             eachData["id"] = eachData["_id"];
                             delete eachData["_id"];
                         }
+                        /**
+                         * INFO: an unwound row is a FILE, and three files of one record
+                         * share its id. Rows are keyed by id wherever they are rendered,
+                         * and React reconciling children with duplicate keys leaves stale
+                         * rows behind when the list changes under it — three records read
+                         * as four after a visit to the file view. So a file row gets an id
+                         * of its own, unique across pages, and keeps the record's id
+                         * beside it for the tile to open.
+                         */
+                        if (fileViewColumnId && eachData["id"] !== undefined) {
+                            eachData["recordId"] = eachData["id"];
+                            // INFO: limit is dropped for a grouped list, and every row then
+                            // arrives at once — the index alone keeps the id unique
+                            eachData["id"] =
+                                "".concat(eachData["id"], "#").concat((pageIndex !== null && pageIndex !== void 0 ? pageIndex : 0) * (limit !== null && limit !== void 0 ? limit : 0) + eachIndex);
+                        }
                         return null;
                     });
                     dataList = responseData.data;
@@ -7957,7 +8041,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
         if (((_a = props.organise) === null || _a === void 0 ? void 0 : _a.extendedTabs) &&
             ((_b = props.organise.extendedTabs) === null || _b === void 0 ? void 0 : _b.length) > 0) {
             (_c = props.organise) === null || _c === void 0 ? void 0 : _c.extendedTabs.map(function (eachTab) {
-                var _a, _b, _c, _d, _e, _f;
+                var _a, _b, _c, _d, _e, _f, _g;
                 var hrefPoint = "".concat(props.localURLEndpoint, "?type=").concat(resolvedType, "&collection=").concat(props.collectionId);
                 if (props.id)
                     hrefPoint += "&data=".concat(props.id);
@@ -7973,6 +8057,11 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                     calendarSettings: (_b = eachTab.calendarSettings) !== null && _b !== void 0 ? _b : undefined,
                     feedsSettings: (_c = eachTab.feedsSettings) !== null && _c !== void 0 ? _c : undefined,
                     mapSettings: (_d = eachTab.mapSettings) !== null && _d !== void 0 ? _d : undefined,
+                    // INFO: the file view reads its column from the tab it renders, so
+                    // the settings have to survive this copy. Without them the query
+                    // still unwound the column (it reads the raw extendedTabs) while
+                    // the tile had no column to read and every file said "Attachment".
+                    fileSettings: (_e = eachTab.fileSettings) !== null && _e !== void 0 ? _e : undefined,
                 };
                 if (eachTab.viewType === "iframe") {
                     if (typeof eachTab.src === "string") {
@@ -7987,7 +8076,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                 }
                 if (eachTab.type === resolvedType) {
                     tabs.push(__assign(__assign(__assign({}, tabData), (isEditor &&
-                        ((_e = props.organise) === null || _e === void 0 ? void 0 : _e.onChangeTabs) && {
+                        ((_f = props.organise) === null || _f === void 0 ? void 0 : _f.onChangeTabs) && {
                         action: (react_1.default.createElement("span", { role: "button", "data-testid": "tab-default-".concat(tabData.id), "aria-label": eachTab.defaultTab
                                 ? "Opens by default"
                                 : "Open this tab by default", className: "ml-2 self-center ".concat(eachTab.defaultTab
@@ -7997,7 +8086,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                                 e.preventDefault();
                                 handleToggleDefaultTab(eachTab.name);
                             } }, eachTab.defaultTab ? (react_1.default.createElement(HeroIcons.BookmarkIcon, { className: "h-4 w-4" })) : (react_1.default.createElement(BookmarkIcon_1.default, { className: "h-4 w-4" })))),
-                    })), (!((_f = props.edit) === null || _f === void 0 ? void 0 : _f.disabledTabsDeleteBtn) && {
+                    })), (!((_g = props.edit) === null || _g === void 0 ? void 0 : _g.disabledTabsDeleteBtn) && {
                         del: (react_1.default.createElement(outline_1.XMarkIcon, { className: "h-4 w-4 ml-2 self-center text-red-600 hover:text-red-400 ", onClick: function (e) {
                                 e.stopPropagation();
                                 e.preventDefault();
@@ -8463,7 +8552,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
         }
     };
     var renderTabContent = function (tabs, dataType, requestedViewType) {
-        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;
+        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;
         var matchedTab = tabs.find(function (eachTab) { return eachTab.id === requestedViewType; });
         /**
          * INFO: a list tab must not supply the content of a read view. The selected
@@ -8701,7 +8790,8 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                             handlePagination(value);
                         }, className: "mt-5", hidePagination: (_20 = props.organise) === null || _20 === void 0 ? void 0 : _20.hidePagination, customPaginationSize: customPaginationSize })));
             }
-            else if (selectedTabData.viewType === "file" && resolvedType === "list") {
+            else if (selectedTabData.viewType === "file" &&
+                resolvedType === "list") {
                 /**
                  * INFO: the rows are already files — the server unwound the column, so
                  * each row is one element with its record's fields alongside it. The
@@ -8714,46 +8804,99 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                  * still a direct link for when the file itself is the point.
                  */
                 var columnId_2 = (_22 = (_21 = selectedTabData.fileSettings) === null || _21 === void 0 ? void 0 : _21.columnId) !== null && _22 !== void 0 ? _22 : "";
+                var fileColumn_1 = structure.find(function (eachModel) { return eachModel.id === columnId_2; });
+                var fileImageEndpoint_1 = ((_23 = props.devSettings) === null || _23 === void 0 ? void 0 : _23.imageEndpoint) || devSettings.imageEndpoint;
+                /**
+                 * INFO: a stored file is not a url. A single file/image column holds
+                 * the download TOKEN — the file's name lives on the column
+                 * (imageFileName) and its folder on imageCollectionName + row id — and
+                 * a multiple entry is { token, fileName } with the storage object
+                 * name. Handed raw, FilePreview had nothing to draw and nothing to
+                 * name, so every tile read "Attachment". The grid and read views
+                 * rebuild the url with renderImageUrlFromPath; the tile does the same.
+                 */
+                /**
+                 * INFO: the type from the NAME we know, not from the url we build —
+                 * handleGuessMimeType, beside FilePreview, so the type decision stays
+                 * in one place. A storage url can end in something other than the
+                 * object name; the column's file name and a multiple entry's stored
+                 * name are the honest source.
+                 */
+                var handleResolveTileFile_1 = function (eachRow) {
+                    var _a, _b, _c, _d, _e, _f, _g, _h;
+                    var value = eachRow === null || eachRow === void 0 ? void 0 : eachRow[columnId_2];
+                    var rowId = String((_c = (_b = (_a = eachRow === null || eachRow === void 0 ? void 0 : eachRow.recordId) !== null && _a !== void 0 ? _a : eachRow === null || eachRow === void 0 ? void 0 : eachRow.id) !== null && _b !== void 0 ? _b : eachRow === null || eachRow === void 0 ? void 0 : eachRow._id) !== null && _c !== void 0 ? _c : "");
+                    var folder = (_d = fileColumn_1 === null || fileColumn_1 === void 0 ? void 0 : fileColumn_1.imageCollectionName) !== null && _d !== void 0 ? _d : props.collectionId;
+                    var isUrl = function (text) {
+                        return typeof text === "string" && /^https?:\/\//i.test(text);
+                    };
+                    if (isUrl(value))
+                        return { fileName: value };
+                    if (typeof value === "string" && value) {
+                        var name_1 = (_e = fileColumn_1 === null || fileColumn_1 === void 0 ? void 0 : fileColumn_1.imageFileName) !== null && _e !== void 0 ? _e : "";
+                        return {
+                            fileName: (0, blobModule_1.renderImageUrlFromPath)(fileImageEndpoint_1, folder, rowId, name_1, value, devSettings.bucketName),
+                            label: name_1 || undefined,
+                            mimeType: (0, filePreview_1.handleGuessMimeType)(name_1),
+                            token: value,
+                        };
+                    }
+                    if (value && typeof value === "object") {
+                        var name_2 = (_f = value.fileName) !== null && _f !== void 0 ? _f : "";
+                        if (isUrl(name_2))
+                            return { fileName: name_2, label: value.label };
+                        return {
+                            fileName: name_2
+                                ? (0, blobModule_1.renderImageUrlFromPath)(fileImageEndpoint_1, folder, rowId, name_2, (_g = value.token) !== null && _g !== void 0 ? _g : "", devSettings.bucketName)
+                                : "",
+                            // INFO: a multiple entry is stored as <uuid>-<name> or
+                            // <uuid><imageFileName> so entries never collide — the uuid is
+                            // not something a person recognises
+                            label: name_2.replace(/^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}-?/i, "") || undefined,
+                            mimeType: (_h = value.mimeType) !== null && _h !== void 0 ? _h : (0, filePreview_1.handleGuessMimeType)(name_2),
+                            token: value.token,
+                        };
+                    }
+                    return { fileName: "" };
+                };
                 return (react_1.default.createElement("div", { className: "mt-4" },
                     tableLoading ? (react_1.default.createElement("div", { className: "flex flex-col items-center py-10" },
                         react_1.default.createElement(loading_1.Loading, null))) : tableData.length === 0 ? (react_1.default.createElement(emptyState_1.EmptyState, { text: "No files here yet", icon: react_1.default.createElement(HeroIcons.PaperClipIcon, { className: "h-10 w-10 text-gray-400" }) })) : (
                     // INFO: the same surface the other list views sit on, so
                     // switching tabs does not change the shape of the page around
                     // the content.
-                    react_1.default.createElement("div", { className: "grid grid-cols-2 gap-4 rounded-lg p-4 sm:grid-cols-3 lg:grid-cols-4 ".concat(((_23 = props.organise) === null || _23 === void 0 ? void 0 : _23.darkMode) ? "bg-white/5" : "bg-white") }, tableData.map(function (eachRow, eachIndex) {
-                        var _a, _b, _c;
-                        return (react_1.default.createElement(filePreview_1.FilePreview, { key: "".concat((_b = (_a = eachRow === null || eachRow === void 0 ? void 0 : eachRow.id) !== null && _a !== void 0 ? _a : eachRow === null || eachRow === void 0 ? void 0 : eachRow._id) !== null && _b !== void 0 ? _b : eachIndex, "-").concat(eachIndex), variant: "tile", file: typeof (eachRow === null || eachRow === void 0 ? void 0 : eachRow[columnId_2]) === "string"
-                                ? { fileName: eachRow[columnId_2] }
-                                : ((_c = eachRow === null || eachRow === void 0 ? void 0 : eachRow[columnId_2]) !== null && _c !== void 0 ? _c : { fileName: "" }), onClick: function () {
-                                var _a, _b, _c;
+                    react_1.default.createElement("div", { className: "grid grid-cols-2 gap-4 rounded-lg p-4 sm:grid-cols-3 lg:grid-cols-4 ".concat(((_24 = props.organise) === null || _24 === void 0 ? void 0 : _24.darkMode) ? "bg-white/5" : "bg-white") }, tableData.map(function (eachRow, eachIndex) {
+                        var _a, _b;
+                        return (react_1.default.createElement(filePreview_1.FilePreview, { key: "".concat((_b = (_a = eachRow === null || eachRow === void 0 ? void 0 : eachRow.id) !== null && _a !== void 0 ? _a : eachRow === null || eachRow === void 0 ? void 0 : eachRow._id) !== null && _b !== void 0 ? _b : eachIndex, "-").concat(eachIndex), variant: "tile", file: handleResolveTileFile_1(eachRow), onClick: function () {
+                                var _a, _b, _c, _d;
                                 // INFO: `id`, not `_id`. handleGetListData renames
                                 // every row's _id to id on the way in, the same as the
                                 // other views navigate with — reading _id here handed
                                 // the read view no id at all, so General Details was
                                 // empty.
-                                return (_b = (_a = props.organise) === null || _a === void 0 ? void 0 : _a.handleNavigate) === null || _b === void 0 ? void 0 : _b.call(_a, "read", (_c = eachRow === null || eachRow === void 0 ? void 0 : eachRow.id) !== null && _c !== void 0 ? _c : eachRow === null || eachRow === void 0 ? void 0 : eachRow._id, "general");
+                                return (_b = (_a = props.organise) === null || _a === void 0 ? void 0 : _a.handleNavigate) === null || _b === void 0 ? void 0 : _b.call(_a, "read", (_d = (_c = eachRow === null || eachRow === void 0 ? void 0 : eachRow.recordId) !== null && _c !== void 0 ? _c : eachRow === null || eachRow === void 0 ? void 0 : eachRow.id) !== null && _d !== void 0 ? _d : eachRow === null || eachRow === void 0 ? void 0 : eachRow._id, "general");
                             } }));
                     }))),
                     react_1.default.createElement(pagination_1.Pagination, { data: tableData, size: size, limit: limit, cursor: cursor, pageIndex: pageIndex, paginationType: renderResolvedPaginationType(), handleUpdatePageIndex: function (value) {
                             handlePagination(value);
-                        }, darkMode: (_24 = props.organise) === null || _24 === void 0 ? void 0 : _24.darkMode, customPaginationSize: customPaginationSize })));
+                        }, darkMode: (_25 = props.organise) === null || _25 === void 0 ? void 0 : _25.darkMode, customPaginationSize: customPaginationSize })));
             }
             else if (selectedTabData.viewType === "grid") {
                 var isScrollMode = renderCheckScrollMode();
                 return (react_1.default.createElement(react_1.default.Fragment, null,
-                    react_1.default.createElement(grid_1.Grid, { darkMode: (_25 = props.organise) === null || _25 === void 0 ? void 0 : _25.darkMode, darkModeBg: (_26 = props.organise) === null || _26 === void 0 ? void 0 : _26.darkModeBg, paginationType: renderResolvedPaginationType(), data: renderGridAndListData(selectedTabData.viewImage, "grid"), size: size, limit: limit, cursor: cursor, loading: tableLoading, horizontalScroll: isScrollMode, pageIndex: pageIndex, onClickData: function (id) {
+                    react_1.default.createElement(grid_1.Grid, { darkMode: (_26 = props.organise) === null || _26 === void 0 ? void 0 : _26.darkMode, darkModeBg: (_27 = props.organise) === null || _27 === void 0 ? void 0 : _27.darkModeBg, paginationType: renderResolvedPaginationType(), data: renderGridAndListData(selectedTabData.viewImage, "grid"), size: size, limit: limit, cursor: cursor, loading: tableLoading, horizontalScroll: isScrollMode, pageIndex: pageIndex, onClickData: function (id) {
                             var _a, _b;
                             (_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: (_28 = (_27 = props.newTabUrl) === null || _27 === void 0 ? void 0 : _27.default) !== null && _28 !== void 0 ? _28 : "".concat(props.localURLEndpoint, "?data="), addNewTabUrl: (_30 = (_29 = props.newTabUrl) === null || _29 === void 0 ? void 0 : _29.addons) !== null && _30 !== void 0 ? _30 : "&type=read&collection=".concat(props.collectionId, "&view=general"), handleUpdatePageIndex: function (value) {
+                        }, linkType: props.linkType, custom: props.custom, newTabUrl: (_29 = (_28 = props.newTabUrl) === null || _28 === void 0 ? void 0 : _28.default) !== null && _29 !== void 0 ? _29 : "".concat(props.localURLEndpoint, "?data="), addNewTabUrl: (_31 = (_30 = props.newTabUrl) === null || _30 === void 0 ? void 0 : _30.addons) !== null && _31 !== void 0 ? _31 : "&type=read&collection=".concat(props.collectionId, "&view=general"), handleUpdatePageIndex: function (value) {
                             handlePagination(value);
-                        }, imgContain: selectedTabData === null || selectedTabData === void 0 ? void 0 : selectedTabData.gridContain, gridColClassName: (_31 = props.bareSettings) === null || _31 === void 0 ? void 0 : _31.bareListGridColClassName, className: "mt-5", 
+                        }, imgContain: selectedTabData === null || selectedTabData === void 0 ? void 0 : selectedTabData.gridContain, gridColClassName: (_32 = props.bareSettings) === null || _32 === void 0 ? void 0 : _32.bareListGridColClassName, className: "mt-5", 
                         // INFO: under the new DTW the grid keeps the same footer as the
                         // table and list views instead of its own legacy page buttons
-                        hidePagination: ((_32 = props.organise) === null || _32 === void 0 ? void 0 : _32.hidePagination) ||
-                            !!((_33 = props.bareSettings) === null || _33 === void 0 ? void 0 : _33.bareNewDTW), customPaginationSize: customPaginationSize }),
-                    ((_34 = props.bareSettings) === null || _34 === void 0 ? void 0 : _34.bareNewDTW) &&
-                        !((_35 = props.organise) === null || _35 === void 0 ? void 0 : _35.hidePagination) && (react_1.default.createElement(newPagination_1.NewPagination, { paginationType: renderResolvedPaginationType(), pageIndex: pageIndex, limit: limit, size: size, cursor: cursor, resultCount: renderGridAndListData(selectedTabData.viewImage, "grid")
-                            .length, customPaginationSize: customPaginationSize, darkMode: (_36 = props.organise) === null || _36 === void 0 ? void 0 : _36.darkMode, darkModeBg: (_37 = props.organise) === null || _37 === void 0 ? void 0 : _37.darkModeBg, handleUpdatePageIndex: function (value) {
+                        hidePagination: ((_33 = props.organise) === null || _33 === void 0 ? void 0 : _33.hidePagination) ||
+                            !!((_34 = props.bareSettings) === null || _34 === void 0 ? void 0 : _34.bareNewDTW), customPaginationSize: customPaginationSize }),
+                    ((_35 = props.bareSettings) === null || _35 === void 0 ? void 0 : _35.bareNewDTW) &&
+                        !((_36 = props.organise) === null || _36 === void 0 ? void 0 : _36.hidePagination) && (react_1.default.createElement(newPagination_1.NewPagination, { paginationType: renderResolvedPaginationType(), pageIndex: pageIndex, limit: limit, size: size, cursor: cursor, resultCount: renderGridAndListData(selectedTabData.viewImage, "grid")
+                            .length, customPaginationSize: customPaginationSize, darkMode: (_37 = props.organise) === null || _37 === void 0 ? void 0 : _37.darkMode, darkModeBg: (_38 = props.organise) === null || _38 === void 0 ? void 0 : _38.darkModeBg, handleUpdatePageIndex: function (value) {
                             handlePagination(value);
                         } }))));
             }
@@ -8855,7 +8998,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                     return eventAvailabilities;
                 };
                 // INFO: when bareNewDTW is enabled, render NewCalendar instead of legacy Calendar
-                if ((_38 = props.bareSettings) === null || _38 === void 0 ? void 0 : _38.bareNewDTW) {
+                if ((_39 = props.bareSettings) === null || _39 === void 0 ? void 0 : _39.bareNewDTW) {
                     var newCalendarEvents = renderEventAvailabilities().map(function (ev) {
                         var _a, _b, _c, _d;
                         return ({
@@ -8875,13 +9018,13 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                     // INFO: viewSwitch — optional Month/Week/Agenda toggle. The range
                     // query follows via calendarView ("dayGridMonth" ↔ "timeGridWeek");
                     // agenda lists the fetched month chronologically.
-                    var viewSwitchOptions = (_39 = calendarSettings_1 === null || calendarSettings_1 === void 0 ? void 0 : calendarSettings_1.viewSwitch) !== null && _39 !== void 0 ? _39 : [];
+                    var viewSwitchOptions = (_40 = calendarSettings_1 === null || calendarSettings_1 === void 0 ? void 0 : calendarSettings_1.viewSwitch) !== null && _40 !== void 0 ? _40 : [];
                     var VIEW_VARIANT_MAP = {
                         month: "fullMonth",
                         week: "weekTimeGrid",
                         agenda: "agenda",
                     };
-                    var activeVariant = (_40 = VIEW_VARIANT_MAP[newCalendarViewMode]) !== null && _40 !== void 0 ? _40 : "fullMonth";
+                    var activeVariant = (_41 = VIEW_VARIANT_MAP[newCalendarViewMode]) !== null && _41 !== void 0 ? _41 : "fullMonth";
                     return (react_1.default.createElement("div", { className: "mt-4" },
                         viewSwitchOptions.length > 1 && (react_1.default.createElement("div", { className: "mb-2 flex justify-end" },
                             react_1.default.createElement("div", { className: "inline-flex rounded-lg border border-gray-200 bg-white p-0.5" }, viewSwitchOptions.map(function (view) { return (react_1.default.createElement("button", { key: view, type: "button", onClick: function () {
@@ -8923,9 +9066,9 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                                 var _a, _b;
                                 if (event.id)
                                     (_b = (_a = props.organise) === null || _a === void 0 ? void 0 : _a.handleNavigate) === null || _b === void 0 ? void 0 : _b.call(_a, "read", event.id, "general");
-                            }, darkMode: (_41 = props.organise) === null || _41 === void 0 ? void 0 : _41.darkMode, className: "w-full" }))));
+                            }, darkMode: (_42 = props.organise) === null || _42 === void 0 ? void 0 : _42.darkMode, className: "w-full" }))));
                 }
-                return (react_1.default.createElement("div", { className: "mt-4" }, tableLoading ? (react_1.default.createElement(loading_1.Loading, null)) : (react_1.default.createElement(calendar_1.Calendar, { currentDate: calendarTabMonth, calendarView: (_42 = calendarSettings_1 === null || calendarSettings_1 === void 0 ? void 0 : calendarSettings_1.defaultView) !== null && _42 !== void 0 ? _42 : calendarView, handleMonthChange: function (date) {
+                return (react_1.default.createElement("div", { className: "mt-4" }, tableLoading ? (react_1.default.createElement(loading_1.Loading, null)) : (react_1.default.createElement(calendar_1.Calendar, { currentDate: calendarTabMonth, calendarView: (_43 = calendarSettings_1 === null || calendarSettings_1 === void 0 ? void 0 : calendarSettings_1.defaultView) !== null && _43 !== void 0 ? _43 : calendarView, handleMonthChange: function (date) {
                         var startOfMonth = (0, dayjs_1.default)(calendarTabMonth).startOf("month");
                         var endOfMonth = (0, dayjs_1.default)(calendarTabMonth).endOf("month");
                         if (!(0, dayjs_1.default)(date).isBetween(startOfMonth, endOfMonth)) {
@@ -8943,7 +9086,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
             else if (selectedTabData.viewType === "feeds") {
                 var contentList_1 = [];
                 var feedsSettings_1 = selectedTabData.feedsSettings;
-                var customFeedsData = (_43 = feedsSettings_1 === null || feedsSettings_1 === void 0 ? void 0 : feedsSettings_1.customFeedsData) === null || _43 === void 0 ? void 0 : _43.call(feedsSettings_1, tableData, spaceTableData);
+                var customFeedsData = (_44 = feedsSettings_1 === null || feedsSettings_1 === void 0 ? void 0 : feedsSettings_1.customFeedsData) === null || _44 === void 0 ? void 0 : _44.call(feedsSettings_1, tableData, spaceTableData);
                 if (customFeedsData && customFeedsData.length > 0) {
                     customFeedsData.map(function (eachData) {
                         var _a, _b, _c, _d;
@@ -8988,21 +9131,21 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                 return (react_1.default.createElement("div", { className: "mt-4" }, tableLoading ? (react_1.default.createElement(loading_1.Loading, null)) : (react_1.default.createElement("div", { 
                     // INFO: NewFeeds is already a card like the table and list, so the new
                     // DTW renders it bare; the legacy feed still needs its own surface
-                    className: ((_44 = props.bareSettings) === null || _44 === void 0 ? void 0 : _44.bareNewDTW)
+                    className: ((_45 = props.bareSettings) === null || _45 === void 0 ? void 0 : _45.bareNewDTW)
                         ? ""
-                        : "p-4 rounded-lg ".concat(((_45 = props.organise) === null || _45 === void 0 ? void 0 : _45.darkMode) ? "bg-white/5" : "bg-white") },
-                    ((_46 = props.bareSettings) === null || _46 === void 0 ? void 0 : _46.bareNewDTW) ? (react_1.default.createElement(newFeeds_1.NewFeeds, { bold: true, content: contentList_1, darkMode: (_47 = props.organise) === null || _47 === void 0 ? void 0 : _47.darkMode, onClickItem: function (id) { var _a, _b; return (_b = (_a = props.organise) === null || _a === void 0 ? void 0 : _a.handleNavigate) === null || _b === void 0 ? void 0 : _b.call(_a, "read", id, "general"); } })) : (react_1.default.createElement(feeds_1.Feeds, { bold: true, content: contentList_1, darkMode: (_48 = props.organise) === null || _48 === void 0 ? void 0 : _48.darkMode })),
+                        : "p-4 rounded-lg ".concat(((_46 = props.organise) === null || _46 === void 0 ? void 0 : _46.darkMode) ? "bg-white/5" : "bg-white") },
+                    ((_47 = props.bareSettings) === null || _47 === void 0 ? void 0 : _47.bareNewDTW) ? (react_1.default.createElement(newFeeds_1.NewFeeds, { bold: true, content: contentList_1, darkMode: (_48 = props.organise) === null || _48 === void 0 ? void 0 : _48.darkMode, onClickItem: function (id) { var _a, _b; return (_b = (_a = props.organise) === null || _a === void 0 ? void 0 : _a.handleNavigate) === null || _b === void 0 ? void 0 : _b.call(_a, "read", id, "general"); } })) : (react_1.default.createElement(feeds_1.Feeds, { bold: true, content: contentList_1, darkMode: (_49 = props.organise) === null || _49 === void 0 ? void 0 : _49.darkMode })),
                     react_1.default.createElement("div", { className: "my-10" }),
                     contentList_1.length > 0 &&
-                        !((_49 = props.organise) === null || _49 === void 0 ? void 0 : _49.hidePagination) &&
-                        ((_50 = props.bareSettings) === null || _50 === void 0 ? void 0 : _50.bareNewDTW) && (react_1.default.createElement(newPagination_1.NewPagination, { paginationType: renderResolvedPaginationType(), pageIndex: pageIndex, limit: limit, size: size, cursor: cursor, resultCount: tableData.length, customPaginationSize: customPaginationSize, darkMode: (_51 = props.organise) === null || _51 === void 0 ? void 0 : _51.darkMode, darkModeBg: (_52 = props.organise) === null || _52 === void 0 ? void 0 : _52.darkModeBg, handleUpdatePageIndex: function (value) {
+                        !((_50 = props.organise) === null || _50 === void 0 ? void 0 : _50.hidePagination) &&
+                        ((_51 = props.bareSettings) === null || _51 === void 0 ? void 0 : _51.bareNewDTW) && (react_1.default.createElement(newPagination_1.NewPagination, { paginationType: renderResolvedPaginationType(), pageIndex: pageIndex, limit: limit, size: size, cursor: cursor, resultCount: tableData.length, customPaginationSize: customPaginationSize, darkMode: (_52 = props.organise) === null || _52 === void 0 ? void 0 : _52.darkMode, darkModeBg: (_53 = props.organise) === null || _53 === void 0 ? void 0 : _53.darkModeBg, handleUpdatePageIndex: function (value) {
                             handlePagination(value);
                         } })),
                     contentList_1.length > 0 &&
-                        !((_53 = props.organise) === null || _53 === void 0 ? void 0 : _53.hidePagination) &&
-                        !((_54 = props.bareSettings) === null || _54 === void 0 ? void 0 : _54.bareNewDTW) && (react_1.default.createElement(pagination_1.Pagination, { data: tableData, size: size, limit: limit, cursor: cursor, pageIndex: pageIndex, paginationType: renderResolvedPaginationType(), handleUpdatePageIndex: function (value) {
+                        !((_54 = props.organise) === null || _54 === void 0 ? void 0 : _54.hidePagination) &&
+                        !((_55 = props.bareSettings) === null || _55 === void 0 ? void 0 : _55.bareNewDTW) && (react_1.default.createElement(pagination_1.Pagination, { data: tableData, size: size, limit: limit, cursor: cursor, pageIndex: pageIndex, paginationType: renderResolvedPaginationType(), handleUpdatePageIndex: function (value) {
                             handlePagination(value);
-                        }, darkMode: (_55 = props.organise) === null || _55 === void 0 ? void 0 : _55.darkMode, customPaginationSize: customPaginationSize }))))));
+                        }, darkMode: (_56 = props.organise) === null || _56 === void 0 ? void 0 : _56.darkMode, customPaginationSize: customPaginationSize }))))));
             }
             else if (selectedTabData.viewType === "map") {
                 var mapSettings_1 = selectedTabData.mapSettings;
@@ -9101,7 +9244,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
             }
             else if (selectedTabData.viewType === "kanban") {
                 var kanbanSettings = selectedTab === null || selectedTab === void 0 ? void 0 : selectedTab.kanbanSettings;
-                var kanbanTitle_2 = (_56 = kanbanSettings === null || kanbanSettings === void 0 ? void 0 : kanbanSettings.title) !== null && _56 !== void 0 ? _56 : "";
+                var kanbanTitle_2 = (_57 = kanbanSettings === null || kanbanSettings === void 0 ? void 0 : kanbanSettings.title) !== null && _57 !== void 0 ? _57 : "";
                 var nullColumn_1 = false;
                 var groupBy_1 = [];
                 var groupLabel_1 = [];
@@ -9122,10 +9265,10 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                 });
                 var kanbanData = renderGridAndListData("", "kanban", kanbanTitle_2, kanbanSettings === null || kanbanSettings === void 0 ? void 0 : kanbanSettings.useColumnName);
                 // INFO: when bareNewDTW is enabled, render NewKanban instead of legacy Kanban
-                if ((_57 = props.bareSettings) === null || _57 === void 0 ? void 0 : _57.bareNewDTW) {
+                if ((_58 = props.bareSettings) === null || _58 === void 0 ? void 0 : _58.bareNewDTW) {
                     return (react_1.default.createElement(newKanban_1.NewKanban, { className: "inline-flex", data: kanbanData, loading: tableLoading, groupBy: groupBy_1, groupId: kanbanTitle_2 !== null && kanbanTitle_2 !== void 0 ? kanbanTitle_2 : "", groupLabel: groupLabel_1.length > 0 ? groupLabel_1 : undefined, nullColumn: nullColumn_1, alertMessage: kanbanData.length === limit
                             ? "Data has exceeded limit, please apply filters"
-                            : "", groupCluster: kanbanSettings === null || kanbanSettings === void 0 ? void 0 : kanbanSettings.groupCluster, draggable: true, droppable: kanbanDroppable, mobileView: (_58 = props.bareSettings) === null || _58 === void 0 ? void 0 : _58.bareListMobileView, onUpdateData: function (cardId, _fromCol, toCol) {
+                            : "", groupCluster: kanbanSettings === null || kanbanSettings === void 0 ? void 0 : kanbanSettings.groupCluster, draggable: true, droppable: kanbanDroppable, mobileView: (_59 = props.bareSettings) === null || _59 === void 0 ? void 0 : _59.bareListMobileView, onUpdateData: function (cardId, _fromCol, toCol) {
                             var _a;
                             setKanbanDroppable(false);
                             handleSubmitData("update", cardId, kanbanTitle_2, (_a = {},
@@ -9134,7 +9277,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                         }, onClickData: function (id) {
                             var _a, _b;
                             (_b = (_a = props.organise) === null || _a === void 0 ? void 0 : _a.handleNavigate) === null || _b === void 0 ? void 0 : _b.call(_a, "read", id, "general");
-                        }, darkMode: (_59 = props.organise) === null || _59 === void 0 ? void 0 : _59.darkMode }));
+                        }, darkMode: (_60 = props.organise) === null || _60 === void 0 ? void 0 : _60.darkMode }));
                 }
                 return (react_1.default.createElement(kanban_1.Kanban, { className: "inline-flex", data: kanbanData, loading: tableLoading, groupBy: groupBy_1, groupId: kanbanTitle_2 !== null && kanbanTitle_2 !== void 0 ? kanbanTitle_2 : "", groupLabel: groupLabel_1.length > 0 ? groupLabel_1 : undefined, nullColumn: nullColumn_1, alertMessage: kanbanData.length === limit
                         ? "Data has exceeded limit, please apply filters"