blixify-ui-web 1.2.23 → 1.2.25

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

@@ -117,6 +117,10 @@ var modal_1 = require("../../display/modal");
 var notification_1 = require("../../display/notification");
 var stepper_1 = require("../../display/stepper");
 var table_1 = require("../../display/table");
+var newTable_1 = require("../../display/newTable");
+var newList_1 = require("../../display/newList");
+var newKanban_1 = require("../../display/newKanban");
+var newCalendar_1 = require("../../display/newCalendar");
 var address_1 = require("../../input/address");
 var canvas_1 = require("../../input/canvas");
 var form_1 = require("../../input/form");
@@ -2599,8 +2603,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                                         }); }))];
                                 case 2:
                                     _c.sent();
-                                    hadValidEntries = uploadedData_1.length > 0 ||
-                                        selectedField["upload"].length === 0;
+                                    hadValidEntries = uploadedData_1.length > 0 || selectedField["upload"].length === 0;
                                     if (!hadValidEntries)
                                         return [2 /*return*/, selectedField];
                                     return [2 /*return*/, selectedField["data"].concat(uploadedData_1)];
@@ -3770,17 +3773,17 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
         });
     }); };
     var handleSubmitData = function (type, rowId, columnId, data, offlineId, isOfflineUpdate, isDraft) { return __awaiter(void 0, void 0, void 0, function () {
-        var selectedId, id, createSelectedData_1, uniqueDataStructure, uniqueColumnId, res, offlineDataResp, offlineData, clonedForOffline, tempData, selectedIndex_3, err_20, isExistingDoc, newRecordData_1, changedAttributeIds, baseDraftValue, hasBaseDraftChange, offlineDataResp, clonedForOffline, tempData, selectedIndex_4, offlineData, err_21, dataToSubmit_2, changedAttributeIds, baseDraftValue, hasBaseDraftChange, operationType, selectedIndex_5, dataId, err_22, offlineDataResp, offlineData, clonedForOffline, tempData, selectedIndex_6, _a;
-        var _b, _c;
-        var _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
-        return __generator(this, function (_w) {
-            switch (_w.label) {
+        var selectedId, id, createSelectedData_1, uniqueDataStructure, uniqueColumnId, res, offlineDataResp, offlineData, clonedForOffline, tempData, selectedIndex_3, err_20, isExistingDoc, newRecordData_1, changedAttributeIds, baseDraftValue, hasBaseDraftChange, offlineDataResp, clonedForOffline, tempData, selectedIndex_4, offlineData, err_21, dataToSubmit_2, changedAttributeIds, baseDraftValue, hasBaseDraftChange, operationType, selectedIndex_5, wentToServer, dataId, err_22, offlineDataResp, offlineData, clonedForOffline, tempData, selectedIndex_6, _a;
+        var _b, _c, _d;
+        var _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
+        return __generator(this, function (_y) {
+            switch (_y.label) {
                 case 0:
                     selectedId = "";
                     id = "";
-                    _w.label = 1;
+                    _y.label = 1;
                 case 1:
-                    _w.trys.push([1, 37, , 43]);
+                    _y.trys.push([1, 39, , 45]);
                     if (type === "update")
                         selectedId = rowId !== null && rowId !== void 0 ? rowId : "";
                     else if (type === "create")
@@ -3798,24 +3801,26 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                             id = (0, uuid_1.v4)();
                     }
                     else
-                        id = (_d = props.id) !== null && _d !== void 0 ? _d : "";
+                        id = (_e = props.id) !== null && _e !== void 0 ? _e : "";
                     if (offlineId) {
                         selectedId = offlineId;
                         id = offlineId;
                     }
-                    if (!(isOffline && !(isOfflineNetworkListener && !isNetworkOffline) && !offlineId)) return [3 /*break*/, 2];
+                    if (!(isOffline &&
+                        !(isOfflineNetworkListener && !isNetworkOffline) &&
+                        !offlineId)) return [3 /*break*/, 2];
                     createSelectedData_1 = selectedData;
                     return [3 /*break*/, 4];
                 case 2: return [4 /*yield*/, handleUploadImage(id, data)];
                 case 3:
-                    createSelectedData_1 = _w.sent();
-                    _w.label = 4;
+                    createSelectedData_1 = _y.sent();
+                    _y.label = 4;
                 case 4:
                     uniqueDataStructure = structure.filter(function (eachStructure) {
                         return eachStructure.unique;
                     });
                     uniqueColumnId = uniqueDataStructure.length > 0 ? uniqueDataStructure[0].id : undefined;
-                    if ((_e = props.bareSettings) === null || _e === void 0 ? void 0 : _e.bareUpdatePrefill) {
+                    if ((_f = props.bareSettings) === null || _f === void 0 ? void 0 : _f.bareUpdatePrefill) {
                         props.bareSettings.bareUpdatePrefill(selectedData).map(function (eachField) {
                             var key = eachField.key, value = eachField.value;
                             createSelectedData_1[key] = value;
@@ -3829,13 +3834,13 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                     if (isDraft)
                         createSelectedData_1["baseDraft"] = true;
                     if (!isOffline) return [3 /*break*/, 10];
-                    _w.label = 5;
+                    _y.label = 5;
                 case 5:
-                    _w.trys.push([5, 8, , 9]);
+                    _y.trys.push([5, 8, , 9]);
                     return [4 /*yield*/, indexedDb_1.indexedDb.getValue("local", props.collectionId)];
                 case 6:
-                    offlineDataResp = _w.sent();
-                    offlineData = (_f = offlineDataResp === null || offlineDataResp === void 0 ? void 0 : offlineDataResp.data) !== null && _f !== void 0 ? _f : [];
+                    offlineDataResp = _y.sent();
+                    offlineData = (_g = offlineDataResp === null || offlineDataResp === void 0 ? void 0 : offlineDataResp.data) !== null && _g !== void 0 ? _g : [];
                     clonedForOffline = (0, updateModule_1.handleClonedDataAttribute)(selectedData, structure, props.devSettings.server, true, showId);
                     tempData = (0, updateModule_1.handleParseOfflineWrite)(clonedForOffline, structure);
                     // INFO: Stamp the _id on the offline entry so subsequent saves can find and update it
@@ -3878,22 +3883,22 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                             type: props.collectionId,
                         })];
                 case 7:
-                    _w.sent();
+                    _y.sent();
                     res = true;
                     return [3 /*break*/, 9];
                 case 8:
-                    err_20 = _w.sent();
+                    err_20 = _y.sent();
                     return [3 /*break*/, 9];
                 case 9: return [3 /*break*/, 16];
                 case 10:
                     if (!((idField && selectedData[idField]) ||
-                        ((_g = props.bareSettings) === null || _g === void 0 ? void 0 : _g.bareUpsertPartialUpdate))) return [3 /*break*/, 12];
-                    isExistingDoc = ((_h = props.bareSettings) === null || _h === void 0 ? void 0 : _h.bareUpsertPartialUpdate) &&
+                        ((_h = props.bareSettings) === null || _h === void 0 ? void 0 : _h.bareUpsertPartialUpdate))) return [3 /*break*/, 12];
+                    isExistingDoc = ((_j = props.bareSettings) === null || _j === void 0 ? void 0 : _j.bareUpsertPartialUpdate) &&
                         loadedSelectedData.current != null;
                     if (isExistingDoc) {
                         changedAttributeIds = (0, updateModule_1.compareUpdatedFields)(loadedSelectedData.current, createSelectedData_1).changedAttributeIds;
                         baseDraftValue = isDraft ? true : false;
-                        hasBaseDraftChange = ((_k = (_j = loadedSelectedData.current) === null || _j === void 0 ? void 0 : _j["baseDraft"]) !== null && _k !== void 0 ? _k : false) !==
+                        hasBaseDraftChange = ((_l = (_k = loadedSelectedData.current) === null || _k === void 0 ? void 0 : _k["baseDraft"]) !== null && _l !== void 0 ? _l : false) !==
                             baseDraftValue;
                         // INFO: if nothing changed (including baseDraft), skip the write
                         if (changedAttributeIds.length === 0 && !hasBaseDraftChange)
@@ -3944,7 +3949,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                             upsert: true,
                         })];
                 case 11:
-                    res = _w.sent();
+                    res = _y.sent();
                     return [3 /*break*/, 16];
                 case 12:
                     // INFO: stepper create guard — if a create is already in-flight, queue this
@@ -3964,7 +3969,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                         })];
                 case 13:
                     //INFO: [CREATE] Create new data
-                    res = _w.sent();
+                    res = _y.sent();
                     if (!(selectedId === "new")) return [3 /*break*/, 16];
                     isCreatingRef.current = false;
                     if (!pendingDraftSaveRef.current) return [3 /*break*/, 15];
@@ -3976,21 +3981,23 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                         })];
                 case 14:
                     // INFO: replay as update — inflightIdRef.current holds the real _id
