@3sc/common-component 0.0.1 → 0.0.3

package/dist/App.js

@@ -4,14 +4,16 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
 var _modules = require("./modules");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function App() {
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/_react.default.createElement("div", {
     className: "App"
-  }, "hello", /*#__PURE__*/React.createElement(_modules.Notification, {
-    tenantId: "e9cbadf0-a2c3-4f0b-b358-e9368ccd093c",
-    buId: "1b97f147-5c15-4bd4-9d5d-8a63129caf3d",
-    snopId: "dee67439-9306-408a-b79c-99c4265dc5a3"
+  }, "hello", /*#__PURE__*/_react.default.createElement(_modules.Notification, {
+    tenantId: "9a33965c-162a-4089-8cb1-5e631e3cdd8a",
+    buId: "d628f9a3-1968-4102-b578-727616b382f3",
+    snopId: "13a53238-f493-41a5-9d17-7b95aeed7964"
   }));
 }
 var _default = exports.default = App;

package/dist/components/alert/alert-body.js

@@ -0,0 +1,122 @@
+"use strict";
+
+require("core-js/modules/es.weak-map.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+require("core-js/modules/web.dom-collections.iterator.js");
+var _react = _interopRequireWildcard(require("react"));
+var _material = require("@mui/material");
+var _ErrorMsg = _interopRequireDefault(require("../../utils/ErrorMsg"));
+var _inputField = _interopRequireDefault(require("../input-field"));
+var _Search = _interopRequireDefault(require("@mui/icons-material/Search"));
+var _Refresh = _interopRequireDefault(require("@mui/icons-material/Refresh"));
+var _selectField = _interopRequireDefault(require("../select-field"));
+var _Constant = require("../../utils/Constant");
+var _card = _interopRequireDefault(require("../notification-card/card"));
+var _commonFun = require("../../helper/common-fun");
+var _myPagination = _interopRequireDefault(require("../my-pagination"));
+var _logs = _interopRequireDefault(require("../my-pagination/logs"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const AlertBody = _ref => {
+  let {
+    loading,
+    isEmpty,
+    data,
+    handleShowDetails: _handleShowDetails,
+    handleRead: _handleRead,
+    handleRefresh
+  } = _ref;
+  const [inputValue, setInputValue] = (0, _react.useState)("");
+  const [page, setPage] = (0, _react.useState)(1);
+  const [rowPerPage, setRowPerPage] = (0, _react.useState)(10);
+  const [total, setTotal] = (0, _react.useState)(0);
+  const [newData, setNewData] = (0, _react.useState)([]);
+  (0, _react.useEffect)(() => {
+    setTotal(data.length);
+  }, [data]);
+  const handleSelectChange = e => {
+    const value = e.target.value;
+    console.log(value);
+  };
+  const handleChangePage = page => {
+    console.log(page);
+  };
+  const handleSearch = e => {
+    const value = e.target.value;
+    setInputValue(value);
+  };
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_material.DialogContent, {
+    dividers: true,
+    sx: {
+      pt: "0 !important"
+    }
+  }, /*#__PURE__*/_react.default.createElement(_material.Box, {
+    sx: loading || isEmpty ? {
+      display: "flex",
+      justifyContent: "center",
+      alignItems: "center",
+      minHeight: 320
+    } : {}
+  }, loading ? /*#__PURE__*/_react.default.createElement(_material.CircularProgress, null) : isEmpty ? /*#__PURE__*/_react.default.createElement(_material.Typography, {
+    className: "no-record"
+  }, _ErrorMsg.default.NRF) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_material.Box, {
+    className: "sticky-input-select"
+  }, /*#__PURE__*/_react.default.createElement(_material.Box, {
+    sx: {
+      display: "flex",
+      gap: 1
+    }
+  }, /*#__PURE__*/_react.default.createElement(_inputField.default, {
+    value: inputValue,
+    onChange: handleSearch,
+    label: "Search",
+    focused: true,
+    adornmentIcon: {
+      startAdornment: /*#__PURE__*/_react.default.createElement(_material.InputAdornment, {
+        position: "start"
+      }, /*#__PURE__*/_react.default.createElement(_Search.default, null))
+    }
+  }), /*#__PURE__*/_react.default.createElement(_selectField.default, {
+    value: rowPerPage,
+    option: _Constant.optionRow,
+    handleSelectChange: handleSelectChange
+  }), /*#__PURE__*/_react.default.createElement(_material.IconButton, {
+    color: "primary",
+    onClick: handleRefresh
+  }, /*#__PURE__*/_react.default.createElement(_Refresh.default, {
+    fontSize: "medium"
+  }))), /*#__PURE__*/_react.default.createElement(_logs.default, {
+    start: page,
+    end: rowPerPage,
+    total: total
+  })), data.map((item, index) => {
+    return /*#__PURE__*/_react.default.createElement(_card.default, {
+      key: index,
+      isCheckBox: true,
+      title: item.message,
+      subTitle: (0, _commonFun.fullFormatDate)(item.createdAt),
+      isRead: item.isRead,
+      handleShowDetails: () => _handleShowDetails(item.id),
+      handleRead: () => _handleRead(item.id),
+      subType: item.sub_type,
+      isSubType: true
+    });
+  })))), !(loading || isEmpty) && /*#__PURE__*/_react.default.createElement(_material.DialogActions, {
+    sx: {
+      justifyContent: "space-between",
+      gap: 1
+    },
+    className: "action-show-all-dialog"
+  }, /*#__PURE__*/_react.default.createElement(_myPagination.default, {
+    page: page,
+    rowPerPage: rowPerPage,
+    total: total,
+    handleChangePage: handleChangePage,
+    isMarkAllRead: true
+  })));
+};
+var _default = exports.default = AlertBody;

