oa-componentbook 0.18.382 → 0.18.383

package/build/components/oa-component-document-details-panel/DocumentDetailsPanel.js

@@ -15,7 +15,7 @@ function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(
 /**
  * Styled container for the details panel
  */
-const PanelContainer = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  background: var(--color-background, #fff);\n  height: 100%;\n  width: 100%;\n  box-sizing: border-box;\n\n  .panel-title {\n    margin: 0 0 24px 0;\n  }\n\n  .table-container {\n    border: 1px solid var(--color-border, #e8e8e8);\n    border-radius: 4px;\n    overflow: hidden;\n    margin-bottom: 24px;\n  }\n\n  .section-header {\n    background: var(--color-background-secondary, #f5f5f5);\n    padding: 12px 16px;\n    margin: 0;\n    border-bottom: 1px solid var(--color-border, #e8e8e8);\n  }\n\n  .details-table {\n    width: 100%;\n    margin: 0;\n    border-collapse: collapse;\n    background: var(--color-background, #fff);\n  }\n\n  .details-row {\n    border-bottom: 1px solid var(--color-border-light, #f0f0f0);\n  }\n\n  .details-row:last-child {\n    border-bottom: none;\n  }\n\n  .details-label {\n    width: 140px;\n    min-width: 140px;\n    padding: 16px;\n    padding-right: 16px;\n    text-align: left;\n    vertical-align: top;\n  }\n\n  .details-value {\n    padding: 16px;\n    word-break: break-word;\n    font-weight: 500;\n    vertical-align: top;\n  }\n\n  .details-actions {\n    display: flex;\n    flex-direction: row;\n    flex-wrap: wrap;\n    gap: 16px;\n    margin-top: 0;\n    padding-top: 0;\n    border-top: none;\n  }\n\n  .details-actions button {\n    padding: 0;\n    color: #1890ff !important;\n  }\n  .details-actions button:hover {\n    color: #1890ff !important;\n  }\n\n  .children-container {\n    margin-top: 24px;\n  }\n"])));
+const PanelContainer = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  background: var(--color-background, #fff);\n  height: 100%;\n  width: 100%;\n  box-sizing: border-box;\n\n  .panel-title {\n    margin: 0 0 24px 0;\n  }\n\n  .table-container {\n    border: 1px solid var(--color-border, #e8e8e8);\n    border-radius: 4px;\n    overflow: hidden;\n    margin-bottom: 24px;\n  }\n\n  .section-header {\n    background: var(--color-background-secondary, #f5f5f5);\n    padding: 12px 16px;\n    margin: 0;\n    border-bottom: 1px solid var(--color-border, #e8e8e8);\n  }\n\n  .details-table {\n    width: 100%;\n    margin: 0;\n    border-collapse: collapse;\n    background: var(--color-background, #fff);\n  }\n\n  .details-row {\n    border-bottom: 1px solid var(--color-border-light, #f0f0f0);\n  }\n\n  .details-row:last-child {\n    border-bottom: none;\n  }\n\n  .details-label {\n    width: 140px;\n    min-width: 140px;\n    padding: 16px;\n    padding-right: 16px;\n    text-align: left;\n    vertical-align: top;\n  }\n\n  .details-value {\n    padding: 16px;\n    word-break: break-word;\n    font-weight: 500;\n    vertical-align: top;\n  }\n\n  .details-actions {\n    display: flex;\n    flex-direction: row;\n    flex-wrap: wrap;\n    gap: 16px;\n    margin-top: 0;\n    padding-top: 0;\n    border-top: none;\n  }\n\n\n  .children-container {\n    margin-top: 24px;\n  }\n"])));
 
 /**
  * DocumentDetailsPanel Component

package/build/components/oa-component-table/CustomTableV1.js

@@ -263,7 +263,6 @@ function CustomTableV1(_ref2) {
             case "tag":
               const tagType = typeof subType === "function" ? subType(_, record) : subType;
               const tagLabel = label || _;
-              console.log("tagLabel", tagLabel);
               return tagLabel ? /*#__PURE__*/_react.default.createElement(_CustomTag.default, {
                 key: index,
                 label: tagLabel,

package/build/components/oa-component-table-with-search-and-filter/TableWithSearchAndFilter.js

@@ -421,10 +421,6 @@ function TableWithSearchAndFilter(_ref) {
         icon: _FilterList.default
       }),
       position: 'left'
-    },
-    style: {
-      borderColor: '#1890ff',
-      color: '#1890ff'
     }
   }), hasAppliedFilters && /*#__PURE__*/_react.default.createElement(_styles.FilterIndicatorDot, null))), showFilters && /*#__PURE__*/_react.default.createElement(_CustomDrawer.default, {
     title: filterDrawerTitle,
@@ -437,6 +433,7 @@ function TableWithSearchAndFilter(_ref) {
     width: 400,
     buttonConfig: filterDrawerButtonConfig
   }, /*#__PURE__*/_react.default.createElement(_styles.FilterDrawerContent, null, /*#__PURE__*/_react.default.createElement(_styles.FilterDrawerBody, null, filterConfig.length > 0 ? filterConfig.map(filter => /*#__PURE__*/_react.default.createElement(_styles.FilterSection, {
+    className: "formSecBox",
     key: filter.key
   }, /*#__PURE__*/_react.default.createElement(_styles.FilterLabel, null, filter.label, filter.required && /*#__PURE__*/_react.default.createElement(_styles.RequiredMark, null, "*")), renderFilterInput(filter))) : /*#__PURE__*/_react.default.createElement(_styles.FilterSection, null, /*#__PURE__*/_react.default.createElement(_styles.FilterLabel, null, "No filters configured"))))), /*#__PURE__*/_react.default.createElement(_CustomTable.default, _extends({
     rowKey: rowKey,

package/build/components/oa-component-table-with-search-and-filter/styles.js

@@ -9,7 +9,7 @@ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _temp
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 const TableWithSearchAndFilterContainer = exports.TableWithSearchAndFilterContainer = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  width: 100%;\n"])));
-const Toolbar = exports.Toolbar = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: 16px;\n  gap: 16px;\n\n  button.secondary {\n    border-color: #1890ff !important;\n    color: #1890ff !important;\n  }\n  button.secondary:hover {\n    border-color: #1890ff !important;\n    color: #1890ff !important;\n  }\n\n  @media screen and (max-width: 768px) {\n    flex-direction: column;\n    align-items: stretch;\n  }\n"])));
+const Toolbar = exports.Toolbar = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: 16px;\n  gap: 16px;\n\n  @media screen and (max-width: 768px) {\n    flex-direction: column;\n    align-items: stretch;\n  }\n"])));
 const FilterSection = exports.FilterSection = _styledComponents.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  margin-bottom: 24px;\n"])));
 const FilterLabel = exports.FilterLabel = _styledComponents.default.label(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  font-weight: 600;\n  font-size: 14px;\n  color: var(--color-primary-content, #212121);\n  margin-bottom: 12px;\n"])));
 const RequiredMark = exports.RequiredMark = _styledComponents.default.span(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  color: #ff4d4f;\n  margin-left: 2px;\n  font-weight: 400;\n"])));

package/build/components/oa-component-tag/CustomTag.js

@@ -32,7 +32,6 @@ function CustomTag(_ref) {
     textColor,
     style
   } = _ref;
-  console.log("style", style);
   return /*#__PURE__*/_react.default.createElement(_styles.StyledTag, _extends({
     "data-test": dataTest,
     type: type,

package/build/components/oa-component-upload/CustomUpload.js

@@ -175,19 +175,34 @@ function DocumentUpload(_ref) {
       try {
         if ((file === null || file === void 0 ? void 0 : file.uid) === (files === null || files === void 0 ? void 0 : files.uid)) {
           if (generateS3Url) {
-            var _response, _response2, _response3;
+            var _response, _response2, _response3, _response5, _response6, _response7;
             if (beforeUploadFileValidations && formName && !beforeUpload(file, allowedMediaType, maxAllowedSize)) {
               setLoading(false);
               return false;
             }
             let response = await generateS3Url(files.name);
-            response = (_response = response) === null || _response === void 0 ? void 0 : _response.data;
-            s3ResponseReturn(response);
-            await uploadOnS3((_response2 = response) === null || _response2 === void 0 || (_response2 = _response2.response) === null || _response2 === void 0 || (_response2 = _response2.data) === null || _response2 === void 0 ? void 0 : _response2.uploadUrl, files);
-            if (((_response3 = response) === null || _response3 === void 0 || (_response3 = _response3.response) === null || _response3 === void 0 || (_response3 = _response3.status) === null || _response3 === void 0 ? void 0 : _response3.toLowerCase()) == "success") {
+            // Handle error case: if response.data is null and response.error exists
+            if ((((_response = response) === null || _response === void 0 ? void 0 : _response.data) === null || !((_response2 = response) !== null && _response2 !== void 0 && _response2.data)) && (_response3 = response) !== null && _response3 !== void 0 && _response3.error) {
               var _response4;
+              openNotification({
+                description: ((_response4 = response) === null || _response4 === void 0 ? void 0 : _response4.error) || "Failed to generate upload URL. Please try again.",
+                type: "failure",
+                mode: "dark",
+                showIcon: true,
+                placement: "bottomRight"
+              });
+              modifiedFile.status = "failed";
+              modifiedFile = null;
+              setLoading(false);
+              return modifiedFile;
+            }
+            response = (_response5 = response) === null || _response5 === void 0 ? void 0 : _response5.data;
+            s3ResponseReturn(response);
+            await uploadOnS3((_response6 = response) === null || _response6 === void 0 || (_response6 = _response6.response) === null || _response6 === void 0 || (_response6 = _response6.data) === null || _response6 === void 0 ? void 0 : _response6.uploadUrl, files);
+            if (((_response7 = response) === null || _response7 === void 0 || (_response7 = _response7.response) === null || _response7 === void 0 || (_response7 = _response7.status) === null || _response7 === void 0 ? void 0 : _response7.toLowerCase()) == "success") {
+              var _response8;
               modifiedFile.status = "done";
-              modifiedFile.s3Uid = (_response4 = response) === null || _response4 === void 0 || (_response4 = _response4.response) === null || _response4 === void 0 || (_response4 = _response4.data) === null || _response4 === void 0 ? void 0 : _response4.uuid;
+              modifiedFile.s3Uid = (_response8 = response) === null || _response8 === void 0 || (_response8 = _response8.response) === null || _response8 === void 0 || (_response8 = _response8.data) === null || _response8 === void 0 ? void 0 : _response8.uuid;
               if (!isImageFile(files === null || files === void 0 ? void 0 : files.name)) {
                 modifiedFile.url = _PdfSampleImage.default;
               }

package/build/layout/GenricLayOut/GenricLayOut.js

@@ -38,6 +38,8 @@ var _downloadFile = _interopRequireDefault(require("../../utils/download-file"))
 var _AppliedFilters = _interopRequireDefault(require("./components/AppliedFilters"));
 var _ProfileSection = _interopRequireDefault(require("./components/ProfileSection"));
 var _FilterListRounded = _interopRequireDefault(require("@material-ui/icons/FilterListRounded"));
+var _MoreVert = _interopRequireDefault(require("@material-ui/icons/MoreVert"));
+var _CustomDropdown = _interopRequireDefault(require("../../components/oa-component-dropdown/CustomDropdown"));
 var _CustomInfo = _interopRequireDefault(require("../../components/oa-component-info/CustomInfo"));
 const _excluded = ["filteredValue"],
   _excluded2 = ["sortOrder"];
@@ -53,7 +55,7 @@ function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key i
 function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
 function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); } /* eslint-disable */
 function GenricLayOut(_ref) {
-  var _state$misc30, _sidebar$mobileMenuIt, _imageViewer$content, _imageViewer$content2, _infoData$iconConfig, _infoData$iconConfig2, _infoData$iconConfig3, _infoData$iconConfig4, _leftHeaderFirstButto, _leftHeaderFirstButto2, _infoPanel$data, _infoPanel$data2, _infoPanel$data3, _infoPanel$data4, _infoPanel$data5, _state$customDrawer3, _state$customDrawer4, _tabs$list, _ref7, _tabs$extraAction$che2, _tabs$extraAction$pro, _tables$columns3, _tables$columns4, _tabs$active3, _state$tables5, _tables$selectionType, _tabs$active4, _tables$selectionType2, _tables$pagination19, _drawer$data, _tabs$active5, _drawer$data$drawer$a, _drawer$data2, _tabs$active6, _tabs$active7, _nestedDrawer$data, _nestedDrawer$data$ca, _nestedDrawer$data2, _customDrawer$data, _customDrawer$data2, _contentPanel$dataSou, _tables$tableFooter, _tables$selectedRowKe, _tables$tableFooter2, _tables$tableFooter3, _tables$tableFooter5;
+  var _state$misc34, _sidebar$mobileMenuIt, _imageViewer$content, _imageViewer$content2, _infoData$iconConfig, _infoData$iconConfig2, _infoData$iconConfig3, _infoData$iconConfig4, _leftHeaderFirstButto, _leftHeaderFirstButto2, _leftHeaderSecondButt, _leftHeaderSecondButt2, _infoPanel$data, _infoPanel$data2, _infoPanel$data3, _infoPanel$data4, _infoPanel$data5, _state$customDrawer3, _state$customDrawer4, _tabs$list, _ref7, _tabs$extraAction$che2, _tabs$extraAction$pro, _tables$columns3, _tables$columns4, _tabs$active3, _state$tables5, _tables$selectionType, _tabs$active4, _tables$selectionType2, _tables$pagination19, _drawer$data, _tabs$active5, _drawer$data$drawer$a, _drawer$data2, _tabs$active6, _tabs$active7, _nestedDrawer$data, _nestedDrawer$data$ca, _nestedDrawer$data2, _customDrawer$data, _customDrawer$data2, _contentPanel$dataSou, _tables$tableFooter, _tables$selectedRowKe, _tables$tableFooter2, _tables$tableFooter3, _tables$tableFooter5;
   let {
     config,
     getInitialData,
@@ -84,6 +86,10 @@ function GenricLayOut(_ref) {
       handleSwitchSelectItem,
       handleTableColumnClickParent,
       handleLeftHeaderFirstButton,
+      handleLeftHeaderSecondButton,
+      handleRightHeaderButtonClick,
+      handleDownloadTemplate,
+      handleCtaDownload,
       handleTabExtraActionChange
     } = {}
   } = _ref;
@@ -105,6 +111,7 @@ function GenricLayOut(_ref) {
     nestedDrawer,
     modal,
     leftHeaderFirstButton,
+    leftHeaderSecondButton,
     rightHeaderFirstButton,
     rightHeaderSecondButton,
     imageViewer,
@@ -151,7 +158,6 @@ function GenricLayOut(_ref) {
         showSuccessNotification(message);
         sessionStorage.removeItem("showEnterpriseNotification");
       } catch (error) {
-        console.error("Error parsing notification data:", error);
         sessionStorage.removeItem("showEnterpriseNotification");
       }
     }
@@ -999,6 +1005,10 @@ function GenricLayOut(_ref) {
           });
         }
       }
+    } else if ((configArgs === null || configArgs === void 0 ? void 0 : configArgs.action) === "CTA_DOWNLOAD") {
+      if (handleCtaDownload) {
+        handleCtaDownload(record);
+      }
     }
   };
 
@@ -1691,16 +1701,51 @@ function GenricLayOut(_ref) {
           showErrorNotification(error);
         } else {
           var _formData$fileName;
-          (0, _downloadFile.default)(data, (_formData$fileName = formData.fileName) !== null && _formData$fileName !== void 0 ? _formData$fileName : undefined);
+          (0, _downloadFile.default)(data, formData !== null && formData !== void 0 && formData.exportType ? "".concat(formData === null || formData === void 0 ? void 0 : formData.exportType, "_").concat(formData === null || formData === void 0 ? void 0 : formData.fileName) : (_formData$fileName = formData === null || formData === void 0 ? void 0 : formData.fileName) !== null && _formData$fileName !== void 0 ? _formData$fileName : undefined);
+          dispatch({
+            type: _layoutReducer.actionTypes.CUSTOM_DRAWER_CLOSED
+          });
+        }
+      }
+    } else if ((formData === null || formData === void 0 ? void 0 : formData.drawerKey) === "leftHeaderSecondButtonSubmit") {
+      if (handleLeftHeaderSecondButton) {
+        var _state$misc23;
+        const response = await handleLeftHeaderSecondButton(_objectSpread(_objectSpread({}, formData), (_state$misc23 = state === null || state === void 0 ? void 0 : state.misc) !== null && _state$misc23 !== void 0 ? _state$misc23 : {}));
+        const {
+          error,
+          data
+        } = response;
+        if (error) {
+          showErrorNotification(error);
+        } else {
+          var _formData$fileName2;
+          (0, _downloadFile.default)(data, formData !== null && formData !== void 0 && formData.exportType ? "".concat(formData === null || formData === void 0 ? void 0 : formData.exportType, "_").concat(formData === null || formData === void 0 ? void 0 : formData.fileName) : (_formData$fileName2 = formData === null || formData === void 0 ? void 0 : formData.fileName) !== null && _formData$fileName2 !== void 0 ? _formData$fileName2 : undefined);
+          dispatch({
+            type: _layoutReducer.actionTypes.CUSTOM_DRAWER_CLOSED
+          });
+        }
+      }
+    } else if ((formData === null || formData === void 0 ? void 0 : formData.type) === "BULK_CREATION") {
+      if (handleDrawerFormOnFinish) {
+        var _state$misc24;
+        const {
+          error,
+          data
+        } = await (handleDrawerFormOnFinish === null || handleDrawerFormOnFinish === void 0 ? void 0 : handleDrawerFormOnFinish(_objectSpread(_objectSpread({}, formData), (_state$misc24 = state === null || state === void 0 ? void 0 : state.misc) !== null && _state$misc24 !== void 0 ? _state$misc24 : {})));
+        if (error) {
+          showErrorNotification(error);
+        } else {
           dispatch({
             type: _layoutReducer.actionTypes.CUSTOM_DRAWER_CLOSED
           });
+          showSuccessNotification(data === null || data === void 0 ? void 0 : data.message);
+          init();
         }
       }
     }
   };
   const onClearAllAppliedFilters = async () => {
-    var _state$dropdownSearch9, _state$inputSearch9, _state$tabs15, _tables$pagination9, _tables$pagination10, _tables$filter10, _tables$sorting23, _header$subHeading27, _header$subHeading28, _staticFilter$data11, _tables$sorting24, _state$misc23, _state$staticFilter$m11, _state$staticFilter11;
+    var _state$dropdownSearch9, _state$inputSearch9, _state$tabs15, _tables$pagination9, _tables$pagination10, _tables$filter10, _tables$sorting23, _header$subHeading27, _header$subHeading28, _staticFilter$data11, _tables$sorting24, _state$misc25, _state$staticFilter$m11, _state$staticFilter11;
     resetTabsExtraActionSwitch();
     const {
       error,
@@ -1724,7 +1769,7 @@ function GenricLayOut(_ref) {
       staticFilter: staticFilter.data.find(item => item.selected).value
     }), {}, {
       order: tables === null || tables === void 0 || (_tables$sorting24 = tables.sorting) === null || _tables$sorting24 === void 0 ? void 0 : _tables$sorting24.sortDirection
-    }, (_state$misc23 = state === null || state === void 0 ? void 0 : state.misc) !== null && _state$misc23 !== void 0 ? _state$misc23 : {}), {}, {
+    }, (_state$misc25 = state === null || state === void 0 ? void 0 : state.misc) !== null && _state$misc25 !== void 0 ? _state$misc25 : {}), {}, {
       multiSelectValue: (_state$staticFilter$m11 = state === null || state === void 0 || (_state$staticFilter11 = state.staticFilter) === null || _state$staticFilter11 === void 0 ? void 0 : _state$staticFilter11.multiSelectValue) !== null && _state$staticFilter$m11 !== void 0 ? _state$staticFilter$m11 : []
     }));
     if (error) {
@@ -1783,14 +1828,14 @@ function GenricLayOut(_ref) {
       return;
     } else if (action === "CLOSE_MODAL_AND_FETCH") {
       if (handleModalCloseSuccess) {
-        var _stateRef$current, _state$misc24;
+        var _stateRef$current, _state$misc26;
         const {
           error,
           data
         } = await (handleModalCloseSuccess === null || handleModalCloseSuccess === void 0 ? void 0 : handleModalCloseSuccess(_objectSpread({
           modalValue: stateRef === null || stateRef === void 0 || (_stateRef$current = stateRef.current) === null || _stateRef$current === void 0 || (_stateRef$current = _stateRef$current.modal) === null || _stateRef$current === void 0 ? void 0 : _stateRef$current.value,
           call: buttonConfig === null || buttonConfig === void 0 ? void 0 : buttonConfig.call
-        }, (_state$misc24 = state === null || state === void 0 ? void 0 : state.misc) !== null && _state$misc24 !== void 0 ? _state$misc24 : {})));
+        }, (_state$misc26 = state === null || state === void 0 ? void 0 : state.misc) !== null && _state$misc26 !== void 0 ? _state$misc26 : {})));
         if (error) {
           showErrorNotification(error);
         } else {
@@ -1804,11 +1849,11 @@ function GenricLayOut(_ref) {
       }
     } else {
       if (handleDrawerFormOnFinish) {
-        var _state$tables$selecte, _state$tables4, _state$misc25;
+        var _state$tables$selecte, _state$tables4, _state$misc27;
         let req = {};
         req.type = "APPROVE";
         req.orderUUID = (_state$tables$selecte = state === null || state === void 0 || (_state$tables4 = state.tables) === null || _state$tables4 === void 0 || (_state$tables4 = _state$tables4.selectedRowKeys) === null || _state$tables4 === void 0 ? void 0 : _state$tables4.map(item => item.orderUUID)) !== null && _state$tables$selecte !== void 0 ? _state$tables$selecte : [];
-        req.misc = (_state$misc25 = state === null || state === void 0 ? void 0 : state.misc) !== null && _state$misc25 !== void 0 ? _state$misc25 : {};
+        req.misc = (_state$misc27 = state === null || state === void 0 ? void 0 : state.misc) !== null && _state$misc27 !== void 0 ? _state$misc27 : {};
         const {
           error,
           data
@@ -1887,6 +1932,45 @@ function GenricLayOut(_ref) {
     }
   };
 
+  /**
+   * Handles the left header second button click event.
+   *
+   * @async
+   * @function
+   * @returns {Promise<void>} - Resolves after the action is handled.
+   *
+   * Handles the left header second button clicks with the following actions:
+   * - "OPEN_CUSTOM_DRAWER": Opens a custom drawer with the specified key.
+   * - "EXPORT_DATA": Triggers data export functionality.
+   */
+  const leftHeaderSecondButtonClick = async () => {
+    if ((leftHeaderSecondButton === null || leftHeaderSecondButton === void 0 ? void 0 : leftHeaderSecondButton.action) === "OPEN_CUSTOM_DRAWER") {
+      var _config$customDrawer4;
+      const drawerData = config === null || config === void 0 || (_config$customDrawer4 = config.customDrawer) === null || _config$customDrawer4 === void 0 || (_config$customDrawer4 = _config$customDrawer4.data) === null || _config$customDrawer4 === void 0 ? void 0 : _config$customDrawer4[leftHeaderSecondButton === null || leftHeaderSecondButton === void 0 ? void 0 : leftHeaderSecondButton.drawerKey];
+      dispatch({
+        type: _layoutReducer.actionTypes.SET_CUSTOM_DRAWER,
+        payload: drawerData
+      });
+      dispatch({
+        type: _layoutReducer.actionTypes.CUSTOM_DRAWER_OPEN
+      });
+    } else if ((leftHeaderSecondButton === null || leftHeaderSecondButton === void 0 ? void 0 : leftHeaderSecondButton.action) === "EXPORT_DATA") {
+      handleLeftHeaderSecondButton(state).then(res => {
+        const {
+          error,
+          data
+        } = res;
+        if (error) {
+          showErrorNotification(error);
+        } else {
+          showSuccessNotification((data === null || data === void 0 ? void 0 : data.message) || "Export initiated successfully");
+        }
+      }).catch(err => {
+        showErrorNotification(err.message || "An error occurred during export");
+      });
+    }
+  };
+
   /**
    * Handles the right header button click event.
    *
@@ -1901,11 +1985,12 @@ function GenricLayOut(_ref) {
    */
   const rightHeaderFirstButtonClick = async () => {
     if ((rightHeaderFirstButton === null || rightHeaderFirstButton === void 0 ? void 0 : rightHeaderFirstButton.action) === "OPEN_CUSTOM_DRAWER") {
-      var _config$customDrawer4, _state$customDrawer2;
-      const drawerData = config === null || config === void 0 || (_config$customDrawer4 = config.customDrawer) === null || _config$customDrawer4 === void 0 || (_config$customDrawer4 = _config$customDrawer4.data) === null || _config$customDrawer4 === void 0 ? void 0 : _config$customDrawer4[rightHeaderFirstButton === null || rightHeaderFirstButton === void 0 ? void 0 : rightHeaderFirstButton.drawerKey];
+      var _config$customDrawer5, _state$misc28, _state$customDrawer2;
+      const drawerData = config === null || config === void 0 || (_config$customDrawer5 = config.customDrawer) === null || _config$customDrawer5 === void 0 || (_config$customDrawer5 = _config$customDrawer5.data) === null || _config$customDrawer5 === void 0 ? void 0 : _config$customDrawer5[rightHeaderFirstButton === null || rightHeaderFirstButton === void 0 ? void 0 : rightHeaderFirstButton.drawerKey];
+      const dynamicConfig = (0, _staticConfigResolver.removeHidden)((0, _staticConfigResolver.default)(drawerData, (_state$misc28 = state === null || state === void 0 ? void 0 : state.misc) !== null && _state$misc28 !== void 0 ? _state$misc28 : {}));
       dispatch({
         type: _layoutReducer.actionTypes.SET_CUSTOM_DRAWER,
-        payload: drawerData
+        payload: dynamicConfig
       });
       dispatch({
         type: _layoutReducer.actionTypes.CUSTOM_DRAWER_OPEN
@@ -1916,15 +2001,35 @@ function GenricLayOut(_ref) {
         syncFilterFormWithAppliedFilters(state.customDrawer.appliedFilters);
       }
     } else if ((rightHeaderFirstButton === null || rightHeaderFirstButton === void 0 ? void 0 : rightHeaderFirstButton.action) === "OPEN_DRAWER") {
-      dispatch({
-        type: _layoutReducer.actionTypes.TOGGLE_DRAWER,
-        payload: rightHeaderFirstButton === null || rightHeaderFirstButton === void 0 ? void 0 : rightHeaderFirstButton.key
-      });
+      // Check if button has a drawerKey for custom drawer, otherwise use key for regular drawer
+      if (rightHeaderFirstButton !== null && rightHeaderFirstButton !== void 0 && rightHeaderFirstButton.drawerKey) {
+        var _config$customDrawer6, _state$misc29;
+        const drawerData = config === null || config === void 0 || (_config$customDrawer6 = config.customDrawer) === null || _config$customDrawer6 === void 0 || (_config$customDrawer6 = _config$customDrawer6.data) === null || _config$customDrawer6 === void 0 ? void 0 : _config$customDrawer6[rightHeaderFirstButton === null || rightHeaderFirstButton === void 0 ? void 0 : rightHeaderFirstButton.drawerKey];
+        const {
+          error,
+          data
+        } = await handleRightHeaderButtonClick(_objectSpread({}, (_state$misc29 = state === null || state === void 0 ? void 0 : state.misc) !== null && _state$misc29 !== void 0 ? _state$misc29 : {}));
+        if (drawerData) {
+          const dynamicConfig = (0, _staticConfigResolver.removeHidden)((0, _staticConfigResolver.default)(drawerData, data !== null && data !== void 0 ? data : {}));
+          dispatch({
+            type: _layoutReducer.actionTypes.SET_CUSTOM_DRAWER,
+            payload: dynamicConfig
+          });
+          dispatch({
+            type: _layoutReducer.actionTypes.CUSTOM_DRAWER_OPEN
+          });
+        }
+      } else {
+        dispatch({
+          type: _layoutReducer.actionTypes.TOGGLE_DRAWER,
+          payload: rightHeaderFirstButton === null || rightHeaderFirstButton === void 0 ? void 0 : rightHeaderFirstButton.key
+        });
+      }
     }
   };
   const rightHeaderSecondButtonClick = async () => {
     if ((rightHeaderSecondButton === null || rightHeaderSecondButton === void 0 ? void 0 : rightHeaderSecondButton.action) === "RESET_CUSTOM_DRAWER") {
-      var _state$dropdownSearch10, _state$inputSearch10, _state$tabs16, _tables$pagination11, _tables$pagination12, _tables$filter11, _tables$sorting25, _header$subHeading29, _header$subHeading30, _staticFilter$data12, _tables$sorting26, _state$misc26, _state$staticFilter$m12, _state$staticFilter12;
+      var _state$dropdownSearch10, _state$inputSearch10, _state$tabs16, _tables$pagination11, _tables$pagination12, _tables$filter11, _tables$sorting25, _header$subHeading29, _header$subHeading30, _staticFilter$data12, _tables$sorting26, _state$misc30, _state$staticFilter$m12, _state$staticFilter12;
       resetTabsExtraActionSwitch();
       const {
         error,
@@ -1948,7 +2053,7 @@ function GenricLayOut(_ref) {
         staticFilter: staticFilter.data.find(item => item.selected).value
       }), {}, {
         order: tables === null || tables === void 0 || (_tables$sorting26 = tables.sorting) === null || _tables$sorting26 === void 0 ? void 0 : _tables$sorting26.sortDirection
-      }, (_state$misc26 = state === null || state === void 0 ? void 0 : state.misc) !== null && _state$misc26 !== void 0 ? _state$misc26 : {}), {}, {
+      }, (_state$misc30 = state === null || state === void 0 ? void 0 : state.misc) !== null && _state$misc30 !== void 0 ? _state$misc30 : {}), {}, {
         multiSelectValue: (_state$staticFilter$m12 = state === null || state === void 0 || (_state$staticFilter12 = state.staticFilter) === null || _state$staticFilter12 === void 0 ? void 0 : _state$staticFilter12.multiSelectValue) !== null && _state$staticFilter$m12 !== void 0 ? _state$staticFilter$m12 : []
       }));
       if (error) {
@@ -1957,7 +2062,7 @@ function GenricLayOut(_ref) {
           type: _layoutReducer.actionTypes.SET_TABLE_EMPTY
         });
       } else {
-        var _config$customDrawer5;
+        var _config$customDrawer7;
         if (staticFilter !== null && staticFilter !== void 0 && staticFilter.visible) {
           setStaticFilterData(data);
         }
@@ -1968,7 +2073,7 @@ function GenricLayOut(_ref) {
         dispatch({
           type: _layoutReducer.actionTypes.CLEAR_ALL_APPLIED_FILTERS
         });
-        const drawerData = config === null || config === void 0 || (_config$customDrawer5 = config.customDrawer) === null || _config$customDrawer5 === void 0 || (_config$customDrawer5 = _config$customDrawer5.data) === null || _config$customDrawer5 === void 0 ? void 0 : _config$customDrawer5[rightHeaderSecondButton === null || rightHeaderSecondButton === void 0 ? void 0 : rightHeaderSecondButton.drawerKey];
+        const drawerData = config === null || config === void 0 || (_config$customDrawer7 = config.customDrawer) === null || _config$customDrawer7 === void 0 || (_config$customDrawer7 = _config$customDrawer7.data) === null || _config$customDrawer7 === void 0 ? void 0 : _config$customDrawer7[rightHeaderSecondButton === null || rightHeaderSecondButton === void 0 ? void 0 : rightHeaderSecondButton.drawerKey];
         if (drawerData) {
           dispatch({
             type: _layoutReducer.actionTypes.SET_CUSTOM_DRAWER,
@@ -1979,6 +2084,41 @@ function GenricLayOut(_ref) {
     }
   };
 
+  /**
+   * Handles the menu item click for rightHeaderFirstButton menu
+   * @param {Object} menuItem - The clicked menu item
+   */
+  const handleRightHeaderFirstButtonMenuClick = menuItem => {
+    // Check if menuItem has drawerKey to open a drawer
+    if (menuItem !== null && menuItem !== void 0 && menuItem.drawerKey) {
+      // Check if it's a custom drawer or regular drawer
+      if ((menuItem === null || menuItem === void 0 ? void 0 : menuItem.drawerType) === "custom") {
+        var _config$customDrawer8;
+        const drawerData = config === null || config === void 0 || (_config$customDrawer8 = config.customDrawer) === null || _config$customDrawer8 === void 0 || (_config$customDrawer8 = _config$customDrawer8.data) === null || _config$customDrawer8 === void 0 ? void 0 : _config$customDrawer8[menuItem.drawerKey];
+        if (drawerData) {
+          dispatch({
+            type: _layoutReducer.actionTypes.SET_CUSTOM_DRAWER,
+            payload: drawerData
+          });
+          dispatch({
+            type: _layoutReducer.actionTypes.CUSTOM_DRAWER_OPEN
+          });
+        }
+      } else {
+        // Regular drawer - open using drawer key
+        dispatch({
+          type: _layoutReducer.actionTypes.TOGGLE_DRAWER,
+          payload: menuItem.drawerKey
+        });
+      }
+    }
+
+    // Call custom handler if provided
+    if (rightHeaderFirstButton !== null && rightHeaderFirstButton !== void 0 && rightHeaderFirstButton.onMenuClick) {
+      rightHeaderFirstButton.onMenuClick(menuItem, state);
+    }
+  };
+
   /**
    * @function
    * @param {Object} selectedOption - The selected option from the custom select.
@@ -2001,7 +2141,7 @@ function GenricLayOut(_ref) {
   };
   const handleSubHeadingSelect = async val => {
     if (val) {
-      var _state$tabs17, _tables$pagination13, _tables$pagination14, _state$misc27;
+      var _state$tabs17, _tables$pagination13, _tables$pagination14, _state$misc31;
       dispatch({
         type: _layoutReducer.actionTypes.SET_SUBHEADING_SELECTED_CONFIG,
         payload: val
@@ -2015,7 +2155,7 @@ function GenricLayOut(_ref) {
         current: tables === null || tables === void 0 || (_tables$pagination13 = tables.pagination) === null || _tables$pagination13 === void 0 ? void 0 : _tables$pagination13.current,
         pageSize: tables === null || tables === void 0 || (_tables$pagination14 = tables.pagination) === null || _tables$pagination14 === void 0 ? void 0 : _tables$pagination14.pageSize,
         subHeadingSelectVal: val
-      }, (_state$misc27 = state === null || state === void 0 ? void 0 : state.misc) !== null && _state$misc27 !== void 0 ? _state$misc27 : {}));
+      }, (_state$misc31 = state === null || state === void 0 ? void 0 : state.misc) !== null && _state$misc31 !== void 0 ? _state$misc31 : {}));
       if (error) {
         showErrorNotification(error);
         dispatch({
@@ -2052,7 +2192,7 @@ function GenricLayOut(_ref) {
 
     // Call the handler if provided
     if (handleTableChange) {
-      var _state$dropdownSearch11, _state$inputSearch11, _state$tabs18, _tables$pagination15, _tables$sorting27, _tables$sorting28, _header$subHeading31, _header$subHeading32, _customDrawer$applied10, _state$misc28;
+      var _state$dropdownSearch11, _state$inputSearch11, _state$tabs18, _tables$pagination15, _tables$sorting27, _tables$sorting28, _header$subHeading31, _header$subHeading32, _customDrawer$applied10, _state$misc32;
       dispatch({
         type: _layoutReducer.actionTypes.SET_LOADING,
         payload: true
@@ -2074,7 +2214,7 @@ function GenricLayOut(_ref) {
         order: tables === null || tables === void 0 || (_tables$sorting28 = tables.sorting) === null || _tables$sorting28 === void 0 ? void 0 : _tables$sorting28.sortDirection
       }, (header === null || header === void 0 || (_header$subHeading31 = header.subHeading) === null || _header$subHeading31 === void 0 || (_header$subHeading31 = _header$subHeading31.jsxConfig) === null || _header$subHeading31 === void 0 ? void 0 : _header$subHeading31.type) == "select" ? {
         subHeadingSelectVal: header === null || header === void 0 || (_header$subHeading32 = header.subHeading) === null || _header$subHeading32 === void 0 || (_header$subHeading32 = _header$subHeading32.jsxConfig) === null || _header$subHeading32 === void 0 ? void 0 : _header$subHeading32.value
-      } : {}), (customDrawer === null || customDrawer === void 0 ? void 0 : customDrawer.appliedFilters) && Object.keys((_customDrawer$applied10 = customDrawer === null || customDrawer === void 0 ? void 0 : customDrawer.appliedFilters) !== null && _customDrawer$applied10 !== void 0 ? _customDrawer$applied10 : {}).length > 0 && _objectSpread({}, customDrawer === null || customDrawer === void 0 ? void 0 : customDrawer.appliedFilters)), (_state$misc28 = state === null || state === void 0 ? void 0 : state.misc) !== null && _state$misc28 !== void 0 ? _state$misc28 : {}), {}, {
+      } : {}), (customDrawer === null || customDrawer === void 0 ? void 0 : customDrawer.appliedFilters) && Object.keys((_customDrawer$applied10 = customDrawer === null || customDrawer === void 0 ? void 0 : customDrawer.appliedFilters) !== null && _customDrawer$applied10 !== void 0 ? _customDrawer$applied10 : {}).length > 0 && _objectSpread({}, customDrawer === null || customDrawer === void 0 ? void 0 : customDrawer.appliedFilters)), (_state$misc32 = state === null || state === void 0 ? void 0 : state.misc) !== null && _state$misc32 !== void 0 ? _state$misc32 : {}), {}, {
         staticFilter: filterValue,
         // Pass static filter value
         multiSelectValue: multiSelectValue
@@ -2119,7 +2259,7 @@ function GenricLayOut(_ref) {
       }
     });
     if (handleTableChange) {
-      var _state$dropdownSearch12, _state$inputSearch12, _state$tabs19, _tables$filter12, _tables$sorting29, _tables$sorting30, _header$subHeading33, _header$subHeading34, _staticFilter$data13, _customDrawer$applied11, _state$misc29, _state$staticFilter$m13, _state$staticFilter13;
+      var _state$dropdownSearch12, _state$inputSearch12, _state$tabs19, _tables$filter12, _tables$sorting29, _tables$sorting30, _header$subHeading33, _header$subHeading34, _staticFilter$data13, _customDrawer$applied11, _state$misc33, _state$staticFilter$m13, _state$staticFilter13;
       const {
         error,
         data
@@ -2139,7 +2279,7 @@ function GenricLayOut(_ref) {
         subHeadingSelectVal: header === null || header === void 0 || (_header$subHeading34 = header.subHeading) === null || _header$subHeading34 === void 0 || (_header$subHeading34 = _header$subHeading34.jsxConfig) === null || _header$subHeading34 === void 0 ? void 0 : _header$subHeading34.value
       } : {}), (staticFilter === null || staticFilter === void 0 ? void 0 : staticFilter.visible) && ((_staticFilter$data13 = staticFilter.data) === null || _staticFilter$data13 === void 0 || (_staticFilter$data13 = _staticFilter$data13.find(item => item.selected)) === null || _staticFilter$data13 === void 0 ? void 0 : _staticFilter$data13.value) && {
         staticFilter: staticFilter.data.find(item => item.selected).value
-      }), (customDrawer === null || customDrawer === void 0 ? void 0 : customDrawer.appliedFilters) && Object.keys((_customDrawer$applied11 = customDrawer === null || customDrawer === void 0 ? void 0 : customDrawer.appliedFilters) !== null && _customDrawer$applied11 !== void 0 ? _customDrawer$applied11 : {}).length > 0 && _objectSpread({}, customDrawer === null || customDrawer === void 0 ? void 0 : customDrawer.appliedFilters)), (_state$misc29 = state === null || state === void 0 ? void 0 : state.misc) !== null && _state$misc29 !== void 0 ? _state$misc29 : {}), {}, {
+      }), (customDrawer === null || customDrawer === void 0 ? void 0 : customDrawer.appliedFilters) && Object.keys((_customDrawer$applied11 = customDrawer === null || customDrawer === void 0 ? void 0 : customDrawer.appliedFilters) !== null && _customDrawer$applied11 !== void 0 ? _customDrawer$applied11 : {}).length > 0 && _objectSpread({}, customDrawer === null || customDrawer === void 0 ? void 0 : customDrawer.appliedFilters)), (_state$misc33 = state === null || state === void 0 ? void 0 : state.misc) !== null && _state$misc33 !== void 0 ? _state$misc33 : {}), {}, {
         multiSelectValue: (_state$staticFilter$m13 = state === null || state === void 0 || (_state$staticFilter13 = state.staticFilter) === null || _state$staticFilter13 === void 0 ? void 0 : _state$staticFilter13.multiSelectValue) !== null && _state$staticFilter$m13 !== void 0 ? _state$staticFilter$m13 : []
       }));
       if (error) {
@@ -2170,7 +2310,7 @@ function GenricLayOut(_ref) {
   console.log(state, "GenricLayOutstate");
   return /*#__PURE__*/_react.default.createElement(_styles.OapageWithDataStyle, {
     marginBottom: infoPanel !== null && infoPanel !== void 0 && infoPanel.bottomMarginRequired ? "18px" : "0",
-    className: (state === null || state === void 0 || (_state$misc30 = state.misc) === null || _state$misc30 === void 0 ? void 0 : _state$misc30.flow) === "hubAutomation" ? "hubAutomationContainer" : ""
+    className: (state === null || state === void 0 || (_state$misc34 = state.misc) === null || _state$misc34 === void 0 ? void 0 : _state$misc34.flow) === "hubAutomation" ? "hubAutomationContainer" : ""
   }, /*#__PURE__*/_react.default.createElement(_styles.DrawerWithOutFooter, null), /*#__PURE__*/_react.default.createElement("div", {
     className: "fullPageLayout"
   }, /*#__PURE__*/_react.default.createElement(_GlobalCss.default, null, (sidebar === null || sidebar === void 0 ? void 0 : sidebar.visible) && /*#__PURE__*/_react.default.createElement(_antd.Skeleton, {
@@ -2278,6 +2418,20 @@ function GenricLayOut(_ref) {
       }),
       position: leftHeaderFirstButton === null || leftHeaderFirstButton === void 0 || (_leftHeaderFirstButto2 = leftHeaderFirstButton.iconConfig) === null || _leftHeaderFirstButto2 === void 0 ? void 0 : _leftHeaderFirstButto2.position
     }
+  })), (leftHeaderSecondButton === null || leftHeaderSecondButton === void 0 ? void 0 : leftHeaderSecondButton.visible) && /*#__PURE__*/_react.default.createElement(_CustomButton.default, _extends({
+    label: leftHeaderSecondButton === null || leftHeaderSecondButton === void 0 ? void 0 : leftHeaderSecondButton.label,
+    onClick: leftHeaderSecondButtonClick,
+    type: leftHeaderSecondButton === null || leftHeaderSecondButton === void 0 ? void 0 : leftHeaderSecondButton.type,
+    size: leftHeaderSecondButton === null || leftHeaderSecondButton === void 0 ? void 0 : leftHeaderSecondButton.size
+  }, (leftHeaderSecondButton === null || leftHeaderSecondButton === void 0 ? void 0 : leftHeaderSecondButton.iconConfig) && {
+    iconConfig: {
+      icon: /*#__PURE__*/_react.default.createElement(_MaterialIcon.default, {
+        icon: leftHeaderSecondButton === null || leftHeaderSecondButton === void 0 || (_leftHeaderSecondButt = leftHeaderSecondButton.iconConfig) === null || _leftHeaderSecondButt === void 0 ? void 0 : _leftHeaderSecondButt.icon,
+        size: 24,
+        color: "primary"
+      }),
+      position: leftHeaderSecondButton === null || leftHeaderSecondButton === void 0 || (_leftHeaderSecondButt2 = leftHeaderSecondButton.iconConfig) === null || _leftHeaderSecondButt2 === void 0 ? void 0 : _leftHeaderSecondButt2.position
+    }
   })), /*#__PURE__*/_react.default.createElement("div", {
     className: "oaheaderButtonsRight"
   }, !isFiltersEmpty(customDrawer === null || customDrawer === void 0 ? void 0 : customDrawer.appliedFilters) && /*#__PURE__*/_react.default.createElement(_CustomButton.default, {
@@ -2285,7 +2439,13 @@ function GenricLayOut(_ref) {
     onClick: rightHeaderSecondButtonClick,
     type: rightHeaderSecondButton === null || rightHeaderSecondButton === void 0 ? void 0 : rightHeaderSecondButton.type,
     size: rightHeaderSecondButton === null || rightHeaderSecondButton === void 0 ? void 0 : rightHeaderSecondButton.size
-  }), (rightHeaderFirstButton === null || rightHeaderFirstButton === void 0 ? void 0 : rightHeaderFirstButton.visible) && /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_CustomButton.default, {
+  }), (rightHeaderFirstButton === null || rightHeaderFirstButton === void 0 ? void 0 : rightHeaderFirstButton.visible) && /*#__PURE__*/_react.default.createElement("div", {
+    style: {
+      display: "flex",
+      alignItems: "center",
+      gap: "8px"
+    }
+  }, /*#__PURE__*/_react.default.createElement(_CustomButton.default, {
     label: rightHeaderFirstButton === null || rightHeaderFirstButton === void 0 ? void 0 : rightHeaderFirstButton.label,
     onClick: rightHeaderFirstButtonClick,
     type: rightHeaderFirstButton === null || rightHeaderFirstButton === void 0 ? void 0 : rightHeaderFirstButton.type,
@@ -2298,7 +2458,25 @@ function GenricLayOut(_ref) {
       }),
       position: "left"
     })
-  }), !isFiltersEmpty(customDrawer === null || customDrawer === void 0 ? void 0 : customDrawer.appliedFilters) && /*#__PURE__*/_react.default.createElement("span", {
+  }), (rightHeaderFirstButton === null || rightHeaderFirstButton === void 0 ? void 0 : rightHeaderFirstButton.menuItems) && Array.isArray(rightHeaderFirstButton.menuItems) && rightHeaderFirstButton.menuItems.length > 0 && /*#__PURE__*/_react.default.createElement(_CustomDropdown.default, {
+    items: rightHeaderFirstButton.menuItems,
+    onMenuItemClick: handleRightHeaderFirstButtonMenuClick,
+    trigger: ["click"],
+    placement: "bottomRight",
+    type: "default"
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    style: {
+      cursor: "pointer",
+      display: "flex",
+      alignItems: "center",
+      padding: "4px",
+      marginTop: "14px"
+    }
+  }, /*#__PURE__*/_react.default.createElement(_MaterialIcon.default, {
+    icon: _MoreVert.default,
+    size: 24,
+    color: "secondary-content"
+  }))), !isFiltersEmpty(customDrawer === null || customDrawer === void 0 ? void 0 : customDrawer.appliedFilters) && /*#__PURE__*/_react.default.createElement("span", {
     className: "notifyDot"
   })))))), (inputSearch === null || inputSearch === void 0 ? void 0 : inputSearch.visible) && /*#__PURE__*/_react.default.createElement(_antd.Skeleton, {
     loading: state === null || state === void 0 ? void 0 : state.isLoading,
@@ -2374,7 +2552,7 @@ function GenricLayOut(_ref) {
           }
           // Call handleTabExtraActionChange
           if (handleTabExtraActionChange) {
-            var _tables$pagination17, _tables$pagination18, _tables$sorting31, _tables$sorting32, _tables$filter13, _staticFilter$data14, _state$misc31;
+            var _tables$pagination17, _tables$pagination18, _tables$sorting31, _tables$sorting32, _tables$filter13, _staticFilter$data14, _state$misc35;
             dispatch({
               type: _layoutReducer.actionTypes.SET_LOADING,
               payload: true
@@ -2393,7 +2571,7 @@ function GenricLayOut(_ref) {
               columnFilterStatus: tables === null || tables === void 0 ? void 0 : tables.filter
             }), (staticFilter === null || staticFilter === void 0 ? void 0 : staticFilter.visible) && ((_staticFilter$data14 = staticFilter.data) === null || _staticFilter$data14 === void 0 || (_staticFilter$data14 = _staticFilter$data14.find(item => item.selected)) === null || _staticFilter$data14 === void 0 ? void 0 : _staticFilter$data14.value) && {
               staticFilter: staticFilter.data.find(item => item.selected).value
-            }), (_state$misc31 = state === null || state === void 0 ? void 0 : state.misc) !== null && _state$misc31 !== void 0 ? _state$misc31 : {}));
+            }), (_state$misc35 = state === null || state === void 0 ? void 0 : state.misc) !== null && _state$misc35 !== void 0 ? _state$misc35 : {}));
             if (error) {
               showErrorNotification(error);
               dispatch({
@@ -2499,7 +2677,11 @@ function GenricLayOut(_ref) {
     destroyOnClose: true,
     zIndex: 1000
   }, /*#__PURE__*/_react.default.createElement(_DetailDataLayout.default, _extends({}, (_nestedDrawer$data$ca = nestedDrawer === null || nestedDrawer === void 0 || (_nestedDrawer$data2 = nestedDrawer.data) === null || _nestedDrawer$data2 === void 0 ? void 0 : _nestedDrawer$data2.cancelOrder) !== null && _nestedDrawer$data$ca !== void 0 ? _nestedDrawer$data$ca : {}, {
-    handleDrawerFormOnFinish: drawerFormOnFinish
+    handleDrawerFormOnFinish: drawerFormOnFinish,
+    generateS3Url: generateS3Url,
+    downloadFileOnS3: downloadFileOnS3,
+    uploadOnS3: uploadOnS3,
+    handleCollapsibleKeyData: handleCollapsibleKeyData
   }))), (customDrawer === null || customDrawer === void 0 ? void 0 : customDrawer.visible) && /*#__PURE__*/_react.default.createElement(_CustomDrawer.default, {
     className: "oaDrawer",
     title: customDrawer === null || customDrawer === void 0 || (_customDrawer$data = customDrawer.data) === null || _customDrawer$data === void 0 ? void 0 : _customDrawer$data.title,
@@ -2510,7 +2692,12 @@ function GenricLayOut(_ref) {
     destroyOnClose: true,
     zIndex: 1000
   }, /*#__PURE__*/_react.default.createElement(_DetailDataLayout.default, _extends({}, (_customDrawer$data2 = customDrawer === null || customDrawer === void 0 ? void 0 : customDrawer.data) !== null && _customDrawer$data2 !== void 0 ? _customDrawer$data2 : {}, {
-    handleDrawerFormOnFinish: filterFormOnFinish
+    handleDrawerFormOnFinish: filterFormOnFinish,
+    generateS3Url: generateS3Url,
+    downloadFileOnS3: downloadFileOnS3,
+    uploadOnS3: uploadOnS3,
+    handleCollapsibleKeyData: handleCollapsibleKeyData,
+    handleDownloadTemplate: handleDownloadTemplate
   }))), (contentPanel === null || contentPanel === void 0 ? void 0 : contentPanel.visible) && Array.isArray(contentPanel === null || contentPanel === void 0 ? void 0 : contentPanel.dataSource) && /*#__PURE__*/_react.default.createElement(_antd.Skeleton, {
     loading: state === null || state === void 0 ? void 0 : state.isLoading,
     active: true,

package/build/layout/GenricLayOut/styles.js

@@ -16,7 +16,7 @@ function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(
 const DrawerWithOutFooter = exports.DrawerWithOutFooter = (0, _styledComponents.createGlobalStyle)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.hubAutomationContainer .fullPageLayout {padding: 0 !important; background: #fff !important;}\n.hubAutomationContainer .fullPageLayout  .oaRightLayouts{\n    max-width: 1154px;\n    margin: 24px auto;\n    padding: 0 16px;\n    box-shadow: none;}\n.oaDrawer div + div.ant-drawer-body{padding-bottom:100px !important;}\n\n.ant-checkbox-indeterminate .ant-checkbox-inner:after {\n    background-color: #014fc5;\n}\n\n.ant-form-item .ant-form-item-label >label.ant-form-item-required::before {display:none;}\n.ant-form-item .ant-form-item-label >label.ant-form-item-required::after{ content: \"*\"; color: #DE350B; visibility: visible !important;}\n\n\n.cstUplaodWithFullWidth{margin-bottom:24px;}\n.cstUplaodWithFullWidth:last-child{margin-bottom:0;}\n.cstUplaodWithFullWidth .uploadDiv{width:100%;}\n.cstUplaodWithFullWidth .uploadDiv .ant-upload-list-item-container, .cstUplaodWithFullWidth .uploadDiv .ant-upload-wrapper .ant-upload-list-picture-card .ant-upload-select, .cstUplaodWithFullWidth .uploadDiv .ant-upload-wrapper.ant-upload-picture-card-wrapper .ant-upload-list.ant-upload-list-picture-card .ant-upload-list-item-container {\n     width: 100%; \n    height: 120px;\n}\n\n\n\n\n.oaDrawer .ant-form-item .ant-form-item-explain-error {\n    color: #DE350B;\n    font-size: 12px;\n    margin: 4px 0 0 0;\n}\n.bottomSelectedSecion{background: #F6F6F6; padding: 16px 36px; position: fixed; bottom: 0; left: 0; right: 0;\nbox-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.14);\n    display: flex; z-index: 2;\n    align-items: center;\n    justify-content: end;\n    gap: 24px;}\n\n\n\n.listOfItems{ border-radius: 12px;\n    border: 1px solid #E0E0E0;\n    padding: 24px;\n    margin: 24px 0 0 0;}\n    modalSubheading{\n    padding: 24px;\n    margin: 24px 0 0 0;}\n\n.listOfItemsWithoutBorder{\n    padding: 24px 0;\n    margin: 24px 0 0 0;}\n\n    modalSubheading{\n    padding: 24px;\n    margin: 24px 0 0 0;}\n\n\n\n\n.modalIconAndTextBox{display:flex; flex-direction:row; align-items: center;  margin: 0 0 16px 0; gap:4px;}\n\n/* Select List Item Styles */\n.select-list-container {\n  padding: 0;\n  margin: 16px 0 0 0;\n}\n\n.select-list-item {\n  display: flex;\n  align-items: center;\n  padding: 16px 0;\n  cursor: pointer;\n  transition: background-color 0.2s ease;\n  border-bottom: 1px solid #f0f0f0;\n  position: relative;\n}\n\n.select-list-item:hover {\n  background-color: #f8f9fa;\n}\n\n.select-list-item:last-child {\n  border-bottom: none;\n}\n\n.item-avatar {\n  width: 48px;\n  height: 48px;\n  border-radius: 50%;\n  background-color: #f0f0f0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  margin-right: 12px;\n  font-size: 28px;\n  font-weight: 500;\n  color: #333;\n  flex-shrink: 0;\n}\n\n/* Different avatar colors for different items */\n.select-list-item:nth-child(1) .item-avatar {\n  background-color: #717171;\n  color: #fff;\n}\n\n.select-list-item:nth-child(2) .item-avatar {\n  background-color: #014fc5;\n  color: #fff;\n}\n\n.item-content {\n  flex: 1;\n  min-width: 0;\n}\n\n.item-arrow {\n  flex-shrink: 0;\n  margin-left: 8px;\n  color: #014fc5;\n}\n"])));
 const FormWidgetStyle = exports.FormWidgetStyle = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  .formBottomAction {\n    position: absolute;\n    bottom: 0px;\n    background-color: rgb(249, 249, 249);\n    box-shadow: rgba(0, 0, 0, 0.1) 0px -2px 8px;\n    padding: 16px;\n    display: flex;\n    justify-content: flex-end;\n    gap: 12px;\n    z-index: 10;\n    left: 0;\n    right: 0;\n  }\n\n  .formBottomAction .ant-form-item {\n    margin-bottom: 0px;\n  }\n\n  .searchErrorMsg {\n    font-size: 12px;\n  }\n  .searchErrorMsg {\n    font-size: 12px;\n  }\n"])));
 const TableDataStyle = exports.TableDataStyle = _styledComponents.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  .tableContainerList th,\n  button {\n    white-space: nowrap;\n  }\n  .tableContainerList th,\n  button {\n    white-space: nowrap;\n  }\n"])));
-const OapageWithDataStyle = exports.OapageWithDataStyle = _styledComponents.default.aside(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  .oaTopHeaderAndBtnSec {\n    display: flex;\n    flex-direction: row;\n    justify-content: space-between;\n\n    .headerContent {\n      display: flex;\n      align-items: flex-start; // Changed from 'center' to 'flex-start'\n      justify-content: space-between;\n      width: 100%;\n\n      .headerLeft {\n        flex: 1;\n      }\n\n      .headerRight {\n        display: flex;\n        align-items: flex-start; // Changed from 'center' to 'flex-start'\n        justify-content: flex-end;\n      }\n    }\n  }\n\n  .fullPageLayout {\n    display: flex;\n    padding: 8px;\n    background: #f6f6f6;\n  }\n  .ant-pagination {\n    padding: 0 16px;\n    justify-content: end;\n  }\n  .layoutHeadingPage {\n    display: flex;\n    gap: 8px;\n    margin: 0 0 32px 0;\n    flex-direction: column;\n    justify-content: flex-start;\n  }\n\n  .topHadingWithIcon span {\n    display: flex;\n    align-items: center;\n    justify-content: flex-start;\n    gap: 8px;\n  }\n\n  .subHadingText {\n    margin: 0 0 0 36px;\n  }\n\n  .subHading1Text {\n    margin: 0 0 ", " 40px;\n  }\n\n  .marginNone {\n    margin: 0 !important;\n  }\n\n  .subHadingText > span {\n    display: flex;\n    flex-direction: row;\n    gap: 4px;\n    align-items: center;\n  }\n\n  .oaRightLayouts {\n    width: 100%;\n    min-height: calc(100vh - 16px);\n    padding: 76px 48px;\n    overflow-y: auto;\n    border-radius: 16px;\n    background: #fff;\n    box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.14);\n  }\n\n  .oaheaderSearchAndFilter {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    margin: 0 0 16px 0;\n    gap: 16px;\n  }\n\n  .oaRightLayouts .iconAndTextSecBox {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    gap: 8px;\n  }\n  .inLine {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    gap: 4px;\n  }\n\n  .customeSelectDropdown {\n    margin: 4px 0 0 8px;\n  }\n\n  .cardData {\n    padding: 28px 0 48px 0;\n  }\n\n  .ant-carousel .slick-dots {\n    position: static;\n    margin: 20px auto 12px 0;\n  }\n  .ant-carousel .slick-dots li {\n    width: 8px;\n    height: 8px;\n  }\n  .ant-carousel .slick-dots li button {\n    width: 8px;\n    height: 8px;\n    background: #cacaca;\n    border-radius: 50%;\n    opacity: 0.5;\n  }\n  .ant-carousel .slick-dots li.slick-active {\n    width: 8px;\n    height: 8px;\n  }\n  .ant-carousel .slick-dots li.slick-active button {\n    width: 8px;\n    height: 8px;\n    opacity: 1;\n  }\n  .ant-carousel .slick-dots li::after {\n    width: 8px;\n    height: 8px;\n    border-radius: 50%;\n    opacity: 1;\n    background: #717171;\n  }\n\n  .oaTabs .ant-tabs-nav {\n    border-top: 1px solid #e0e0e0;\n    border-left: 1px solid #e0e0e0;\n    border-right: 1px solid #e0e0e0;\n    padding: 12px 22px 0 22px;\n    margin: 0 0 8px 0;\n    background: #fff;\n    border-radius: 4px 4px 0 0;\n  }\n  .ant-card-body {\n    padding: 24px 16px !important;\n    border-radius: 16px;\n    background: #f6f6f6;\n  }\n  .cardContainer {\n    display: flex;\n    gap: 24px;\n  }\n  .selectAndSearch .noClear {\n    border-radius: 0 4px 4px 0;\n    width: 320px;\n  }\n\n  .searchErrorMsg {\n    font-size: 12px;\n    margin: 4px 0px 0px;\n    color: #de350b;\n  }\n  .searchOnly {\n    margin: 0px 0px 16px;\n    position: relative;\n  }\n  .searchOnly .ant-input-affix-wrapper {\n    border-radius: 4px;\n    max-width: 420px;\n    padding-left: 44px;\n  }\n  .searchOnly .cstSearchIcon {\n    position: absolute;\n    left: 16px;\n    top: 14px;\n    z-index: 2;\n  }\n\n  .selectAndSearch .ant-input-affix-wrapper {\n    border-radius: 0 4px 4px 0;\n    width: 320px;\n  }\n\n  .selectAndSearch {\n    flex-shrink: 0;\n  }\n\n  .customeSelectDropdown .ant-select-selector {\n    border: none;\n    padding: 0;\n    max-width: 83vw;\n  }\n  .customeSelectDropdown .ant-select-selection-item > span {\n    font-size: 24px;\n    font-weight: 500;\n    line-height: 32px;\n  }\n\n  .customeSelectDropdown .ant-select {\n    margin: 0 0 0 32px;\n  }\n\n  .customeSelectDropdown .ant-select .ant-select-arrow {\n    color: #014fc5;\n    inset-inline-end: -6px;\n  }\n\n  .customeSelectDropdown .ant-select-selector {\n    box-shadow: none !important;\n  }\n\n  .customeSelectDropdown .ant-select-selection-item {\n    display: inline-block;\n    overflow: hidden;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    vertical-align: bottom;\n  }\n\n  .oaheaderButtons {\n    display: flex;\n    gap: 24px;\n    align-items: center;\n    position: relative;\n    flex-grow: 1;\n    justify-content: space-between;\n  }\n\n  .oaheaderButtons.single-child {\n    justify-content: flex-end;\n  }\n\n  .oaheaderButtonsRight {\n    display: flex;\n    flex-direction: row;\n    gap: 16px;\n  }\n\n  .oaheaderButtons .notifyDot {\n    width: 12px;\n    height: 12px;\n    background: #de350b;\n    position: absolute;\n    top: -4px;\n    right: -4px;\n    border-radius: 50%;\n  }\n\n  @media only screen and (max-width: 600px) {\n    .selectAndSearch .ant-input-affix-wrapper {\n      width: calc(100% - 84px);\n    }\n    .oaheaderSearchAndFilter .dropDownSearchContainer {\n      width: 100%;\n    }\n\n    .oaheaderSearchAndFilter {\n      align-items: flex-end;\n      flex-direction: column;\n      gap: 16px;\n    }\n\n    .inLine {\n      flex-direction: column;\n      gap: 0;\n      align-items: flex-start;\n    }\n\n    .subHadingText > span {\n      flex-direction: column;\n      align-items: flex-start;\n    }\n\n    .customeSelectDropdown {\n      margin: 4px 0 0 0;\n    }\n\n    .customeSelectDropdown .ant-select {\n      margin: 0 0 0 0;\n    }\n\n    .fullPageLayout {\n      flex-direction: column;\n      padding: 0;\n    }\n    .oaRightLayouts {\n      padding: 16px;\n      border-radius: 0;\n      background: #fff;\n      box-shadow: none;\n      height: auto;\n      background: #f6f6f6;\n    }\n    .oaTabs .ant-tabs-nav {\n      margin: 0 0 28px 0;\n      padding: 12px 0 0 0;\n    }\n    .layoutHeadingPage {\n      margin: 0 0 16px 0;\n      background: #fff;\n      padding: 16px;\n      border-radius: 8px;\n      width: 100%;\n    }\n    .layoutHeadingAndSearch {\n      background: #fff;\n      padding: 20px 16px;\n      margin: 0;\n      width: 100%;\n      border-radius: 8px;\n    }\n\n    /* Hide profile section on mobile when sidebar has profile icon */\n    .hideProfileOnMobile {\n      display: none !important;\n    }\n  }\n"])), _ref => {
+const OapageWithDataStyle = exports.OapageWithDataStyle = _styledComponents.default.aside(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  .oaTopHeaderAndBtnSec {\n    display: flex;\n    flex-direction: row;\n    justify-content: space-between;\n\n    .headerContent {\n      display: flex;\n      align-items: flex-start; // Changed from 'center' to 'flex-start'\n      justify-content: space-between;\n      width: 100%;\n\n      .headerLeft {\n        flex: 1;\n      }\n\n      .headerRight {\n        display: flex;\n        align-items: flex-start; // Changed from 'center' to 'flex-start'\n        justify-content: flex-end;\n      }\n    }\n  }\n\n  .fullPageLayout {\n    display: flex;\n    padding: 8px;\n    background: #f6f6f6;\n  }\n  .ant-pagination {\n    padding: 0 16px;\n    justify-content: end;\n  }\n  .layoutHeadingPage {\n    display: flex;\n    gap: 8px;\n    margin: 0 0 32px 0;\n    flex-direction: column;\n    justify-content: flex-start;\n  }\n\n  .topHadingWithIcon span {\n    display: flex;\n    align-items: center;\n    justify-content: flex-start;\n    gap: 8px;\n  }\n\n  .subHadingText {\n    margin: 0 0 0 36px;\n  }\n\n  .subHading1Text {\n    margin: 0 0 ", " 40px;\n  }\n\n  .marginNone {\n    margin: 0 !important;\n  }\n\n  .subHadingText > span {\n    display: flex;\n    flex-direction: row;\n    gap: 4px;\n    align-items: center;\n  }\n\n  .oaRightLayouts {\n    width: 100%;\n    min-height: calc(100vh - 16px);\n    padding: 76px 48px;\n    overflow-y: auto;\n    border-radius: 16px;\n    background: #fff;\n    box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.14);\n  }\n\n  .oaheaderSearchAndFilter {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    margin: 0 0 16px 0;\n    gap: 16px;\n  }\n\n  .oaRightLayouts .iconAndTextSecBox {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    gap: 8px;\n  }\n  .inLine {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    gap: 4px;\n  }\n\n  .customeSelectDropdown {\n    margin: 4px 0 0 8px;\n  }\n\n  .cardData {\n    padding: 28px 0 48px 0;\n  }\n\n  .ant-carousel .slick-dots {\n    position: static;\n    margin: 20px auto 12px 0;\n  }\n  .ant-carousel .slick-dots li {\n    width: 8px;\n    height: 8px;\n  }\n  .ant-carousel .slick-dots li button {\n    width: 8px;\n    height: 8px;\n    background: #cacaca;\n    border-radius: 50%;\n    opacity: 0.5;\n  }\n  .ant-carousel .slick-dots li.slick-active {\n    width: 8px;\n    height: 8px;\n  }\n  .ant-carousel .slick-dots li.slick-active button {\n    width: 8px;\n    height: 8px;\n    opacity: 1;\n  }\n  .ant-carousel .slick-dots li::after {\n    width: 8px;\n    height: 8px;\n    border-radius: 50%;\n    opacity: 1;\n    background: #717171;\n  }\n\n  .oaTabs .ant-tabs-nav {\n    border-top: 1px solid #e0e0e0;\n    border-left: 1px solid #e0e0e0;\n    border-right: 1px solid #e0e0e0;\n    padding: 12px 22px 0 22px;\n    margin: 0 0 8px 0;\n    background: #fff;\n    border-radius: 4px 4px 0 0;\n  }\n  .ant-card-body {\n    padding: 24px 16px !important;\n    border-radius: 16px;\n    background: #f6f6f6;\n  }\n  .cardContainer {\n    display: flex;\n    gap: 24px;\n  }\n  .selectAndSearch .noClear {\n    border-radius: 0 4px 4px 0;\n    width: 320px;\n  }\n\n  .searchErrorMsg {\n    font-size: 12px;\n    margin: 4px 0px 0px;\n    color: #de350b;\n  }\n  .searchOnly {\n    margin: 0px 0px 16px;\n    position: relative;\n  }\n  .searchOnly .ant-input-affix-wrapper {\n    border-radius: 4px;\n    max-width: 420px;\n    padding-left: 44px;\n  }\n  .searchOnly .cstSearchIcon {\n    position: absolute;\n    left: 16px;\n    top: 14px;\n    z-index: 2;\n  }\n\n  .selectAndSearch .ant-input-affix-wrapper {\n    border-radius: 0 4px 4px 0;\n    width: 320px;\n  }\n\n  .selectAndSearch {\n    flex-shrink: 0;\n  }\n\n  .customeSelectDropdown .ant-select-selector {\n    border: none;\n    padding: 0;\n    max-width: 83vw;\n  }\n  .customeSelectDropdown .ant-select-selection-item > span {\n    font-size: 24px;\n    font-weight: 500;\n    line-height: 32px;\n  }\n\n  .customeSelectDropdown .ant-select {\n    margin: 0 0 0 32px;\n  }\n\n  .customeSelectDropdown .ant-select .ant-select-arrow {\n    color: #014fc5;\n    inset-inline-end: -6px;\n  }\n\n  .customeSelectDropdown .ant-select-selector {\n    box-shadow: none !important;\n  }\n\n  .customeSelectDropdown .ant-select-selection-item {\n    display: inline-block;\n    overflow: hidden;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    vertical-align: bottom;\n  }\n\n  .oaheaderButtons {\n    display: flex;\n    gap: 16px;\n    align-items: center;\n    position: relative;\n    flex-grow: 1;\n    justify-content: space-between;\n  }\n\n  .oaheaderButtons.single-child {\n    justify-content: flex-end;\n  }\n\n  .oaheaderButtonsRight {\n    display: flex;\n    flex-direction: row;\n    gap: 12px;\n    margin-left: auto;\n    padding-left: 24px;\n  }\n\n  .oaheaderButtons .notifyDot {\n    width: 12px;\n    height: 12px;\n    background: #de350b;\n    position: absolute;\n    top: -4px;\n    right: -4px;\n    border-radius: 50%;\n  }\n\n  @media only screen and (max-width: 600px) {\n    .selectAndSearch .ant-input-affix-wrapper {\n      width: calc(100% - 84px);\n    }\n    .oaheaderSearchAndFilter .dropDownSearchContainer {\n      width: 100%;\n    }\n\n    .oaheaderSearchAndFilter {\n      align-items: flex-end;\n      flex-direction: column;\n      gap: 16px;\n    }\n\n    .inLine {\n      flex-direction: column;\n      gap: 0;\n      align-items: flex-start;\n    }\n\n    .subHadingText > span {\n      flex-direction: column;\n      align-items: flex-start;\n    }\n\n    .customeSelectDropdown {\n      margin: 4px 0 0 0;\n    }\n\n    .customeSelectDropdown .ant-select {\n      margin: 0 0 0 0;\n    }\n\n    .fullPageLayout {\n      flex-direction: column;\n      padding: 0;\n    }\n    .oaRightLayouts {\n      padding: 16px;\n      border-radius: 0;\n      background: #fff;\n      box-shadow: none;\n      height: auto;\n      background: #f6f6f6;\n    }\n    .oaTabs .ant-tabs-nav {\n      margin: 0 0 28px 0;\n      padding: 12px 0 0 0;\n    }\n    .layoutHeadingPage {\n      margin: 0 0 16px 0;\n      background: #fff;\n      padding: 16px;\n      border-radius: 8px;\n      width: 100%;\n    }\n    .layoutHeadingAndSearch {\n      background: #fff;\n      padding: 20px 16px;\n      margin: 0;\n      width: 100%;\n      border-radius: 8px;\n    }\n\n    /* Hide profile section on mobile when sidebar has profile icon */\n    .hideProfileOnMobile {\n      display: none !important;\n    }\n  }\n"])), _ref => {
   let {
     marginBottom
   } = _ref;

package/build/widgets/oa-form-widget/FormWidget.js

@@ -56,7 +56,8 @@ function FormWidget(props) {
     downloadFileOnS3,
     generateS3Url,
     uploadOnS3,
-    handleCollapsibleKeyData
+    handleCollapsibleKeyData,
+    handleDownloadTemplate
   } = props;
   const {
     cancel,
@@ -420,7 +421,9 @@ function FormWidget(props) {
           label: item === null || item === void 0 ? void 0 : item.label,
           disabled: (_item$disabled5 = item === null || item === void 0 ? void 0 : item.disabled) !== null && _item$disabled5 !== void 0 ? _item$disabled5 : false,
           onClick: () => {
-            if (item !== null && item !== void 0 && item.onClick) {
+            if ((item === null || item === void 0 ? void 0 : item.action) === "DOWNLOAD_TEMPLATE" && handleDownloadTemplate) {
+              handleDownloadTemplate(_objectSpread({}, (item === null || item === void 0 ? void 0 : item.params) || {}));
+            } else if (item !== null && item !== void 0 && item.onClick) {
               item.onClick(item === null || item === void 0 ? void 0 : item.action, item === null || item === void 0 ? void 0 : item.key);
             }
           }

package/build/widgets/oa-widget-user-management/UserManagementWidget.js

@@ -171,11 +171,7 @@ function _default(_ref) {
           }
         }
       } else if (addingUser) {
-        // Add new user
         if (addUserClick) {
-          console.log("userData", userData);
-          console.log("misc", misc);
-          console.log("branchId", branchId);
           const {
             error,
             data

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "oa-componentbook",
-  "version": "0.18.382",
+  "version": "0.18.383",
   "private": false,
   "description": "Reusable components",
   "main": "build/index.js",