-                    _w.sent();
-                    _w.label = 15;
+                    _y.sent();
+                    _y.label = 15;
                 case 15:
                     inflightIdRef.current = "";
-                    _w.label = 16;
+                    _y.label = 16;
                 case 16: return [3 /*break*/, 25];
                 case 17:
                     if (!selectedId) return [3 /*break*/, 25];
-                    if (!(isOffline && !(isOfflineNetworkListener && !isNetworkOffline) && !offlineId)) return [3 /*break*/, 23];
-                    _w.label = 18;
+                    if (!(isOffline &&
+                        !(isOfflineNetworkListener && !isNetworkOffline) &&
+                        !offlineId)) return [3 /*break*/, 23];
+                    _y.label = 18;
                 case 18:
-                    _w.trys.push([18, 21, , 22]);
+                    _y.trys.push([18, 21, , 22]);
                     return [4 /*yield*/, indexedDb_1.indexedDb.getValue("local", props.collectionId)];
                 case 19:
-                    offlineDataResp = _w.sent();
+                    offlineDataResp = _y.sent();
                     clonedForOffline = (0, updateModule_1.handleClonedDataAttribute)(selectedData, structure, props.devSettings.server, true, showId);
                     tempData = (0, updateModule_1.handleParseOfflineWrite)(clonedForOffline, structure);
                     tempData[serverId] = selectedId;
@@ -4002,7 +4009,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                     tempData.syncStatus = "pending";
                     tempData.baseOnline = true; // INFO: existing server doc, updated offline
                     selectedIndex_4 = -1;
-                    offlineData = (_l = offlineDataResp === null || offlineDataResp === void 0 ? void 0 : offlineDataResp.data) !== null && _l !== void 0 ? _l : [];
+                    offlineData = (_m = offlineDataResp === null || offlineDataResp === void 0 ? void 0 : offlineDataResp.data) !== null && _m !== void 0 ? _m : [];
                     offlineData.map(function (eachOfflineData, index) {
                         var offlineDataId = eachOfflineData[serverId];
                         if (selectedId === offlineDataId)
@@ -4032,11 +4039,11 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                             type: props.collectionId,
                         })];
                 case 20:
-                    _w.sent();
+                    _y.sent();
                     res = true;
                     return [3 /*break*/, 22];
                 case 21:
-                    err_21 = _w.sent();
+                    err_21 = _y.sent();
                     return [3 /*break*/, 22];
                 case 22: return [3 /*break*/, 25];
                 case 23:
@@ -4045,10 +4052,10 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                             _b[columnId] = createSelectedData_1[columnId],
                             _b);
                     }
-                    else if ((_m = props.bareSettings) === null || _m === void 0 ? void 0 : _m.bareUpsertPartialUpdate) {
-                        changedAttributeIds = (0, updateModule_1.compareUpdatedFields)((_o = loadedSelectedData.current) !== null && _o !== void 0 ? _o : {}, createSelectedData_1).changedAttributeIds;
+                    else if ((_o = props.bareSettings) === null || _o === void 0 ? void 0 : _o.bareUpsertPartialUpdate) {
+                        changedAttributeIds = (0, updateModule_1.compareUpdatedFields)((_p = loadedSelectedData.current) !== null && _p !== void 0 ? _p : {}, createSelectedData_1).changedAttributeIds;
                         baseDraftValue = isDraft ? true : false;
-                        hasBaseDraftChange = ((_q = (_p = loadedSelectedData.current) === null || _p === void 0 ? void 0 : _p["baseDraft"]) !== null && _q !== void 0 ? _q : false) !==
+                        hasBaseDraftChange = ((_r = (_q = loadedSelectedData.current) === null || _q === void 0 ? void 0 : _q["baseDraft"]) !== null && _r !== void 0 ? _r : false) !==
                             baseDraftValue;
                         // INFO: if nothing changed (including baseDraft), skip the write entirely
                         if (changedAttributeIds.length === 0 && !hasBaseDraftChange)
@@ -4117,13 +4124,13 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                             // doesn't exist yet (covers deterministicId passed directly as props.id).
                             // Also applies to offline upload path so the doc is created if it was
                             // deleted between the existence check and the write call.
-                            upsert: ((_r = props.bareSettings) === null || _r === void 0 ? void 0 : _r.bareUpsertPartialUpdate) && !isOfflineUpdate
+                            upsert: ((_s = props.bareSettings) === null || _s === void 0 ? void 0 : _s.bareUpsertPartialUpdate) && !isOfflineUpdate
                                 ? true
                                 : undefined,
                         })];
                 case 24:
-                    res = _w.sent();
-                    _w.label = 25;
+                    res = _y.sent();
+                    _y.label = 25;
                 case 25:
                     if (!(type === "update" || type === "create")) return [3 /*break*/, 33];
                     if (!res) return [3 /*break*/, 32];
@@ -4139,28 +4146,37 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                     });
                     return [4 /*yield*/, handleGetListData({ data: tableData[selectedIndex_5] }, "update", rowId)];
                 case 26:
-                    _w.sent();
-                    _w.label = 27;
+                    _y.sent();
+                    _y.label = 27;
                 case 27: return [3 /*break*/, 30];
                 case 28: return [4 /*yield*/, handleGetListData({ data: [createSelectedData_1] }, "create")];
                 case 29:
-                    _w.sent();
-                    _w.label = 30;
+                    _y.sent();
+                    _y.label = 30;
                 case 30:
-                    if (!((_s = props.bareSettings) === null || _s === void 0 ? void 0 : _s.bareUpdateHandlePostComplete)) return [3 /*break*/, 32];
+                    if (!((_t = props.bareSettings) === null || _t === void 0 ? void 0 : _t.bareUpdateHandlePostComplete)) return [3 /*break*/, 32];
                     return [4 /*yield*/, props.bareSettings.bareUpdateHandlePostComplete(__assign((_c = {}, _c[serverId] = id, _c), createSelectedData_1))];
                 case 31:
-                    _w.sent();
-                    _w.label = 32;
-                case 32: return [3 /*break*/, 36];
+                    _y.sent();
+                    _y.label = 32;
+                case 32: return [3 /*break*/, 38];
                 case 33:
                     createSelectedData_1[serverId] = id;
                     if (!!isOffline) return [3 /*break*/, 35];
                     return [4 /*yield*/, handleGetListData({ data: [createSelectedData_1] }, selectedId === "new" ? "create" : "update", id)];
                 case 34:
-                    _w.sent();
-                    _w.label = 35;
+                    _y.sent();
+                    _y.label = 35;
                 case 35:
+                    wentToServer = res &&
+                        !offlineId &&
+                        (!isOffline || (isOfflineNetworkListener && !isNetworkOffline));
+                    if (!(wentToServer && ((_u = props.bareSettings) === null || _u === void 0 ? void 0 : _u.bareUpdateHandlePostComplete))) return [3 /*break*/, 37];
+                    return [4 /*yield*/, props.bareSettings.bareUpdateHandlePostComplete(__assign((_d = {}, _d[serverId] = id, _d), createSelectedData_1))];
+                case 36:
+                    _y.sent();
+                    _y.label = 37;
+                case 37:
                     setNotification({
                         type: true,
                         title: props.id === "new"
@@ -4170,12 +4186,12 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                             ? "Data sucessfully created"
                             : "Data sucessfully updated",
                     });
-                    _w.label = 36;
-                case 36:
+                    _y.label = 38;
+                case 38:
                     dataId = res ? id : "";
                     return [2 /*return*/, dataId];
-                case 37:
-                    err_22 = _w.sent();
+                case 39:
+                    err_22 = _y.sent();
                     console.log("error", err_22);
                     // INFO: clear in-flight guard on failure so the next save retries as a create
                     if (isCreatingRef.current) {
@@ -4183,18 +4199,18 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                         pendingDraftSaveRef.current = false;
                         inflightIdRef.current = "";
                     }
-                    if (!(((_t = props.bareSettings) === null || _t === void 0 ? void 0 : _t.bareOffline) &&
+                    if (!(((_v = props.bareSettings) === null || _v === void 0 ? void 0 : _v.bareOffline) &&
                         id &&
                         !offlineId &&
                         !isOfflineUpdate &&
-                        !err_22.response)) return [3 /*break*/, 42];
-                    _w.label = 38;
-                case 38:
-                    _w.trys.push([38, 41, , 42]);
+                        !err_22.response)) return [3 /*break*/, 44];
+                    _y.label = 40;
+                case 40:
+                    _y.trys.push([40, 43, , 44]);
                     return [4 /*yield*/, indexedDb_1.indexedDb.getValue("local", props.collectionId)];
-                case 39:
-                    offlineDataResp = _w.sent();
-                    offlineData = (_u = offlineDataResp === null || offlineDataResp === void 0 ? void 0 : offlineDataResp.data) !== null && _u !== void 0 ? _u : [];
+                case 41:
+                    offlineDataResp = _y.sent();
+                    offlineData = (_w = offlineDataResp === null || offlineDataResp === void 0 ? void 0 : offlineDataResp.data) !== null && _w !== void 0 ? _w : [];
                     clonedForOffline = (0, updateModule_1.handleClonedDataAttribute)(selectedData, structure, props.devSettings.server, true, showId);
                     tempData = (0, updateModule_1.handleParseOfflineWrite)(clonedForOffline, structure);
                     if (!tempData[serverId])
@@ -4230,8 +4246,8 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                             data: offlineData,
                             type: props.collectionId,
                         })];
-                case 40:
-                    _w.sent();
+                case 42:
+                    _y.sent();
                     setNotification({
                         type: false,
                         title: selectedId === "new"
@@ -4242,12 +4258,12 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                     handleCheckOfflineDataLength();
                     // INFO: return id so handleSubmit can navigate as if the save succeeded
                     return [2 /*return*/, id];
-                case 41:
-                    _a = _w.sent();
-                    return [3 /*break*/, 42];
-                case 42:
+                case 43:
+                    _a = _y.sent();
+                    return [3 /*break*/, 44];
+                case 44:
                     if (err_22.response && err_22.response.status === 400) {
-                        if (typeof ((_v = err_22.response.data) === null || _v === void 0 ? void 0 : _v.err) === "string")
+                        if (typeof ((_x = err_22.response.data) === null || _x === void 0 ? void 0 : _x.err) === "string")
                             setNotification({
                                 type: false,
                                 title: "Error",
@@ -4260,8 +4276,8 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                                 msg: "Please contact our administrator for assistance or try your request again later. We apologize for any inconvenience",
                             });
                     }
-                    return [3 /*break*/, 43];
-                case 43: return [2 /*return*/];
+                    return [3 /*break*/, 45];
+                case 45: return [2 /*return*/];
             }
         });
     }); };
@@ -7198,7 +7214,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
         return (react_1.default.createElement(settingsModal_1.ExpressionModal, { selectedId: id, model: structure, renderReferenceLabelOptions: (_a = props.organise) === null || _a === void 0 ? void 0 : _a.renderReferenceLabelOptions, renderReferenceSpaceOptions: (_b = props.organise) === null || _b === void 0 ? void 0 : _b.renderReferenceSpaceOptions, onAddModelSchema: (_c = props.organise) === null || _c === void 0 ? void 0 : _c.onAddColumns, onClose: onClose }));
     };
     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;