package/dist/components/alert/details-body.js

@@ -0,0 +1,126 @@
+"use strict";
+
+require("core-js/modules/es.weak-map.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+require("core-js/modules/web.dom-collections.iterator.js");
+var _react = _interopRequireWildcard(require("react"));
+var _material = require("@mui/material");
+var _ErrorMsg = _interopRequireDefault(require("../../utils/ErrorMsg"));
+var _inputField = _interopRequireDefault(require("../input-field"));
+var _Search = _interopRequireDefault(require("@mui/icons-material/Search"));
+var _selectField = _interopRequireDefault(require("../select-field"));
+var _Constant = require("../../utils/Constant");
+var _myPagination = _interopRequireDefault(require("../my-pagination"));
+var _tableDetail = _interopRequireDefault(require("./table-detail"));
+var _commonFun = require("../../helper/common-fun");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const DetailsBody = _ref => {
+  let {
+    loading,
+    isEmpty,
+    data
+  } = _ref;
+  const [inputValue, setInputValue] = (0, _react.useState)("");
+  const [page, setPage] = (0, _react.useState)(1);
+  const [rowPerPage, setRowPerPage] = (0, _react.useState)(10);
+  const [total, setTotal] = (0, _react.useState)(0);
+  const [newData, setNewData] = (0, _react.useState)([]);
+  const [sortDir, setSortDir] = (0, _react.useState)(false);
+  const [sortKey, setSortKey] = (0, _react.useState)("");
+  (0, _react.useEffect)(() => {
+    if (inputValue || sortKey) {
+      const newData = (0, _commonFun.searchByKeyArr)(data, _Constant.detailsSearchKey, inputValue);
+      if (sortKey) {
+        const sortedData = (0, _commonFun.sortByKeyArr)(newData, sortKey, sortDir ? "asc" : "desc");
+        setNewData((0, _commonFun.dataSlice)(sortedData, page, rowPerPage));
+        setTotal(sortedData.length);
+        return;
+      }
+      setNewData((0, _commonFun.dataSlice)(newData, page, rowPerPage));
+      setTotal(newData.length);
+      return;
+    }
+    setNewData((0, _commonFun.dataSlice)(data, page, rowPerPage));
+    setTotal(data.length);
+  }, [inputValue, data, page, rowPerPage, sortDir, sortKey]);
+  const handleSelectChange = e => {
+    const value = e.target.value;
+    setPage(1);
+    setRowPerPage(Number(value));
+  };
+  const handleChangePage = page => {
+    setPage(page);
+  };
+  const handleSearch = e => {
+    const value = e.target.value;
+    if (value) setPage(1);
+    setInputValue(value);
+  };
+
+  // sort function
+  const handleSort = key => {
+    setSortDir(!sortDir);
+    setSortKey(key);
+  };
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_material.DialogContent, {
+    dividers: true,
+    sx: {
+      pt: "0 !important"
+    }
+  }, /*#__PURE__*/_react.default.createElement(_material.Box, {
+    sx: loading || isEmpty ? {
+      display: "flex",
+      justifyContent: "center",
+      alignItems: "center",
+      minHeight: 320
+    } : {}
+  }, loading ? /*#__PURE__*/_react.default.createElement(_material.CircularProgress, null) : isEmpty ? /*#__PURE__*/_react.default.createElement(_material.Typography, {
+    className: "no-record"
+  }, _ErrorMsg.default.NRF) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_material.Box, {
+    className: "sticky-input-select"
+  }, /*#__PURE__*/_react.default.createElement(_material.Box, {
+    sx: {
+      display: "flex",
+      gap: 1
+    }
+  }, /*#__PURE__*/_react.default.createElement(_inputField.default, {
+    value: inputValue,
+    onChange: handleSearch,
+    label: "Search",
+    focused: true,
+    adornmentIcon: {
+      startAdornment: /*#__PURE__*/_react.default.createElement(_material.InputAdornment, {
+        position: "start"
+      }, /*#__PURE__*/_react.default.createElement(_Search.default, null))
+    }
+  }), /*#__PURE__*/_react.default.createElement(_selectField.default, {
+    value: rowPerPage,
+    option: _Constant.optionRow,
+    handleSelectChange: handleSelectChange
+  }))), newData.length === 0 ? /*#__PURE__*/_react.default.createElement(_material.Typography, {
+    className: "no-record"
+  }, _ErrorMsg.default.NRF) : /*#__PURE__*/_react.default.createElement(_tableDetail.default, {
+    data: newData,
+    handleSort: handleSort,
+    sortDir: sortDir,
+    sortKey: sortKey
+  })))), !(loading || isEmpty) && /*#__PURE__*/_react.default.createElement(_material.DialogActions, {
+    sx: {
+      justifyContent: "space-between",
+      gap: 1
+    },
+    className: "action-show-all-dialog"
+  }, /*#__PURE__*/_react.default.createElement(_myPagination.default, {
+    page: page,
+    rowPerPage: rowPerPage,
+    total: total,
+    handleChangePage: handleChangePage,
+    isLogo: true
+  })));
+};
+var _default = exports.default = DetailsBody;

