blixify-ui-web 0.1.151 → 0.1.152

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

@@ -139,66 +139,74 @@ var queryTableHeader = [
 ];
 function DataTemplate(props) {
     var _this = this;
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
     var formRef = (0, react_1.createRef)();
     var objectFormRef = (0, react_1.createRef)();
     var modalFormInputRefs = props.model.map(function () { return (0, react_1.createRef)(); });
+    var batchUpdateFormRef = (0, react_1.createRef)();
+    var batchUpdateColumnIdRef = (0, react_1.createRef)();
+    var batchUpdateInputRef = (0, react_1.createRef)();
     var limit = props.limit ? props.limit : 10;
     var readQueryHocRef = (0, react_1.useRef)();
     var typingTimeout = (0, react_1.useRef)();
-    var _k = (0, react_1.useState)(false), loading = _k[0], setLoading = _k[1];
-    var _l = (0, react_1.useState)(), notification = _l[0], setNotification = _l[1];
+    var _o = (0, react_1.useState)(false), loading = _o[0], setLoading = _o[1];
+    var _p = (0, react_1.useState)(), notification = _p[0], setNotification = _p[1];
     //INFO : Used by List
-    var _m = (0, react_1.useState)(""), filterSearch = _m[0], setFilterSearch = _m[1];
-    var _o = (0, react_1.useState)(""), filterSearchParams = _o[0], setFilterSearchParams = _o[1];
-    var _p = (0, react_1.useState)(""), filterSelection = _p[0], setFilterSelection = _p[1];
-    var _q = (0, react_1.useState)(""), filterReference = _q[0], setFilterReference = _q[1];
-    var _r = (0, react_1.useState)(""), filterReferenceSearch = _r[0], setFilterReferenceSearch = _r[1];
-    var _s = (0, react_1.useState)([]), filterReferenceList = _s[0], setFilterReferenceList = _s[1];
-    var _t = (0, react_1.useState)({
+    var _q = (0, react_1.useState)(""), filterSearch = _q[0], setFilterSearch = _q[1];
+    var _r = (0, react_1.useState)(""), filterSearchParams = _r[0], setFilterSearchParams = _r[1];
+    var _s = (0, react_1.useState)(""), filterSelection = _s[0], setFilterSelection = _s[1];
+    var _t = (0, react_1.useState)(""), filterReference = _t[0], setFilterReference = _t[1];
+    var _u = (0, react_1.useState)(""), filterReferenceSearch = _u[0], setFilterReferenceSearch = _u[1];
+    var _v = (0, react_1.useState)([]), filterReferenceList = _v[0], setFilterReferenceList = _v[1];
+    var _w = (0, react_1.useState)({
         startDate: undefined,
         endDate: undefined,
-    }), filterReferenceDate = _t[0], setFilterReferenceDate = _t[1];
-    var _u = (0, react_1.useState)(true), tableLoading = _u[0], setTableLoading = _u[1];
-    var _v = (0, react_1.useState)(""), cursor = _v[0], setCursor = _v[1];
-    var _w = (0, react_1.useState)(""), lastCursor = _w[0], setLastCursor = _w[1];
-    var _x = (0, react_1.useState)([]), tableData = _x[0], setTableData = _x[1];
-    var _y = (0, react_1.useState)([]), spaceTableData = _y[0], setSpaceTableData = _y[1];
-    var _z = (0, react_1.useState)(0), size = _z[0], setSize = _z[1];
-    var _0 = (0, react_1.useState)(0), pageIndex = _0[0], setPageIndex = _0[1];
-    var _1 = (0, react_1.useState)([]), selectedIds = _1[0], setSelectedIds = _1[1];
-    var _2 = (0, react_1.useState)(false), selectAll = _2[0], setSelectAll = _2[1];
-    var _3 = (0, react_1.useState)(""), deletePasscode = _3[0], setDeletePasscode = _3[1];
-    var _4 = (0, react_1.useState)(""), deletePasscodeInput = _4[0], setDeletePasscodeInput = _4[1];
+    }), filterReferenceDate = _w[0], setFilterReferenceDate = _w[1];
+    var _x = (0, react_1.useState)(true), tableLoading = _x[0], setTableLoading = _x[1];
+    var _y = (0, react_1.useState)(""), cursor = _y[0], setCursor = _y[1];
+    var _z = (0, react_1.useState)(""), lastCursor = _z[0], setLastCursor = _z[1];
+    var _0 = (0, react_1.useState)([]), tableData = _0[0], setTableData = _0[1];
+    var _1 = (0, react_1.useState)([]), spaceTableData = _1[0], setSpaceTableData = _1[1];
+    var _2 = (0, react_1.useState)(0), size = _2[0], setSize = _2[1];
+    var _3 = (0, react_1.useState)(0), pageIndex = _3[0], setPageIndex = _3[1];
+    var _4 = (0, react_1.useState)([]), selectedIds = _4[0], setSelectedIds = _4[1];
+    var _5 = (0, react_1.useState)(false), selectAll = _5[0], setSelectAll = _5[1];
+    var _6 = (0, react_1.useState)(""), deletePasscode = _6[0], setDeletePasscode = _6[1];
+    var _7 = (0, react_1.useState)(""), deletePasscodeInput = _7[0], setDeletePasscodeInput = _7[1];
     //INFO : Used by List Organise
-    var _5 = (0, react_1.useState)(false), sortModal = _5[0], setSortModal = _5[1];
-    var _6 = (0, react_1.useState)(false), filterModal = _6[0], setFilterModal = _6[1];
-    var _7 = (0, react_1.useState)(false), addTabModal = _7[0], setAddTabModal = _7[1];
-    var _8 = (0, react_1.useState)(false), queryForm = _8[0], setQueryForm = _8[1];
+    var _8 = (0, react_1.useState)(false), sortModal = _8[0], setSortModal = _8[1];
+    var _9 = (0, react_1.useState)(false), filterModal = _9[0], setFilterModal = _9[1];
+    var _10 = (0, react_1.useState)(false), addTabModal = _10[0], setAddTabModal = _10[1];
+    var _11 = (0, react_1.useState)(false), queryForm = _11[0], setQueryForm = _11[1];
+    var _12 = (0, react_1.useState)(false), batchUpdateModal = _12[0], setBatchUpdateModal = _12[1];
+    var _13 = (0, react_1.useState)({
+        columnId: "",
+        columnData: {},
+    }), batchUpdateData = _13[0], setBatchUpdateData = _13[1];
     //INFO : Used by Export
-    var _9 = (0, react_1.useState)(null), csvFile = _9[0], setCSVFile = _9[1];
-    var _10 = (0, react_1.useState)([]), csvFileData = _10[0], setCSVFileData = _10[1];
-    var _11 = (0, react_1.useState)(0), stepCSVIndex = _11[0], setStepCSVIndex = _11[1];
-    var _12 = (0, react_1.useState)({}), listCSVMapAttribute = _12[0], setListCSVMapAttribute = _12[1];
-    var _13 = (0, react_1.useState)({}), listCSVObjAttribute = _13[0], setListCSVObjAttribute = _13[1];
-    var _14 = (0, react_1.useState)([]), csvAPIAttribute = _14[0], setCSVAPIAttribute = _14[1];
-    var _15 = (0, react_1.useState)([]), importTableData = _15[0], setImportTableData = _15[1];
-    var _16 = (0, react_1.useState)(""), exportLink = _16[0], setExportLink = _16[1];
-    var _17 = (0, react_1.useState)([]), queryList = _17[0], setQueryList = _17[1];
-    var _18 = (0, react_1.useState)(-1), queryIndex = _18[0], setQueryIndex = _18[1];
+    var _14 = (0, react_1.useState)(null), csvFile = _14[0], setCSVFile = _14[1];
+    var _15 = (0, react_1.useState)([]), csvFileData = _15[0], setCSVFileData = _15[1];
+    var _16 = (0, react_1.useState)(0), stepCSVIndex = _16[0], setStepCSVIndex = _16[1];
+    var _17 = (0, react_1.useState)({}), listCSVMapAttribute = _17[0], setListCSVMapAttribute = _17[1];
+    var _18 = (0, react_1.useState)({}), listCSVObjAttribute = _18[0], setListCSVObjAttribute = _18[1];
+    var _19 = (0, react_1.useState)([]), csvAPIAttribute = _19[0], setCSVAPIAttribute = _19[1];
+    var _20 = (0, react_1.useState)([]), importTableData = _20[0], setImportTableData = _20[1];
+    var _21 = (0, react_1.useState)(""), exportLink = _21[0], setExportLink = _21[1];
+    var _22 = (0, react_1.useState)([]), queryList = _22[0], setQueryList = _22[1];
+    var _23 = (0, react_1.useState)(-1), queryIndex = _23[0], setQueryIndex = _23[1];
     //INFO : Used by Read
     //INFO : Used by Update
-    var _19 = (0, react_1.useState)(false), modalVisible = _19[0], setModalVisible = _19[1];
-    var _20 = (0, react_1.useState)(false), deleteModal = _20[0], setDeleteModal = _20[1];
-    var _21 = (0, react_1.useState)(false), excelModal = _21[0], setExcelModal = _21[1];
-    var _22 = (0, react_1.useState)(false), exportExcel = _22[0], setExportExcel = _22[1];
-    var _23 = (0, react_1.useState)({}), selectedData = _23[0], setSelectedData = _23[1];
-    var _24 = (0, react_1.useState)(""), selectedObjectStructureId = _24[0], setSelectedObjectStructureId = _24[1];
-    var _25 = (0, react_1.useState)(""), selectedObjectId = _25[0], setSelectedObjectId = _25[1];
-    var _26 = (0, react_1.useState)({}), selectedObjectData = _26[0], setSelectedObjectData = _26[1];
-    var _27 = (0, react_1.useState)(false), referenceLoading = _27[0], setReferenceLoading = _27[1];
-    var _28 = (0, react_1.useState)({}), referencesOptions = _28[0], setReferencesOptions = _28[1];
-    var _29 = (0, react_1.useState)({}), referenceModelSchema = _29[0], setReferenceSchema = _29[1];
+    var _24 = (0, react_1.useState)(false), modalVisible = _24[0], setModalVisible = _24[1];
+    var _25 = (0, react_1.useState)(false), deleteModal = _25[0], setDeleteModal = _25[1];
+    var _26 = (0, react_1.useState)(false), excelModal = _26[0], setExcelModal = _26[1];
+    var _27 = (0, react_1.useState)(false), exportExcel = _27[0], setExportExcel = _27[1];
+    var _28 = (0, react_1.useState)({}), selectedData = _28[0], setSelectedData = _28[1];
+    var _29 = (0, react_1.useState)(""), selectedObjectStructureId = _29[0], setSelectedObjectStructureId = _29[1];
+    var _30 = (0, react_1.useState)(""), selectedObjectId = _30[0], setSelectedObjectId = _30[1];
+    var _31 = (0, react_1.useState)({}), selectedObjectData = _31[0], setSelectedObjectData = _31[1];
+    var _32 = (0, react_1.useState)(false), referenceLoading = _32[0], setReferenceLoading = _32[1];
+    var _33 = (0, react_1.useState)({}), referencesOptions = _33[0], setReferencesOptions = _33[1];
+    var _34 = (0, react_1.useState)({}), referenceModelSchema = _34[0], setReferenceSchema = _34[1];
     var devSettings = props.devSettings;
     var serverId = devSettings.server === "mongoServer" ? "_id" : "id";
     var isEditor = ((_a = props.edit) === null || _a === void 0 ? void 0 : _a.allEditable) ? true : false;
@@ -209,6 +217,7 @@ function DataTemplate(props) {
         dbCollection: props.collectionId,
         dbEndpoint: devSettings.dbEndpoint,
     });