+        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;
         if (groupId) {
             var groupAttributeDS_1 = structure.find(function (eachDS) { return eachDS.id === groupId; });
             var groupedSpaceTableData = spaceTableData.reduce(function (acc, eachData) {
@@ -7321,25 +7337,131 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
             }
         }
         else {
-            return (react_1.default.createElement(table_1.Table, { showId: showId, paginationType: renderResolvedPaginationType(), data: tableData, spaceData: spaceTableData !== null && spaceTableData !== void 0 ? spaceTableData : [], 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: (_b = (_a = props.organise) === null || _a === void 0 ? void 0 : _a.disableSelectFullData) === null || _b === void 0 ? void 0 : _b.table, multiActionButton: react_1.default.createElement("div", { className: "flex flex-row space-x-3" },
+            // INFO: when bareNewDTW is enabled, render NewTable instead of legacy Table
+            if ((_a = props.bareSettings) === null || _a === void 0 ? void 0 : _a.bareNewDTW) {
+                return (react_1.default.createElement(newTable_1.NewTable, { showId: showId, paginationType: renderResolvedPaginationType(), data: tableData, spaceData: spaceTableData !== null && spaceTableData !== void 0 ? spaceTableData : [], 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: (_c = (_b = props.organise) === null || _b === void 0 ? void 0 : _b.disableSelectFullData) === null || _c === void 0 ? void 0 : _c.table, mobileView: (_d = props.bareSettings) === null || _d === void 0 ? void 0 : _d.bareListMobileView, mobileTooltip: (_e = props.bareSettings) === null || _e === void 0 ? void 0 : _e.bareMobileTooltip, multiActionFloatingBtns: __spreadArray(__spreadArray(__spreadArray(__spreadArray([], (!((_f = props.edit) === null || _f === void 0 ? void 0 : _f.disabledUpdate) &&
+                        !((_g = props.bareSettings) === null || _g === void 0 ? void 0 : _g.bareHideTableExtraMultipleAction)
+                        ? [
+                            {
+                                id: "draft",
+                                btnText: "Change to Draft",
+                                onClick: function () { return handleBatchDraftData(); },
+                                hide: selectedIds.length === 0,
+                            },
+                            {
+                                id: "clone",
+                                btnText: "Clone Items",
+                                onClick: function () { return handleCloneSelectedData(); },
+                                hide: selectedIds.length === 0,
+                            },
+                        ]
+                        : []), true), (((_h = props.edit) === null || _h === void 0 ? void 0 : _h.deleteBtn)
+                        ? [
+                            {
+                                id: "delete",
+                                btnText: "Delete",
+                                onClick: function () {
+                                    handleGenerateDeletePasscode();
+                                    setDeleteModal(true);
+                                },
+                            },
+                        ]
+                        : []), true), (!isFirebase && !((_j = props.edit) === null || _j === void 0 ? void 0 : _j.disableBatchUpdate)
+                        ? [
+                            {
+                                id: "update",
+                                btnText: "Update",
+                                onClick: function () { return setBatchUpdateModal(true); },
+                            },
+                        ]
+                        : []), true), (((_k = props.bareSettings) === null || _k === void 0 ? void 0 : _k.bareListMultipleSelectAddtionalActions)
+                        ? props.bareSettings.bareListMultipleSelectAddtionalActions.map(function (eachButton) { return ({
+                            id: "dt-list-multi-action-btn-" + eachButton.text,
+                            btnText: eachButton.text,
+                            onClick: function () {
+                                var _a, _b;
+                                return (_a = eachButton.onClick) === null || _a === void 0 ? void 0 : _a.call(eachButton, selectedIds, selectAll, (_b = renderImpSearchFilterConditions()) !== null && _b !== void 0 ? _b : []);
+                            },
+                        }); })
+                        : []), true), multiActionFloatingOffset: (_l = props.bareSettings) === null || _l === void 0 ? void 0 : _l.bareListFloatingActionOffset, handleSelectAll: handleSelectAllPages, handleSelectedIds: handleSelectIds, header: renderTableHeader(), pageIndex: pageIndex !== null && pageIndex !== void 0 ? pageIndex : 0, onClickRow: 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: (_o = (_m = props.newTabUrl) === null || _m === void 0 ? void 0 : _m.default) !== null && _o !== void 0 ? _o : "".concat(props.localURLEndpoint, "?data="), addNewTabUrl: (_q = (_p = props.newTabUrl) === null || _p === void 0 ? void 0 : _p.addons) !== null && _q !== void 0 ? _q : "&type=read&collection=".concat(props.collectionId, "&view=general"), handleUpdatePageIndex: function (value) {
+                        handlePagination(value);
+                    }, className: "mt-5", devSettings: props.devSettings, bareSettings: props.bareSettings, fixedPagination: (_r = props.organise) === null || _r === void 0 ? void 0 : _r.fixedPagination, advSettings: {
+                        addColumnEnabled: (_s = props.organise) === null || _s === void 0 ? void 0 : _s.addColumnEnabled,
+                        renderAddColumnElements: renderAddMathColumn,
+                        dragEnabled: (_t = props.organise) === null || _t === void 0 ? void 0 : _t.advDragEnabled,
+                        sortEnabled: (_u = props.organise) === null || _u === void 0 ? void 0 : _u.advSortEnabled,
+                        filterEnabled: ((_v = props.bareSettings) === null || _v === void 0 ? void 0 : _v.bareFlexFilters)
+                            ? false
+                            : (_w = props.organise) === null || _w === void 0 ? void 0 : _w.advFilterEnabled,
+                        sortId: (_x = props.organise) === null || _x === void 0 ? void 0 : _x.sort,
+                        sortOptions: (_z = (_y = props.organise) === null || _y === void 0 ? void 0 : _y.renderReferenceLabelOptions) === null || _z === void 0 ? void 0 : _z.call(_y),
+                        onSortColumn: (_0 = props.organise) === null || _0 === void 0 ? void 0 : _0.onChangeSort,
+                        onDragColumn: (_1 = props.organise) === null || _1 === void 0 ? void 0 : _1.onChangeDrag,
+                        filterOptions: additionalQuery === null || additionalQuery === void 0 ? void 0 : additionalQuery.map(function (eachQuery) {
+                            var _a;
+                            return {
+                                key: eachQuery.value,
+                                label: (_a = eachQuery.label) !== null && _a !== void 0 ? _a : "",
+                            };
+                        }),
+                        renderFilterElements: function (id) {
+                            var selectedQuery = additionalQuery === null || additionalQuery === void 0 ? void 0 : additionalQuery.filter(function (eachQuery) {
+                                return eachQuery.value === id;
+                            });
+                            var selectedModelList = structure.filter(function (eachModel) { return eachModel.id === id; });
+                            var newQuery = (0, listModule_1.renderSearchAdditionalQueries)(selectedModelList, selectedQuery);
+                            return renderSearchContent(newQuery);
+                        },
+                    }, editable: {
+                        active: ((_2 = props.edit) === null || _2 === void 0 ? void 0 : _2.listEditable) && !props.edit.disabledUpdate
+                            ? true
+                            : false,
+                        onUpdateData: function (rowId, columnId, data) { return __awaiter(void 0, void 0, void 0, function () {
+                            return __generator(this, function (_a) {
+                                switch (_a.label) {
+                                    case 0: return [4 /*yield*/, handleSubmitData("update", rowId, columnId, data)];
+                                    case 1:
+                                        _a.sent();
+                                        return [2 /*return*/];
+                                }
+                            });
+                        }); },
+                    }, addable: {
+                        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 () {
+                            return __generator(this, function (_a) {
+                                switch (_a.label) {
+                                    case 0: return [4 /*yield*/, handleSubmitData("create", "", "", data)];
+                                    case 1:
+                                        _a.sent();
+                                        return [2 /*return*/];
+                                }
+                            });
+                        }); },
+                    }, darkMode: (_4 = props.organise) === null || _4 === void 0 ? void 0 : _4.darkMode, hidePagination: (_5 = props.organise) === null || _5 === void 0 ? void 0 : _5.hidePagination, 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 : [], 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, multiActionButton: react_1.default.createElement("div", { className: "flex flex-row space-x-3" },
                     selectedIds.length > 0 &&
-                        !((_c = props.edit) === null || _c === void 0 ? void 0 : _c.disabledUpdate) &&
-                        !((_d = props.bareSettings) === null || _d === void 0 ? void 0 : _d.bareHideTableExtraMultipleAction) && (react_1.default.createElement(react_1.default.Fragment, null,
+                        !((_10 = props.edit) === null || _10 === void 0 ? void 0 : _10.disabledUpdate) &&
+                        !((_11 = props.bareSettings) === null || _11 === void 0 ? void 0 : _11.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();
                             } }),
                         react_1.default.createElement(textButton_1.TextButton, { className: "text-sm", text: "Clone Items", disable: loading, onClick: function () {
                                 handleCloneSelectedData();
                             } }))),
-                    ((_e = props.edit) === null || _e === void 0 ? void 0 : _e.deleteBtn) && (react_1.default.createElement(textButton_1.TextButton, { className: "text-sm text-red-500 hover:text-red-600", text: "Delete", onClick: function () {
+                    ((_12 = props.edit) === null || _12 === void 0 ? void 0 : _12.deleteBtn) && (react_1.default.createElement(textButton_1.TextButton, { className: "text-sm text-red-500 hover:text-red-600", text: "Delete", onClick: function () {
                             handleGenerateDeletePasscode();
                             setDeleteModal(true);
                         } })),
-                    !isFirebase && !((_f = props.edit) === null || _f === void 0 ? void 0 : _f.disableBatchUpdate) && (react_1.default.createElement(textButton_1.TextButton, { className: "text-sm", text: "Update", onClick: function () {
+                    !isFirebase && !((_13 = props.edit) === null || _13 === void 0 ? void 0 : _13.disableBatchUpdate) && (react_1.default.createElement(textButton_1.TextButton, { className: "text-sm", text: "Update", onClick: function () {
                             setBatchUpdateModal(true);
                         } })),
-                    ((_g = props.bareSettings) === null || _g === void 0 ? void 0 : _g.bareListMultipleSelectAddtionalActions) &&
-                        ((_j = (_h = props.bareSettings) === null || _h === void 0 ? void 0 : _h.bareListMultipleSelectAddtionalActions) === null || _j === void 0 ? void 0 : _j.map(function (eachButton) {
+                    ((_14 = props.bareSettings) === null || _14 === void 0 ? void 0 : _14.bareListMultipleSelectAddtionalActions) &&
+                        ((_16 = (_15 = props.bareSettings) === null || _15 === void 0 ? void 0 : _15.bareListMultipleSelectAddtionalActions) === null || _16 === void 0 ? void 0 : _16.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 : []);
@@ -7347,20 +7469,20 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                         }))), handleSelectAll: handleSelectAllPages, handleSelectedIds: handleSelectIds, header: renderTableHeader(), pageIndex: pageIndex !== null && pageIndex !== void 0 ? pageIndex : 0, onClickRow: 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: (_l = (_k = props.newTabUrl) === null || _k === void 0 ? void 0 : _k.default) !== null && _l !== void 0 ? _l : "".concat(props.localURLEndpoint, "?data="), addNewTabUrl: (_o = (_m = props.newTabUrl) === null || _m === void 0 ? void 0 : _m.addons) !== null && _o !== void 0 ? _o : "&type=read&collection=".concat(props.collectionId, "&view=general"), handleUpdatePageIndex: function (value) {
+                }, linkType: props.linkType, custom: props.custom, newTabUrl: (_18 = (_17 = props.newTabUrl) === null || _17 === void 0 ? void 0 : _17.default) !== null && _18 !== void 0 ? _18 : "".concat(props.localURLEndpoint, "?data="), addNewTabUrl: (_20 = (_19 = props.newTabUrl) === null || _19 === void 0 ? void 0 : _19.addons) !== null && _20 !== void 0 ? _20 : "&type=read&collection=".concat(props.collectionId, "&view=general"), handleUpdatePageIndex: function (value) {
                     handlePagination(value);
-                }, className: "mt-5", lib: { axios: (_p = props.lib) === null || _p === void 0 ? void 0 : _p.axios }, devSettings: props.devSettings, bareSettings: props.bareSettings, fixedPagination: (_q = props.organise) === null || _q === void 0 ? void 0 : _q.fixedPagination, advSettings: {
-                    addColumnEnabled: (_r = props.organise) === null || _r === void 0 ? void 0 : _r.addColumnEnabled,
+                }, className: "mt-5", lib: { axios: (_21 = props.lib) === null || _21 === void 0 ? void 0 : _21.axios }, devSettings: props.devSettings, bareSettings: props.bareSettings, fixedPagination: (_22 = props.organise) === null || _22 === void 0 ? void 0 : _22.fixedPagination, advSettings: {
+                    addColumnEnabled: (_23 = props.organise) === null || _23 === void 0 ? void 0 : _23.addColumnEnabled,
                     renderAddColumnElements: renderAddMathColumn,
-                    dragEnabled: (_s = props.organise) === null || _s === void 0 ? void 0 : _s.advDragEnabled,
-                    sortEnabled: (_t = props.organise) === null || _t === void 0 ? void 0 : _t.advSortEnabled,
-                    filterEnabled: ((_u = props.bareSettings) === null || _u === void 0 ? void 0 : _u.bareFlexFilters)
+                    dragEnabled: (_24 = props.organise) === null || _24 === void 0 ? void 0 : _24.advDragEnabled,
+                    sortEnabled: (_25 = props.organise) === null || _25 === void 0 ? void 0 : _25.advSortEnabled,
+                    filterEnabled: ((_26 = props.bareSettings) === null || _26 === void 0 ? void 0 : _26.bareFlexFilters)
                         ? false
-                        : (_v = props.organise) === null || _v === void 0 ? void 0 : _v.advFilterEnabled,
-                    sortId: (_w = props.organise) === null || _w === void 0 ? void 0 : _w.sort,
-                    sortOptions: (_y = (_x = props.organise) === null || _x === void 0 ? void 0 : _x.renderReferenceLabelOptions) === null || _y === void 0 ? void 0 : _y.call(_x),
-                    onSortColumn: (_z = props.organise) === null || _z === void 0 ? void 0 : _z.onChangeSort,
-                    onDragColumn: (_0 = props.organise) === null || _0 === void 0 ? void 0 : _0.onChangeDrag,
+                        : (_27 = props.organise) === null || _27 === void 0 ? void 0 : _27.advFilterEnabled,
+                    sortId: (_28 = props.organise) === null || _28 === void 0 ? void 0 : _28.sort,
+                    sortOptions: (_30 = (_29 = props.organise) === null || _29 === void 0 ? void 0 : _29.renderReferenceLabelOptions) === null || _30 === void 0 ? void 0 : _30.call(_29),
+                    onSortColumn: (_31 = props.organise) === null || _31 === void 0 ? void 0 : _31.onChangeSort,
+                    onDragColumn: (_32 = props.organise) === null || _32 === void 0 ? void 0 : _32.onChangeDrag,
                     filterOptions: additionalQuery === null || additionalQuery === void 0 ? void 0 : additionalQuery.map(function (eachQuery) {
                         var _a;
                         return {
@@ -7377,7 +7499,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                         return renderSearchContent(newQuery);
                     },
                 }, editable: {
-                    active: ((_1 = props.edit) === null || _1 === void 0 ? void 0 : _1.listEditable) && !props.edit.disabledUpdate
+                    active: ((_33 = props.edit) === null || _33 === void 0 ? void 0 : _33.listEditable) && !props.edit.disabledUpdate
                         ? true
                         : false,
                     onUpdateData: function (rowId, columnId, data) { return __awaiter(void 0, void 0, void 0, function () {
@@ -7391,7 +7513,7 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                         });
                     }); },
                 }, addable: {
-                    active: ((_2 = props.edit) === null || _2 === void 0 ? void 0 : _2.listAddable) ? true : false,
+                    active: ((_34 = props.edit) === null || _34 === void 0 ? void 0 : _34.listAddable) ? true : false,
                     onAddData: function (data) { return __awaiter(void 0, void 0, void 0, function () {
                         return __generator(this, function (_a) {
                             switch (_a.label) {
@@ -7402,11 +7524,11 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                             }
                         });
                     }); },
-                }, darkMode: (_3 = props.organise) === null || _3 === void 0 ? void 0 : _3.darkMode, hidePagination: (_4 = props.organise) === null || _4 === void 0 ? void 0 : _4.hidePagination, customPaginationSize: customPaginationSize, disableEllipsisOnLongWord: (_5 = props.organise) === null || _5 === void 0 ? void 0 : _5.disableEllipsisOnLongWord }));
+                }, darkMode: (_35 = props.organise) === null || _35 === void 0 ? void 0 : _35.darkMode, hidePagination: (_36 = props.organise) === null || _36 === void 0 ? void 0 : _36.hidePagination, customPaginationSize: customPaginationSize, disableEllipsisOnLongWord: (_37 = props.organise) === null || _37 === void 0 ? void 0 : _37.disableEllipsisOnLongWord }));
         }
     };
     var renderTabContent = function (tabs, dataType, viewType) {
-        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;
+        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 selectedTabData = tabs.find(function (eachTab) {
             if (eachTab.id === viewType) {
                 return eachTab;
@@ -7587,27 +7709,50 @@ 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 ((_q = props.bareSettings) === null || _q === void 0 ? void 0 : _q.bareNewDTW) {
+                    return (react_1.default.createElement(newList_1.NewList, { paginationType: renderResolvedPaginationType(), list: renderGridAndListData(selectedTabData.viewImage, "list"), size: size, limit: limit, cursor: cursor, loading: tableLoading, pageIndex: pageIndex, checkbox: multipleSelect, selectAll: selectAll, selectedIds: selectedIds, disableSelectFullData: (_s = (_r = props.organise) === null || _r === void 0 ? void 0 : _r.disableSelectFullData) === null || _s === void 0 ? void 0 : _s.list, handleSelectAll: handleSelectAllPages, handleSelectedIds: handleSelectIds, selectAllText: selectAll ? "from filter" : "", multiActionButton: react_1.default.createElement("div", { className: "flex flex-row space-x-3" },
+                            selectedIds.length > 0 && !((_t = props.edit) === null || _t === void 0 ? void 0 : _t.disabledUpdate) && (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();
+                                    } }),
+                                react_1.default.createElement(textButton_1.TextButton, { className: "text-sm", text: "Clone Items", disable: loading, onClick: function () {
+                                        handleCloneSelectedData();
+                                    } }))),
+                            ((_u = props.edit) === null || _u === void 0 ? void 0 : _u.deleteBtn) && (react_1.default.createElement(textButton_1.TextButton, { className: "text-sm text-red-500 hover:text-red-600", text: "Delete", onClick: function () {
+                                    handleGenerateDeletePasscode();
+                                    setDeleteModal(true);
+                                } })),
+                            !isFirebase && !((_v = props.edit) === null || _v === void 0 ? void 0 : _v.disabledUpdate) && (react_1.default.createElement(textButton_1.TextButton, { className: "text-sm", text: "Update", onClick: function () {
+                                    setBatchUpdateModal(true);
+                                } }))), onClickRow: 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: (_x = (_w = props.newTabUrl) === null || _w === void 0 ? void 0 : _w.default) !== null && _x !== void 0 ? _x : "".concat(props.localURLEndpoint, "?data="), addNewTabUrl: (_z = (_y = props.newTabUrl) === null || _y === void 0 ? void 0 : _y.addons) !== null && _z !== void 0 ? _z : "&type=read&collection=".concat(props.collectionId, "&view=general"), handleUpdatePageIndex: function (value) {
+                            handlePagination(value);
+                        }, darkMode: (_0 = props.organise) === null || _0 === void 0 ? void 0 : _0.darkMode, className: "mt-5", hidePagination: (_1 = props.organise) === null || _1 === void 0 ? void 0 : _1.hidePagination, customPaginationSize: customPaginationSize, mobileTooltip: (_2 = props.bareSettings) === null || _2 === void 0 ? void 0 : _2.bareListMobileTooltip }));
+                }
                 return (react_1.default.createElement(react_1.default.Fragment, null,
-                    react_1.default.createElement(list_1.List, { paginationType: renderResolvedPaginationType(), list: renderGridAndListData(selectedTabData.viewImage, "list"), size: size, limit: limit, cursor: cursor, loading: tableLoading, pageIndex: pageIndex, checkbox: multipleSelect, selectAll: selectAll, selectedIds: selectedIds, disableSelectFullData: (_r = (_q = props.organise) === null || _q === void 0 ? void 0 : _q.disableSelectFullData) === null || _r === void 0 ? void 0 : _r.list, handleSelectAll: handleSelectAllPages, handleSelectedIds: handleSelectIds, selectAllText: selectAll ? "from filter" : "", multiActionButton: react_1.default.createElement("div", { className: "flex flex-row space-x-3" },
-                            selectedIds.length > 0 && !((_s = props.edit) === null || _s === void 0 ? void 0 : _s.disabledUpdate) && (react_1.default.createElement(react_1.default.Fragment, null,
+                    react_1.default.createElement(list_1.List, { paginationType: renderResolvedPaginationType(), list: renderGridAndListData(selectedTabData.viewImage, "list"), size: size, limit: limit, cursor: cursor, loading: tableLoading, pageIndex: pageIndex, checkbox: multipleSelect, selectAll: selectAll, selectedIds: selectedIds, disableSelectFullData: (_4 = (_3 = props.organise) === null || _3 === void 0 ? void 0 : _3.disableSelectFullData) === null || _4 === void 0 ? void 0 : _4.list, handleSelectAll: handleSelectAllPages, handleSelectedIds: handleSelectIds, selectAllText: selectAll ? "from filter" : "", multiActionButton: react_1.default.createElement("div", { className: "flex flex-row space-x-3" },
+                            selectedIds.length > 0 && !((_5 = props.edit) === null || _5 === void 0 ? void 0 : _5.disabledUpdate) && (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();
                                     } }),
                                 react_1.default.createElement(textButton_1.TextButton, { className: "text-sm", text: "Clone Items", disable: loading, onClick: function () {
                                         handleCloneSelectedData();
                                     } }))),
-                            ((_t = props.edit) === null || _t === void 0 ? void 0 : _t.deleteBtn) && (react_1.default.createElement(textButton_1.TextButton, { className: "text-sm text-red-500 hover:text-red-600", text: "Delete", onClick: function () {
+                            ((_6 = props.edit) === null || _6 === void 0 ? void 0 : _6.deleteBtn) && (react_1.default.createElement(textButton_1.TextButton, { className: "text-sm text-red-500 hover:text-red-600", text: "Delete", onClick: function () {
                                     handleGenerateDeletePasscode();
                                     setDeleteModal(true);
                                 } })),
-                            !isFirebase && !((_u = props.edit) === null || _u === void 0 ? void 0 : _u.disabledUpdate) && (react_1.default.createElement(textButton_1.TextButton, { className: "text-sm", text: "Update", onClick: function () {
+                            !isFirebase && !((_7 = props.edit) === null || _7 === void 0 ? void 0 : _7.disabledUpdate) && (react_1.default.createElement(textButton_1.TextButton, { className: "text-sm", text: "Update", onClick: function () {
                                     setBatchUpdateModal(true);
                                 } }))), onClickRow: 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: (_w = (_v = props.newTabUrl) === null || _v === void 0 ? void 0 : _v.default) !== null && _w !== void 0 ? _w : "".concat(props.localURLEndpoint, "?data="), addNewTabUrl: (_y = (_x = props.newTabUrl) === null || _x === void 0 ? void 0 : _x.addons) !== null && _y !== void 0 ? _y : "&type=read&collection=".concat(props.collectionId, "&view=general"), handleUpdatePageIndex: function (value) {
+                        }, linkType: props.linkType, custom: props.custom, newTabUrl: (_9 = (_8 = props.newTabUrl) === null || _8 === void 0 ? void 0 : _8.default) !== null && _9 !== void 0 ? _9 : "".concat(props.localURLEndpoint, "?data="), addNewTabUrl: (_11 = (_10 = props.newTabUrl) === null || _10 === void 0 ? void 0 : _10.addons) !== null && _11 !== void 0 ? _11 : "&type=read&collection=".concat(props.collectionId, "&view=general"), handleUpdatePageIndex: function (value) {
                             handlePagination(value);
-                        }, className: "mt-5", hidePagination: (_z = props.organise) === null || _z === void 0 ? void 0 : _z.hidePagination, customPaginationSize: customPaginationSize })));
+                        }, className: "mt-5", hidePagination: (_12 = props.organise) === null || _12 === void 0 ? void 0 : _12.hidePagination, customPaginationSize: customPaginationSize })));
             }
             else if (selectedTabData.viewType === "grid") {
                 var isScrollMode = renderCheckScrollMode();
@@ -7615,9 +7760,9 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                     react_1.default.createElement(grid_1.Grid, { 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: (_1 = (_0 = props.newTabUrl) === null || _0 === void 0 ? void 0 : _0.default) !== null && _1 !== void 0 ? _1 : "".concat(props.localURLEndpoint, "?data="), addNewTabUrl: (_3 = (_2 = props.newTabUrl) === null || _2 === void 0 ? void 0 : _2.addons) !== null && _3 !== void 0 ? _3 : "&type=read&collection=".concat(props.collectionId, "&view=general"), handleUpdatePageIndex: function (value) {
+                        }, linkType: props.linkType, custom: props.custom, newTabUrl: (_14 = (_13 = props.newTabUrl) === null || _13 === void 0 ? void 0 : _13.default) !== null && _14 !== void 0 ? _14 : "".concat(props.localURLEndpoint, "?data="), addNewTabUrl: (_16 = (_15 = props.newTabUrl) === null || _15 === void 0 ? void 0 : _15.addons) !== null && _16 !== void 0 ? _16 : "&type=read&collection=".concat(props.collectionId, "&view=general"), handleUpdatePageIndex: function (value) {
                             handlePagination(value);
-                        }, imgContain: selectedTabData === null || selectedTabData === void 0 ? void 0 : selectedTabData.gridContain, gridColClassName: (_4 = props.bareSettings) === null || _4 === void 0 ? void 0 : _4.bareListGridColClassName, className: "mt-5", hidePagination: (_5 = props.organise) === null || _5 === void 0 ? void 0 : _5.hidePagination, customPaginationSize: customPaginationSize })));
+                        }, imgContain: selectedTabData === null || selectedTabData === void 0 ? void 0 : selectedTabData.gridContain, gridColClassName: (_17 = props.bareSettings) === null || _17 === void 0 ? void 0 : _17.bareListGridColClassName, className: "mt-5", hidePagination: (_18 = props.organise) === null || _18 === void 0 ? void 0 : _18.hidePagination, customPaginationSize: customPaginationSize })));
             }
             else if (selectedTabData.viewType === "calendar") {
                 var calendarSettings_1 = selectedTab === null || selectedTab === void 0 ? void 0 : selectedTab.calendarSettings;
@@ -7711,7 +7856,38 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                     }
                     return eventAvailabilities;
                 };