package/dist/components/alert/index.js

@@ -1,20 +1,36 @@
 "use strict";
 
+require("core-js/modules/es.symbol.description.js");
+require("core-js/modules/es.weak-map.js");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
 require("core-js/modules/web.dom-collections.iterator.js");
 require("core-js/modules/es.promise.js");
+var _react = _interopRequireWildcard(require("react"));
 var _material = require("@mui/material");
 var _bell = _interopRequireDefault(require("../bell"));
 var _myDialog = _interopRequireDefault(require("../my-dialog"));
-var _react = require("react");
 require("./style.scss");
 var _myContext = require("../../config/my-context");
 var _notification = require("../../services/notification");
 var _StatusCode = _interopRequireDefault(require("../../utils/StatusCode"));
+var _notificationCard = _interopRequireDefault(require("../notification-card"));
+var _commonFun = require("../../helper/common-fun");
+var _ActionType = _interopRequireDefault(require("../../utils/ActionType"));
+var _ErrorMsg = _interopRequireDefault(require("../../utils/ErrorMsg"));
+var _Constant = require("../../utils/Constant");
+var _alertBody = _interopRequireDefault(require("./alert-body"));
+var _detailsBody = _interopRequireDefault(require("./details-body"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 const Alert = _ref => {
   let {
     tenantId,
@@ -28,15 +44,23 @@ const Alert = _ref => {
     isMarkAllAsRead
   } = (0, _react.useContext)(_myContext.TasksContext);
   const [open, setOpen] = (0, _react.useState)(false);
+  const [showAllAlert, setShowAllAlert] = (0, _react.useState)(false);
+  const [showDetails, setShowDetails] = (0, _react.useState)(false);
+  const [detailsData, setDetailsData] = (0, _react.useState)({});
+  const isEmpty = data.length === 0;
   const fetchNotification = (0, _react.useCallback)(async () => {
     dispatch({
-      type: "loading",
+      type: _ActionType.default.LOADING,
       loading: true
     });
     dispatch({
-      type: "success",
+      type: _ActionType.default.SUCCESS,
       data: []
     });
+    dispatch({
+      type: _ActionType.default.MARK_ALL_AS_READ,
+      isMarkAllAsRead: 0
+    });
     try {
       const res = await (0, _notification.getNotification)({
         tenantId,
@@ -44,20 +68,25 @@ const Alert = _ref => {
         snopId
       });
       if (res.status === _StatusCode.default.OK) {
-        var _res$data;
+        var _res$data, _res$data2;
         dispatch({
-          type: "success",
+          type: _ActionType.default.SUCCESS,
           data: ((_res$data = res.data) === null || _res$data === void 0 || (_res$data = _res$data.responseData) === null || _res$data === void 0 ? void 0 : _res$data.response) || []
         });
+        const isMarkAll = (0, _commonFun.detectMarkAllAsRead)(((_res$data2 = res.data) === null || _res$data2 === void 0 || (_res$data2 = _res$data2.responseData) === null || _res$data2 === void 0 ? void 0 : _res$data2.response) || []);
+        dispatch({
+          type: _ActionType.default.MARK_ALL_AS_READ,
+          isMarkAllAsRead: isMarkAll
+        });
       }
     } catch (err) {
       dispatch({
-        type: "error",
-        error: "Something went wrong!"
+        type: _ActionType.default.ERROR,
+        error: _ErrorMsg.default.SWR
       });
     } finally {
       dispatch({
-        type: "loading",
+        type: _ActionType.default.LOADING,
         loading: false
       });
     }
@@ -65,40 +94,160 @@ const Alert = _ref => {
   (0, _react.useEffect)(() => {
     fetchNotification();
   }, [fetchNotification]);
-  const handleOpen = () => {
-    setOpen(!open);
-  };
+  const handleOpen = () => setOpen(!open);
   const handleClose = () => setOpen(!open);
+  const handleShowAllAlert = () => setShowAllAlert(!showAllAlert);
+  const handleHideAllAlert = () => setShowAllAlert(!showAllAlert);
+  const handleOpenDetails = () => setShowDetails(!showDetails);
+  const handleHideDetails = () => setShowDetails(!showDetails);
   const handleRefresh = () => {
     fetchNotification();
   };
-  const handleShowAll = () => {};
-  const handleMarkAllAsRead = () => {};
-  console.log("loading", loading, data);
-  return /*#__PURE__*/React.createElement(_material.Box, null, /*#__PURE__*/React.createElement(_material.Box, {
+  const handleShowAll = () => {
+    handleShowAllAlert();
+  };
+  const handleShowDetails = id => {
+    const filterData = data.find(item => item.id === id);
+    setDetailsData(filterData);
+    handleOpenDetails();
+  };
+
+  // mark as read function
+  const handleRead = async id => {
+    if (!id) return;
+    dispatch({
+      type: _ActionType.default.LOADING,
+      loading: true
+    });
+    try {
+      const res = await (0, _notification.putNotification)([id]);
+      if (res.status === _StatusCode.default.OK) {
+        const newData = data.map(item => {
+          if (item.id === id) {
+            return _objectSpread(_objectSpread({}, item), {}, {
+              isRead: true
+            });
+          }
+          return item;
+        });
+        dispatch({
+          type: _ActionType.default.SUCCESS,
+          data: newData
+        });
+      }
+    } catch (e) {
+      dispatch({
+        type: _ActionType.default.ERROR,
+        error: _ErrorMsg.default.SWR
+      });
+    } finally {
+      dispatch({
+        type: _ActionType.default.LOADING,
+        loading: false
+      });
+    }
+  };
+
+  // mark all as read function
+  const handleMarkAllAsRead = async () => {
+    const payload = (0, _commonFun.createPayloadMarkAllAsRead)(data);
+    dispatch({
+      type: _ActionType.default.LOADING,
+      loading: true
+    });
+    try {
+      const res = await (0, _notification.putNotification)(payload);
+      if (res.status === _StatusCode.default.OK) {
+        const newData = data.map(item => {
+          return _objectSpread(_objectSpread({}, item), {}, {
+            isRead: true
+          });
+        });
+        dispatch({
+          type: _ActionType.default.SUCCESS,
+          data: newData
+        });
+        dispatch({
+          type: _ActionType.default.MARK_ALL_AS_READ,
+          isMarkAllAsRead: false
+        });
+      }
+    } catch (e) {
+      dispatch({
+        type: _ActionType.default.ERROR,
+        error: _ErrorMsg.default.SWR
+      });
+    } finally {
+      dispatch({
+        type: _ActionType.default.LOADING,
+        loading: false
+      });
+    }
+  };
+  console.log(_ActionType.default.LOADING, isMarkAllAsRead, loading, data);
+  return /*#__PURE__*/_react.default.createElement(_material.Box, null, /*#__PURE__*/_react.default.createElement(_material.Box, {
     sx: {
       display: "flex",
       justifyContent: "center"
     }
-  }, /*#__PURE__*/React.createElement(_bell.default, {
-    count: (data === null || data === void 0 ? void 0 : data.length) || 0,
+  }, /*#__PURE__*/_react.default.createElement(_bell.default, {
+    count: isMarkAllAsRead || 0,
     handleClick: handleOpen
-  })), /*#__PURE__*/React.createElement(_myDialog.default, {
+  })), /*#__PURE__*/_react.default.createElement(_myDialog.default, {
     title: "Alerts",
     open: open,
-    loading: loading || false,
-    isMarkAllAsRead: isMarkAllAsRead || false,
+    loading: loading,
+    isMarkAllAsRead: isMarkAllAsRead,
     onClose: handleClose,
     onRefresh: handleRefresh,
     handleShowAll: handleShowAll,
-    handleMarkAllAsRead: handleMarkAllAsRead
-  }, /*#__PURE__*/React.createElement(_material.Box, {
-    sx: {
+    handleMarkAllAsRead: handleMarkAllAsRead,
+    headerIconType: _Constant.HEADER_ICON_TYPE.REFRESH,
+    isDialogActionShow: true,
+    className: "alert-dialog-main"
+  }, /*#__PURE__*/_react.default.createElement(_material.DialogContent, {
+    dividers: true
+  }, /*#__PURE__*/_react.default.createElement(_material.Box, {
+    sx: loading || isEmpty ? {
       display: "flex",
       justifyContent: "center",
       alignItems: "center",
       height: 320
+    } : {
+      height: 320
     }
-  }, loading ? /*#__PURE__*/React.createElement(_material.CircularProgress, null) : /*#__PURE__*/React.createElement(_material.Box, null, "Alert"))));
+  }, loading ? /*#__PURE__*/_react.default.createElement(_material.CircularProgress, null) : isEmpty ? /*#__PURE__*/_react.default.createElement(_material.Typography, {
+    className: "no-record"
+  }, _ErrorMsg.default.NRF) : /*#__PURE__*/_react.default.createElement(_notificationCard.default, {
+    data: (0, _commonFun.filterAlertData)(data),
+    handleRead: handleRead,
+    handleShowDetails: handleShowDetails
+  })))), /*#__PURE__*/_react.default.createElement(_myDialog.default, {
+    title: "Alerts",
+    open: showAllAlert,
+    loading: loading,
+    onClose: handleHideAllAlert,
+    onRefresh: handleRefresh,
+    headerIconType: _Constant.HEADER_ICON_TYPE.CLOSE,
+    className: "alert-dialog"
+  }, /*#__PURE__*/_react.default.createElement(_alertBody.default, {
+    loading: loading,
+    isEmpty: isEmpty,
+    data: data,
+    handleRefresh: handleRefresh,
+    handleShowDetails: handleShowDetails,
+    handleRead: handleRead
+  })), /*#__PURE__*/_react.default.createElement(_myDialog.default, {
+    title: detailsData === null || detailsData === void 0 ? void 0 : detailsData.message,
+    subTitle: detailsData === null || detailsData === void 0 ? void 0 : detailsData.remark,
+    open: showDetails,
+    onClose: handleHideDetails,
+    headerIconType: _Constant.HEADER_ICON_TYPE.CLOSE,
+    className: "alert-dialog"
+  }, /*#__PURE__*/_react.default.createElement(_detailsBody.default, {
+    loading: loading,
+    isEmpty: isEmpty,
+    data: (detailsData === null || detailsData === void 0 ? void 0 : detailsData.notificationDetails) || []
+  })));
 };
 var _default = exports.default = Alert;