+    var debug = ((_e = props.organise) === null || _e === void 0 ? void 0 : _e.debugOnChangeType) ? true : false;
     var moreButtonPopUp = [
         {
             text: "Import Excel",
@@ -225,12 +234,13 @@ function DataTemplate(props) {
             },
         },
     ];
-    if ((_e = props.organise) === null || _e === void 0 ? void 0 : _e.moreSettings)
+    if ((_f = props.organise) === null || _f === void 0 ? void 0 : _f.moreSettings)
         moreButtonPopUp = moreButtonPopUp.concat(props.organise.moreSettings);
     (0, react_1.useEffect)(function () {
         switch (props.type) {
             case "read":
             case "update":
+                setReferencesOptions({});
                 setExcelModal(false);
                 setExportExcel(false);
                 setSelectedData({});
@@ -238,6 +248,8 @@ function DataTemplate(props) {
                 if (props.id !== "new" && props.id !== "") {
                     setModalVisible(true);
                     setLoading(true);
+                    if (readQueryHocRef.current)
+                        readQueryHocRef.current.handleRefresh();
                 }
                 break;
             case "list":
@@ -280,16 +292,16 @@ function DataTemplate(props) {
     };
     var handleGetListData = function (responseData, type, rowId) { return __awaiter(_this, void 0, void 0, function () {
         var dataList, prettierDataList, selectedIndex_1;
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
-        return __generator(this, function (_l) {
-            switch (_l.label) {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
+        return __generator(this, function (_m) {
+            switch (_m.label) {
                 case 0:
                     dataList = [];
                     prettierDataList = [];
                     if (!responseData) return [3 /*break*/, 2];
-                    return [4 /*yield*/, (0, display_1.handleListDataBasedOnModel)(responseData.data, (_b = (_a = props.devSettings) === null || _a === void 0 ? void 0 : _a.server) !== null && _b !== void 0 ? _b : "mongoServer", (_c = props.lib) === null || _c === void 0 ? void 0 : _c.axios, props.model, (_e = (_d = props.devSettings) === null || _d === void 0 ? void 0 : _d.imageEndpoint) !== null && _e !== void 0 ? _e : "", props.localURLEndpoint, props.collectionId, (_g = (_f = props.devSettings) === null || _f === void 0 ? void 0 : _f.dbEndpoint) !== null && _g !== void 0 ? _g : "", (_h = props.devSettings.organisationMembers) !== null && _h !== void 0 ? _h : [], handleNavigate, (_j = props.devSettings) === null || _j === void 0 ? void 0 : _j.bucketName, ((_k = props.organise) === null || _k === void 0 ? void 0 : _k.viewId) === "general")];
+                    return [4 /*yield*/, (0, display_1.handleListDataBasedOnModel)(responseData.data, (_b = (_a = props.devSettings) === null || _a === void 0 ? void 0 : _a.server) !== null && _b !== void 0 ? _b : "mongoServer", (_c = props.lib) === null || _c === void 0 ? void 0 : _c.axios, props.model, (_e = (_d = props.devSettings) === null || _d === void 0 ? void 0 : _d.imageEndpoint) !== null && _e !== void 0 ? _e : "", props.localURLEndpoint, props.collectionId, (_g = (_f = props.devSettings) === null || _f === void 0 ? void 0 : _f.dbEndpoint) !== null && _g !== void 0 ? _g : "", (_h = props.devSettings.organisationMembers) !== null && _h !== void 0 ? _h : [], handleNavigate, (_j = props.devSettings) === null || _j === void 0 ? void 0 : _j.bucketName, ((_k = props.organise) === null || _k === void 0 ? void 0 : _k.viewId) === "general", (_l = props.organise) === null || _l === void 0 ? void 0 : _l.debugOnChangeType)];
                 case 1:
-                    prettierDataList = _l.sent();
+                    prettierDataList = _m.sent();
                     responseData.data.map(function (eachData) {
                         if (eachData["_id"]) {
                             eachData["id"] = eachData["_id"];
@@ -298,7 +310,7 @@ function DataTemplate(props) {
                         return null;
                     });
                     dataList = responseData.data;
-                    _l.label = 2;
+                    _m.label = 2;
                 case 2:
                     if (type === "update" || type === "create") {
                         try {
@@ -352,6 +364,7 @@ function DataTemplate(props) {
             if (!open) {
                 setModalVisible(false);
                 setDeleteModal(false);
+                setBatchUpdateModal(false);
                 handlePopUpModal(false);
             }
             if (readQueryHocRef.current)
@@ -923,8 +936,94 @@ function DataTemplate(props) {
             }
         });
     }); };
+    var handleBatchUpdateData = function () { return __awaiter(_this, void 0, void 0, function () {
+        var model_1, columnId_1, dataToSubmit_1, isFile, res, res, err_8;
+        var _a, _b;
+        var _this = this;
+        return __generator(this, function (_c) {
+            switch (_c.label) {
+                case 0:
+                    _c.trys.push([0, 7, , 8]);
+                    setLoading(true);
+                    setModalVisible(true);
+                    model_1 = props.model.find(function (eachModel) { return eachModel.id === batchUpdateData.columnId; });
+                    columnId_1 = batchUpdateData.columnId;
+                    dataToSubmit_1 = batchUpdateData.columnData;
+                    isFile = (model_1 === null || model_1 === void 0 ? void 0 : model_1.type) === "image" || (model_1 === null || model_1 === void 0 ? void 0 : model_1.type) === "file";
+                    if ((model_1 === null || model_1 === void 0 ? void 0 : model_1.optional) && dataToSubmit_1[columnId_1] === undefined) {
+                        if (model_1.type === "address")
+                            dataToSubmit_1 = (_a = {}, _a[columnId_1] = { name: "", lat: 0, lng: 0 }, _a);
+                        else
+                            dataToSubmit_1 = (_b = {}, _b[columnId_1] = "", _b);
+                    }
+                    if (!(isFile && dataToSubmit_1[columnId_1])) return [3 /*break*/, 2];
+                    return [4 /*yield*/, Promise.all(selectedIds.map(function (eachId) { return __awaiter(_this, void 0, void 0, function () {
+                            return __generator(this, function (_a) {
+                                switch (_a.label) {
+                                    case 0: return [4 /*yield*/, handleSubmitData("update", eachId, columnId_1, dataToSubmit_1)];
+                                    case 1: return [2 /*return*/, _a.sent()];
+                                }
+                            });
+                        }); }))];
+                case 1:
+                    res = _c.sent();
+                    if (res) {
+                        setLoading(false);
+                        setSelectedIds([]);
+                        setModalVisible(false);
+                        setBatchUpdateModal(false);
+                    }
+                    return [3 /*break*/, 6];
+                case 2:
+                    if (!(isFile && !dataToSubmit_1[columnId_1])) return [3 /*break*/, 4];
+                    return [4 /*yield*/, Promise.all(selectedIds.map(function (eachId) { return __awaiter(_this, void 0, void 0, function () {
+                            var _a, _b, _c;
+                            return __generator(this, function (_d) {
+                                switch (_d.label) {
+                                    case 0: return [4 /*yield*/, handleRemoveImageAxios(handleUploadEndpoint(model_1), eachId, (_a = model_1.imageCollectionName) !== null && _a !== void 0 ? _a : "", (_b = model_1.imageFileName) !== null && _b !== void 0 ? _b : "", (_c = devSettings.bucketName) !== null && _c !== void 0 ? _c : "")];
+                                    case 1:
+                                        _d.sent();
+                                        return [2 /*return*/];
+                                }
+                            });
+                        }); }))];
+                case 3:
+                    _c.sent();
+                    _c.label = 4;
+                case 4: return [4 /*yield*/, writeServerQuery.call("batchUpdate", {
+                        data: dataToSubmit_1,
+                        query: [
+                            {
+                                queryId: "_id",
+                                type: "in",
+                                value: selectedIds,
+                            },
+                        ],
+                    })];
+                case 5:
+                    res = _c.sent();
+                    if (res)
+                        handleRefresh(false);
+                    _c.label = 6;
+                case 6: return [3 /*break*/, 8];
+                case 7:
+                    err_8 = _c.sent();
+                    if (err_8.response && err_8.response.status === 400) {
+                        setNotification({
+                            type: false,
+                            title: "Error",
+                            msg: err_8.response.data.err,
+                        });
+                    }
+                    return [3 /*break*/, 8];
+                case 8:
+                    setBatchUpdateData({ columnId: "", columnData: {} });
+                    return [2 /*return*/];
+            }
+        });
+    }); };
     var handleSubmitData = function (type, rowId, columnId, data) { return __awaiter(_this, void 0, void 0, function () {
-        var selectedId, id, createSelectedData, uniqueDataStructure, uniqueColumnId, res, dataToSubmit, selectedIndex_2, err_8;
+        var selectedId, id, createSelectedData_1, uniqueDataStructure, uniqueColumnId, res, dataToSubmit, selectedIndex_2, err_9;
         var _a;
         var _b;
         return __generator(this, function (_c) {
@@ -949,16 +1048,16 @@ function DataTemplate(props) {
                         id = (_b = props.id) !== null && _b !== void 0 ? _b : "";
                     return [4 /*yield*/, handleUploadImage(id, data)];
                 case 1:
-                    createSelectedData = _c.sent();
+                    createSelectedData_1 = _c.sent();
                     uniqueDataStructure = props.model.filter(function (eachStructure) {
                         return eachStructure.unique;
                     });
                     uniqueColumnId = uniqueDataStructure.length > 0 ? uniqueDataStructure[0].id : undefined;
                     res = "";
                     if (!(selectedId === "new")) return [3 /*break*/, 3];
-                    createSelectedData[serverId] = id;
+                    createSelectedData_1[serverId] = id;
                     return [4 /*yield*/, writeServerQuery.call("create", {
-                            data: createSelectedData,
+                            data: createSelectedData_1,
                             unique: uniqueColumnId,
                         })];
                 case 2:
@@ -969,11 +1068,11 @@ function DataTemplate(props) {
                     dataToSubmit = void 0;
                     if (type === "update" && columnId) {
                         dataToSubmit = (_a = {},
-                            _a[columnId] = createSelectedData[columnId],
+                            _a[columnId] = createSelectedData_1[columnId],
                             _a);
                     }
                     else
-                        dataToSubmit = __assign(__assign({}, createSelectedData), { baseDraft: false });
+                        dataToSubmit = __assign(__assign({}, createSelectedData_1), { baseDraft: false });
                     return [4 /*yield*/, writeServerQuery.call("update", {
                             id: selectedId,
                             data: dataToSubmit,
@@ -990,7 +1089,7 @@ function DataTemplate(props) {
                     selectedIndex_2 = -1;
                     tableData.map(function (eachData, index) {
                         if (eachData.id === rowId || eachData._id === rowId) {
-                            eachData[columnId] = data[columnId];
+                            eachData[columnId] = createSelectedData_1[columnId];
                             selectedIndex_2 = index;
                         }
                         return null;
@@ -1000,18 +1099,18 @@ function DataTemplate(props) {
                     _c.sent();
                     _c.label = 7;
                 case 7: return [3 /*break*/, 10];
-                case 8: return [4 /*yield*/, handleGetListData({ data: [createSelectedData] }, "create")];
+                case 8: return [4 /*yield*/, handleGetListData({ data: [createSelectedData_1] }, "create")];
                 case 9:
                     _c.sent();
                     _c.label = 10;
                 case 10: return [2 /*return*/, res];
                 case 11:
-                    err_8 = _c.sent();
-                    if (err_8.response && err_8.response.status === 400) {
+                    err_9 = _c.sent();
+                    if (err_9.response && err_9.response.status === 400) {
                         setNotification({
                             type: false,
                             title: "Error",
-                            msg: err_8.response.data.err,
+                            msg: err_9.response.data.err,
                         });
                     }
                     return [3 /*break*/, 12];
@@ -1020,16 +1119,17 @@ function DataTemplate(props) {
         });
     }); };
     var handleSubmit = function () { return __awaiter(_this, void 0, void 0, function () {
-        var res, err_9;
-        return __generator(this, function (_a) {
-            switch (_a.label) {
+        var res, err_10;
+        var _a;
+        return __generator(this, function (_b) {
+            switch (_b.label) {
                 case 0:
-                    _a.trys.push([0, 2, , 3]);
+                    _b.trys.push([0, 2, , 3]);
                     setLoading(true);
                     setModalVisible(true);
                     return [4 /*yield*/, handleSubmitData()];
                 case 1:
-                    res = _a.sent();
+                    res = _b.sent();
                     setModalVisible(false);
                     setLoading(false);
                     if (res) {
@@ -1037,12 +1137,17 @@ function DataTemplate(props) {
                             props.onComplete();
                         }
                         else {
-                            handleNavigate("".concat(props.localURLEndpoint, "?type=list&collection=").concat(props.collectionId, "&data=r"));
+                            if (((_a = props.organise) === null || _a === void 0 ? void 0 : _a.debugOnChangeType) && props.id !== "new") {
+                                props.organise.debugOnChangeType("list");
+                            }
+                            else
+                                handleNavigate("".concat(props.localURLEndpoint, "?type=list&collection=").concat(props.collectionId) +
+                                    (props.id === "new" ? "&data=r" : ""));
                         }
                     }
                     return [3 /*break*/, 3];
                 case 2:
-                    err_9 = _a.sent();
+                    err_10 = _b.sent();
                     setModalVisible(false);
                     setLoading(false);
                     return [3 /*break*/, 3];
@@ -1090,6 +1195,12 @@ function DataTemplate(props) {
                 model: (_a = filterObjectModel === null || filterObjectModel === void 0 ? void 0 : filterObjectModel.objectData) !== null && _a !== void 0 ? _a : [],
             };
         }
+        else if (batchUpdateModal && batchUpdateData.columnId) {
+            return {
+                data: batchUpdateData.columnData,
+                model: props.model,
+            };
+        }
         else {
             return {
                 data: selectedData,
@@ -1101,6 +1212,9 @@ function DataTemplate(props) {
         if (modalVisible && selectedObjectStructureId) {
             setSelectedObjectData(data);
         }
+        else if (batchUpdateModal && batchUpdateData.columnId) {
+            setBatchUpdateData(__assign(__assign({}, batchUpdateData), { columnData: data }));
+        }
         else {
             setSelectedData(data);
         }
@@ -1184,6 +1298,12 @@ function DataTemplate(props) {
         clonedData[id] = value;
         handleUpdateChangeData(clonedData);
     };
+    var handleOnChangeMarkdown = function (id, value) {
+        var _a = handleOnChangeData(), data = _a.data, model = _a.model;
+        var clonedData = (0, display_1.handleClonedDataAttribute)(data, model);
+        clonedData[id] = value;
+        handleUpdateChangeData(clonedData);
+    };
     //=====================================================================================
     //SECTION: Handle CSV
     //=====================================================================================
@@ -1237,7 +1357,7 @@ function DataTemplate(props) {
         }
     };
     var handleStepCSV = function () { return __awaiter(_this, void 0, void 0, function () {
-        var csvList_1, _loop_1, _i, _a, _b, eachKey, eachValue, valid_1, errorValue_1, excelFormData, response, open_1, err_10;
+        var csvList_1, _loop_1, _i, _a, _b, eachKey, eachValue, valid_1, errorValue_1, excelFormData, response, open_1, err_11;
         var _c, _d, _e, _f, _g;
         return __generator(this, function (_h) {
             switch (_h.label) {
@@ -1364,12 +1484,12 @@ function DataTemplate(props) {
                     _h.label = 5;
                 case 5: return [3 /*break*/, 7];
                 case 6:
-                    err_10 = _h.sent();
+                    err_11 = _h.sent();
                     setLoading(false);
                     setNotification({
                         type: false,
                         title: "Import Error",
-                        msg: err_10.message,
+                        msg: err_11.message,
                     });
                     return [3 /*break*/, 7];
                 case 7: return [2 /*return*/];
@@ -1377,7 +1497,7 @@ function DataTemplate(props) {
         });
     }); };
     var handleExportCSVData = function () { return __awaiter(_this, void 0, void 0, function () {
-        var res, err_11;
+        var res, err_12;
         var _a, _b;
         return __generator(this, function (_c) {
             switch (_c.label) {
@@ -1401,7 +1521,7 @@ function DataTemplate(props) {
                     setLoading(false);
                     return [3 /*break*/, 3];
                 case 2:
-                    err_11 = _c.sent();
+                    err_12 = _c.sent();
                     setLoading(false);
                     return [3 /*break*/, 3];
                 case 3: return [2 /*return*/];
@@ -1585,10 +1705,14 @@ function DataTemplate(props) {
                         handleSortQuery(index, upData_1 ? "up" : "down");
                     } }, upData_1 ? (react_1.default.createElement(outline_1.ArrowUpIcon, { className: "block w-5 h-5 text-primary-600" })) : (react_1.default.createElement(outline_1.ArrowDownIcon, { className: "block w-5 h-5 text-primary-600" }))));
             }
+            var value = data.value;
+            var isDate = (0, moment_1.default)(value);
+            if (isDate.isValid())
+                value = (0, moment_1.default)(value).format("DD/MM/YYYY h:mm a");
             queryStructureView.push({
                 key: index,
                 name: data.queryId,
-                value: data.value,
+                value: value,
                 sort: sortComponent,
                 view: (react_1.default.createElement("div", { className: "ml-2 cursor-pointer", onClick: function () {
                         handleViewQuery(index);
@@ -1617,6 +1741,7 @@ function DataTemplate(props) {
                 eachAttribute.type === "file" ||
                 eachAttribute.type === "multipleFile" ||
                 eachAttribute.type === "multipleImage" ||
+                eachAttribute.type === "markdown" ||
                 eachAttribute.hide) {
                 return null;
             }
@@ -1835,7 +1960,7 @@ function DataTemplate(props) {
                     current: true,
                 });
                 return (react_1.default.createElement(react_1.default.Fragment, null,
-                    react_1.default.createElement(readQueryHoc_1.ReadQueryHoc, { database: {
+                    react_1.default.createElement(readQueryHoc_1.ReadQueryHoc, { ref: readQueryHocRef, database: {
                             dbModule: dbModule,
                             dbType: devSettings.server,
                             dbCollection: props.collectionId,
@@ -1853,6 +1978,11 @@ function DataTemplate(props) {
                                     react_1.default.createElement("p", { className: "text-xl font-medium" }, props.title),
                                     react_1.default.createElement("span", { className: "text-sm text-gray-500" }, props.description)),
                                 ((_g = props.edit) === null || _g === void 0 ? void 0 : _g.deleteBtn) && isEditor && (react_1.default.createElement("div", { className: "flex flex-col sm:flex-row" },
+                                    react_1.default.createElement("div", { className: "w-full mt-5 ml-0 sm:mt-0 sm:ml-3" }, debug ? (react_1.default.createElement(button_1.Button, { text: "Update", className: "w-full", type: "normal", onClick: function () {
+                                            var _a, _b;
+                                            (_b = (_a = props.organise) === null || _a === void 0 ? void 0 : _a.debugOnChangeType) === null || _b === void 0 ? void 0 : _b.call(_a, "update");
+                                        } })) : (react_1.default.createElement(link_1.Link, { className: "w-full", href: "".concat(props.localURLEndpoint, "?data=").concat(props.id, "&type=update&collection=").concat(props.collectionId, "&view=general"), linkType: props.linkType, custom: props.custom },
+                                        react_1.default.createElement(button_1.Button, { text: "Update", className: "w-full", type: "normal" })))),
                                     react_1.default.createElement(button_1.Button, { text: "Delete", className: "mt-3 ml-0 sm:mt-0 sm:ml-3", type: "danger", onClick: function () {
                                             setDeleteModal(true);
                                         } }))))),
@@ -1870,7 +2000,7 @@ function DataTemplate(props) {
                     current: true,
                 });
                 return (react_1.default.createElement(react_1.default.Fragment, null,
-                    props.id && props.id !== "new" && props.model.length > 1 && (react_1.default.createElement(readQueryHoc_1.ReadQueryHoc, { database: {
+                    props.id && props.id !== "new" && props.model.length > 1 && (react_1.default.createElement(readQueryHoc_1.ReadQueryHoc, { ref: readQueryHocRef, database: {
                             dbModule: dbModule,
                             dbType: devSettings.server,
                             dbCollection: props.collectionId,
@@ -2108,7 +2238,7 @@ function DataTemplate(props) {
                     break;
                 case "range":
                     searchFilterList.push(react_1.default.createElement("div", { className: "pb-0 md:pb-5 w-full" },
-                        react_1.default.createElement(datePicker_1.InputDatePicker, { id: "startDate", startDate: filterReferenceDate.startDate, endDate: filterReferenceDate.endDate, range: true, onChange: handleRangeFilterOnChange })));
+                        react_1.default.createElement(datePicker_1.InputDatePicker, { id: "startDate", startDate: filterReferenceDate.startDate, endDate: filterReferenceDate.endDate, range: true, onChange: handleRangeFilterOnChange, showTime: true })));
                     break;
             }
             return null;
@@ -2121,7 +2251,7 @@ function DataTemplate(props) {
     //=====================================================================================
     //SECTION: Render Utils
     //=====================================================================================
-    var renderDataTemplateFormContent = function (state, model, ref, isObject, isObjectList) {
+    var renderDataTemplateFormContent = function (state, model, ref, isObject, isObjectList, modalInput) {
         var _a, _b, _c, _d;
         return (0, display_1.renderDataTemplateForm)(state, model, ref, {
             handleOnChangeAddress: handleOnChangeAddress,
@@ -2130,7 +2260,8 @@ function DataTemplate(props) {
             handleOnChangeDate: handleOnChangeDate,
             handleOnChangeFile: handleOnChangeFile,
             handleOnChangeFiles: handleOnChangeFiles,
-        }, false, undefined, {
+            handleOnChangeMarkdown: handleOnChangeMarkdown,
+        }, modalInput, undefined, {
             id: props.id,
             isObject: isObject,
             isObjectList: isObjectList,
@@ -2214,10 +2345,14 @@ function DataTemplate(props) {
         });
         if (viewType === "general") {
             if (dataType === "list") {
-                return (react_1.default.createElement(table_1.Table, { paginationType: devSettings.server === "mongoServer" ? "page" : "cursor", data: tableData, space: props.space, spaceData: spaceTableData, size: size, limit: limit, cursor: cursor, loading: tableLoading, checkbox: isEditor ? true : false, selectAll: selectAll, selectedIds: selectedIds, selectAllText: selectAll ? "from filter" : "", multiActionButton: react_1.default.createElement(textButton_1.TextButton, { className: "text-sm", text: "Delete", onClick: function () {
-                            handleGenerateDeletePasscode();
-                            setDeleteModal(true);
-                        } }), handleSelectAll: handleSelectAllPages, handleSelectedIds: handleSelectIds, header: renderTableHeader(), pageIndex: pageIndex, onClickRow: function (id) {
+                return (react_1.default.createElement(table_1.Table, { paginationType: devSettings.server === "mongoServer" ? "page" : "cursor", data: tableData, space: props.space, spaceData: spaceTableData, size: size, limit: limit, cursor: cursor, loading: tableLoading, checkbox: isEditor ? true : false, selectAll: selectAll, selectedIds: selectedIds, selectAllText: selectAll ? "from filter" : "", multiActionButton: react_1.default.createElement("div", { className: "flex flex-row space-x-3" },
+                        react_1.default.createElement(textButton_1.TextButton, { className: "text-sm text-red-500 hover:text-red-600", text: "Delete", onClick: function () {
+                                handleGenerateDeletePasscode();
+                                setDeleteModal(true);
+                            } }),
+                        !selectAll && (react_1.default.createElement(textButton_1.TextButton, { className: "text-sm", text: "Update", onClick: function () {
+                                setBatchUpdateModal(true);
+                            } }))), handleSelectAll: handleSelectAllPages, handleSelectedIds: handleSelectIds, header: renderTableHeader(), pageIndex: pageIndex, onClickRow: function (id) {
                         handleNavigate("".concat(props.localURLEndpoint, "?data=").concat(id, "&type=read&collection=").concat(props.collectionId, "&view=general"));
                     }, linkType: props.linkType, custom: props.custom, newTabUrl: "".concat(props.localURLEndpoint, "?data="), addNewTabUrl: "&type=read&collection=".concat(props.collectionId, "&view=general"), handleUpdatePageIndex: handlePagination, className: "mt-5", lib: { axios: (_a = props.lib) === null || _a === void 0 ? void 0 : _a.axios }, devSettings: {
                         schemaEndpoint: devSettings.schemaEndpoint,
@@ -2436,6 +2571,60 @@ function DataTemplate(props) {
                             }
                         } })))));
     };
+    var renderBatchUpdateModalContent = function () {
+        var _a;
+        if (batchUpdateModal) {
+            var unsupportedModelType_1 = [
+                "object",
+                "listObject",
+                "multipleFile",
+                "multipleImage",
+            ];
+            var columnIdOptions = props.model
+                .filter(function (eachModel) {
+                return eachModel.id !== "id" &&
+                    !eachModel.unique &&
+                    !eachModel.disabled &&
+                    !unsupportedModelType_1.includes(eachModel.type);
+            })
+                .map(function (eachModel) { return ({ key: eachModel.id, label: eachModel.name }); });
+            var defaultModel = {
+                id: "text",
+                name: "Value",
+                disabled: true,
+                type: "string",
+            };
+            var modelFound = props.model.find(function (eachModel) { return eachModel.id === batchUpdateData.columnId; });
+            var model = modelFound !== null && modelFound !== void 0 ? modelFound : defaultModel;
+            return (react_1.default.createElement(react_1.default.Fragment, null,
+                react_1.default.createElement(form_1.Form, { ref: batchUpdateFormRef, refList: [batchUpdateColumnIdRef, batchUpdateInputRef], handleComplete: handleBatchUpdateData },
+                    react_1.default.createElement(select_1.Select, { ref: batchUpdateColumnIdRef, id: "columnId", value: (_a = batchUpdateData.columnId) !== null && _a !== void 0 ? _a : "", label: "Column ID", options: columnIdOptions, onChange: function (value) {
+                            var _a;
+                            setBatchUpdateData({
+                                columnId: value,
+                                columnData: (_a = {}, _a[value] = undefined, _a),
+                            });
+                        }, containerClassName: "mb-6", staticDropdown: true }),
+                    renderDataTemplateFormContent(batchUpdateData.columnData, [model], [batchUpdateInputRef], false, false, true)),
+                react_1.default.createElement("div", { className: "flex flex-row justify-end pt-5 mt-6 space-x-2" },
+                    react_1.default.createElement(button_1.Button, { text: "Close", size: "small", type: "light", onClick: function () {
+                            setBatchUpdateData({ columnId: "", columnData: {} });
+                            setBatchUpdateModal(false);
+                        } }),
+                    react_1.default.createElement(button_1.Button, { text: "Update", size: "small", type: "normal", onClick: function () { return __awaiter(_this, void 0, void 0, function () {
+                            return __generator(this, function (_a) {
+                                switch (_a.label) {
+                                    case 0: return [4 /*yield*/, batchUpdateFormRef.current.handleSubmit()];
+                                    case 1:
+                                        _a.sent();
+                                        return [2 /*return*/];
+                                }
+                            });
+                        }); } }))));
+        }
+        else
+            return null;
+    };
     var renderModalTitle = function () {
         if (excelModal)
             return "Import CSV";
@@ -2452,16 +2641,20 @@ function DataTemplate(props) {
     };
     return (react_1.default.createElement(react_1.default.Fragment, null,
         renderNotification("root"),
-        react_1.default.createElement(modal_1.Modal, { maxWidth: selectedObjectStructureId || excelModal ? "2xl" : undefined, open: modalVisible, title: renderModalTitle(), lib: { Dialog: (_f = props.lib) === null || _f === void 0 ? void 0 : _f.Dialog, Transition: (_g = props.lib) === null || _g === void 0 ? void 0 : _g.Transition }, renderContent: renderModalContent, onClose: function () {
+        react_1.default.createElement(modal_1.Modal, { maxWidth: selectedObjectStructureId || excelModal ? "2xl" : undefined, open: modalVisible, title: renderModalTitle(), lib: { Dialog: (_g = props.lib) === null || _g === void 0 ? void 0 : _g.Dialog, Transition: (_h = props.lib) === null || _h === void 0 ? void 0 : _h.Transition }, renderContent: renderModalContent, onClose: function () {
                 if (queryForm)
                     handleViewQuery(-1);
                 else
                     handlePopUpModal(false);
             }, notification: react_1.default.createElement(react_1.default.Fragment, null, renderNotification("modal")) }),
-        react_1.default.createElement(modal_1.Modal, { open: deleteModal, lib: { Dialog: (_h = props.lib) === null || _h === void 0 ? void 0 : _h.Dialog, Transition: (_j = props.lib) === null || _j === void 0 ? void 0 : _j.Transition }, renderContent: renderDeleteModalContent, onClose: function () {
+        react_1.default.createElement(modal_1.Modal, { open: deleteModal, lib: { Dialog: (_j = props.lib) === null || _j === void 0 ? void 0 : _j.Dialog, Transition: (_k = props.lib) === null || _k === void 0 ? void 0 : _k.Transition }, renderContent: renderDeleteModalContent, onClose: function () {
                 setDeletePasscodeInput("");
                 setDeleteModal(!deleteModal);
             }, notification: react_1.default.createElement(react_1.default.Fragment, null, renderNotification("modal")) }),
+        react_1.default.createElement(modal_1.Modal, { open: batchUpdateModal, lib: { Dialog: (_l = props.lib) === null || _l === void 0 ? void 0 : _l.Dialog, Transition: (_m = props.lib) === null || _m === void 0 ? void 0 : _m.Transition }, renderContent: renderBatchUpdateModalContent, onClose: function () {
+                setBatchUpdateData({ columnId: "", columnData: {} });
+                setBatchUpdateModal(false);
+            }, notification: react_1.default.createElement(react_1.default.Fragment, null, renderNotification("modal")) }),
         renderContent()));
 }
 exports.DataTemplate = DataTemplate;