-                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: (_6 = calendarSettings_1 === null || calendarSettings_1 === void 0 ? void 0 : calendarSettings_1.defaultView) !== null && _6 !== void 0 ? _6 : calendarView, handleMonthChange: function (date) {
+                // INFO: when bareNewDTW is enabled, render NewCalendar instead of legacy Calendar
+                if ((_19 = props.bareSettings) === null || _19 === void 0 ? void 0 : _19.bareNewDTW) {
+                    var newCalendarEvents = renderEventAvailabilities().map(function (ev) {
+                        var _a, _b, _c, _d;
+                        return ({
+                            id: (_a = ev.id) !== null && _a !== void 0 ? _a : "",
+                            title: (_b = ev.title) !== null && _b !== void 0 ? _b : "",
+                            start: (_d = (_c = ev.start) !== null && _c !== void 0 ? _c : ev.date) !== null && _d !== void 0 ? _d : new Date(),
+                            end: ev.end,
+                            type: ev.status,
+                            color: ev.bgColor,
+                            bgColor: ev.bgColor,
+                            hoverColor: ev.hoverColor,
+                            textColor: ev.textColor,
+                            status: ev.status,
+                            date: ev.date,
+                        });
+                    });
+                    return (react_1.default.createElement("div", { className: "mt-4" }, tableLoading ? (react_1.default.createElement(loading_1.Loading, null)) : (react_1.default.createElement(newCalendar_1.NewCalendar, { variant: "fullMonth", events: newCalendarEvents, selectedDate: calendarTabMonth, onSelectDate: 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)) {
+                                setTableLoading(true);
+                            }
+                            setCalendarTabMonth(date);
+                        }, onClickEvent: function (event) {
+                            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: (_20 = props.organise) === null || _20 === void 0 ? void 0 : _20.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: (_21 = calendarSettings_1 === null || calendarSettings_1 === void 0 ? void 0 : calendarSettings_1.defaultView) !== null && _21 !== void 0 ? _21 : 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)) {
@@ -7729,7 +7905,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 = (_7 = feedsSettings_1 === null || feedsSettings_1 === void 0 ? void 0 : feedsSettings_1.customFeedsData) === null || _7 === void 0 ? void 0 : _7.call(feedsSettings_1, tableData, spaceTableData);
+                var customFeedsData = (_22 = feedsSettings_1 === null || feedsSettings_1 === void 0 ? void 0 : feedsSettings_1.customFeedsData) === null || _22 === void 0 ? void 0 : _22.call(feedsSettings_1, tableData, spaceTableData);
                 if (customFeedsData && customFeedsData.length > 0) {
                     customFeedsData.map(function (eachData) {
                         var _a, _b, _c, _d;
@@ -7770,11 +7946,11 @@ 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", { className: "p-4 bg-white rounded-lg" },
-                    react_1.default.createElement(feeds_1.Feeds, { bold: true, content: contentList_1, darkMode: (_8 = props.organise) === null || _8 === void 0 ? void 0 : _8.darkMode }),
+                    react_1.default.createElement(feeds_1.Feeds, { bold: true, content: contentList_1, darkMode: (_23 = props.organise) === null || _23 === void 0 ? void 0 : _23.darkMode }),
                     react_1.default.createElement("div", { className: "my-10" }),
-                    contentList_1.length > 0 && !((_9 = props.organise) === null || _9 === void 0 ? void 0 : _9.hidePagination) && (react_1.default.createElement(pagination_1.Pagination, { data: tableData, size: size, limit: limit, cursor: cursor, pageIndex: pageIndex, paginationType: renderResolvedPaginationType(), handleUpdatePageIndex: function (value) {
+                    contentList_1.length > 0 && !((_24 = props.organise) === null || _24 === void 0 ? void 0 : _24.hidePagination) && (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: (_10 = props.organise) === null || _10 === void 0 ? void 0 : _10.darkMode, customPaginationSize: customPaginationSize }))))));
+                        }, darkMode: (_25 = props.organise) === null || _25 === void 0 ? void 0 : _25.darkMode, customPaginationSize: customPaginationSize }))))));
             }
             else if (selectedTabData.viewType === "map") {
                 var mapSettings_1 = selectedTabData.mapSettings;
@@ -7873,7 +8049,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 = (_11 = kanbanSettings === null || kanbanSettings === void 0 ? void 0 : kanbanSettings.title) !== null && _11 !== void 0 ? _11 : "";
+                var kanbanTitle_2 = (_26 = kanbanSettings === null || kanbanSettings === void 0 ? void 0 : kanbanSettings.title) !== null && _26 !== void 0 ? _26 : "";
                 var nullColumn_1 = false;
                 var groupBy_1 = [];
                 var groupLabel_1 = [];
@@ -7893,6 +8069,21 @@ exports.DataTemplate = (0, react_1.forwardRef)(function (props, ref) {
                     return null;
                 });
                 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 ((_27 = props.bareSettings) === null || _27 === void 0 ? void 0 : _27.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: (_28 = props.bareSettings) === null || _28 === void 0 ? void 0 : _28.bareListMobileView, onUpdateData: function (cardId, _fromCol, toCol) {
+                            var _a;
+                            setKanbanDroppable(false);
+                            handleSubmitData("update", cardId, kanbanTitle_2, (_a = {},
+                                _a[kanbanTitle_2] = toCol,
+                                _a)).then(function () { return setKanbanDroppable(true); });
+                        }, 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: (_29 = props.organise) === null || _29 === void 0 ? void 0 : _29.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"
                         : "", groupCluster: kanbanSettings === null || kanbanSettings === void 0 ? void 0 : kanbanSettings.groupCluster, draggable: true, droppable: kanbanDroppable, onUpdateData: function (data) { return __awaiter(void 0, void 0, void 0, function () {