@itilite/iui-user-management 0.4.500 → 0.4.501

package/dist/index.css

@@ -897,6 +897,9 @@
   border-radius: 6px;
   padding: 16px;
 }
+._3hvWz._2H6Bq svg {
+  height: 14px;
+}
 ._3hvWz svg {
   height: 20px;
   width: 50px;
@@ -936,6 +939,14 @@ p._3pOsV {
   color: #6b7280;
   background: #f9fafb;
 }
+
+._1qxY- {
+  background-color: #e11d48 !important;
+}
+
+._2YBWE {
+  color: #e11d48 !important;
+}
 ._tdVCY {
   background-color: #ffffff;
 }

package/dist/index.js

@@ -357,7 +357,7 @@ var userAddEditUrl = {
   approversSearch: function approversSearch() {
     return "api/v1/user-management/company/" + IUILocalStorageService.getCompanyId() + "/company-approvers";
   },
-  _approversSearch: function _approversSearch() {
+  transferAppover: function transferAppover() {
     return "api/v1/user-management/users/single-user/transfer-approver-role?";
   },
   preSignedUrl: function preSignedUrl() {
@@ -611,7 +611,7 @@ var transferRoleOptions = function transferRoleOptions(search, loadedOptions, _r
     userId = _ref4.userId;
   try {
     return Promise.resolve(_catch(function () {
-      return Promise.resolve(api.get(userAddEditUrl._approversSearch() + "user_id=" + userId + "&page=" + page).then(function (res) {
+      return Promise.resolve(api.get(userAddEditUrl.transferAppover() + "user_id=" + userId + "&page=" + page + "&search=" + search).then(function (res) {
         return res.data;
       })).then(function (response) {
         var mappedValue = response.results.map(function (item) {
@@ -1150,6 +1150,12 @@ var setUserActiveStatus = function setUserActiveStatus(payload) {
     payload: payload
   };
 };
+var setBulkDeactivatedUsers = function setBulkDeactivatedUsers(payload) {
+  return {
+    type: SET_BULK_DEACTIVATED_USERS,
+    payload: payload
+  };
+};
 var showDataFetchingStatus = function showDataFetchingStatus(payload) {
   return {
     type: SHOW_LOADER$1,
@@ -1210,6 +1216,26 @@ var exportUsers = function exportUsers(payload) {
     });
   };
 };
+var deActivateUsers = function deActivateUsers(ids) {
+  return function (dispatch) {
+    return new Promise(function (resolve, reject) {
+      api$1.post("" + userListUrl.bulkDeactivate(), {
+        user_ids: ids
+      }).then(function (res) {
+        dispatch(setBulkDeactivatedUsers(ids));
+        IUIToastMessageService.sNotify(ids.length + ' Users deactivated successfully');
+        resolve();
+      })["catch"](function (err) {
+        if (!err.response.data.status) {
+          IUIToastMessageService.warningNotify(err.response.data.message);
+          reject(err);
+          return;
+        }
+        reject(err);
+      });
+    });
+  };
+};
 var updateTabValue = function updateTabValue(tabId) {
   return {
     type: SET_TAB_VALUE,
@@ -1224,7 +1250,7 @@ var updateActiveStatus = function updateActiveStatus(activateVal, id, roleTransf
     role_transfer: roleTransfer
   };
   if (roleTransfer) {
-    _payload['new_approver_user_id'] = newApproverUserId;
+    _payload.new_approver_user_id = newApproverUserId;
   }
   return function (dispatch) {
     return new Promise(function (resolve, reject) {
@@ -6867,7 +6893,7 @@ var fetchBulkactionHistory = function fetchBulkactionHistory(url) {
   };
 };
 
-var styles$5 = {"UUIUserManagementList":"_3WNHx","scrollOverlayMenu":"_2_WEg","overlaysearch":"_1Pbhb","pageHeader":"_1WLpc","buttonWrapper":"_2egTG","headingWrapper":"_1He01","headingSignUpWrapper":"_Q8vqd","heading":"_1uPaO","headingLarge":"_2FsLd","headingMedium":"_nGXA9","headingSmall":"_2rpwF","description":"_25vb9","headerText":"_1Ny9J","letterImage":"_2hr3R","tablewrapper":"_1-RPw","rowText":"_1LXyO","textTransform":"_3kFQS","lightColor":"_3Ghgw","avatarClassName":"_2qO_X","tooltipText":"_151u_","tooltipTextDiv":"_1l4V-","tooltip":"_-LQNH","importModalBodyContainer":"_25xUk","dividerColor":"_2HZv9","w100":"_3vGmU","downloadTemplateContainer":"_3-Xu_","downloadTemplateDescContainer":"_tLw43","labelContainer":"_7TYUZ","downlTempHeader":"__CZpe","downlTempDescription":"_19jEe","downloadTemplateButton":"_1qXtq","fileUploaderContainer":"_1YVz2","colGap":"_3vnY5","deActivateModalContainer":"_28H9H","backdrop":"_1ky1x","errorText":"_26_if","deactivateAlert":"_3hvWz","departmentHeadText":"_3pOsV","deactivateBtn":"_2v6e4","user_list_page_tabs":"_xWE7K","TabLabelCount":"_13pXn"};
+var styles$5 = {"UUIUserManagementList":"_3WNHx","scrollOverlayMenu":"_2_WEg","overlaysearch":"_1Pbhb","pageHeader":"_1WLpc","buttonWrapper":"_2egTG","headingWrapper":"_1He01","headingSignUpWrapper":"_Q8vqd","heading":"_1uPaO","headingLarge":"_2FsLd","headingMedium":"_nGXA9","headingSmall":"_2rpwF","description":"_25vb9","headerText":"_1Ny9J","letterImage":"_2hr3R","tablewrapper":"_1-RPw","rowText":"_1LXyO","textTransform":"_3kFQS","lightColor":"_3Ghgw","avatarClassName":"_2qO_X","tooltipText":"_151u_","tooltipTextDiv":"_1l4V-","tooltip":"_-LQNH","importModalBodyContainer":"_25xUk","dividerColor":"_2HZv9","w100":"_3vGmU","downloadTemplateContainer":"_3-Xu_","downloadTemplateDescContainer":"_tLw43","labelContainer":"_7TYUZ","downlTempHeader":"__CZpe","downlTempDescription":"_19jEe","downloadTemplateButton":"_1qXtq","fileUploaderContainer":"_1YVz2","colGap":"_3vnY5","deActivateModalContainer":"_28H9H","backdrop":"_1ky1x","errorText":"_26_if","deactivateAlert":"_3hvWz","warningSvg":"_2H6Bq","departmentHeadText":"_3pOsV","deactivateBtn":"_2v6e4","user_list_page_tabs":"_xWE7K","TabLabelCount":"_13pXn","deactivateSubmitBtn":"_1qxY-","deactivateCustomButtonClass":"_2YBWE"};
 
 var BulkUploadModal = function BulkUploadModal(props) {
   var isOpenImportUsersModal = props.isOpenImportUsersModal,
@@ -8733,16 +8759,26 @@ var UserList = function UserList(_ref2) {
     deactivateUser = _React$useState[0],
     setDeactivateUser = _React$useState[1];
   var _React$useState2 = React__default.useState(null),
+    defaultId = _React$useState2[0],
     setDefaultId = _React$useState2[1];
   var _React$useState3 = React__default.useState(1),
     page = _React$useState3[0],
     setPage = _React$useState3[1];
+  var _useState = React.useState([]),
+    selectedUsersNotApprover = _useState[0],
+    setSelectedUsersNotApprover = _useState[1];
+  var _useState2 = React.useState([]),
+    selectedUsersApprover = _useState2[0],
+    setSelectedUsersApprover = _useState2[1];
+  var _useState3 = React.useState(false),
+    isBulkDeactivateModalOpen = _useState3[0],
+    setIsBulkDeactivateModalOpen = _useState3[1];
   var _React$useState4 = React__default.useState(''),
     user = _React$useState4[0],
     setUser = _React$useState4[1];
-  var _useState = React.useState(10),
-    rowsPerPage = _useState[0],
-    setRowsPerPage = _useState[1];
+  var _useState4 = React.useState(10),
+    rowsPerPage = _useState4[0],
+    setRowsPerPage = _useState4[1];
   var _React$useState5 = React__default.useState({}),
     selected = _React$useState5[0],
     setSelected = _React$useState5[1];
@@ -8755,12 +8791,12 @@ var UserList = function UserList(_ref2) {
   var _React$useState8 = React__default.useState('first_name'),
     orderBy = _React$useState8[0],
     setOrderBy = _React$useState8[1];
-  var _useState2 = React.useState(''),
-    searchValue = _useState2[0],
-    setSearchValue = _useState2[1];
-  var _useState3 = React.useState(false),
-    isOpenDeActivateModal = _useState3[0],
-    setOpenDeActivateModalFlag = _useState3[1];
+  var _useState5 = React.useState(''),
+    searchValue = _useState5[0],
+    setSearchValue = _useState5[1];
+  var _useState6 = React.useState(false),
+    isOpenDeActivateModal = _useState6[0],
+    setOpenDeActivateModalFlag = _useState6[1];
   var _useSelector2 = reactRedux.useSelector(function (state) {
       return state.common;
     }),
@@ -8768,54 +8804,54 @@ var UserList = function UserList(_ref2) {
     hasVerificationError = _useSelector2.hasVerificationError,
     isILadmin = _useSelector2.isILadmin,
     companyName = _useSelector2.companyName;
-  var _useState4 = React.useState(false),
-    isOpenImportUsersModal = _useState4[0],
-    setOpenImportUsersModal = _useState4[1];
-  var _useState5 = React.useState(false),
-    approveeStatus = _useState5[0],
-    setApproveeStatus = _useState5[1];
-  var _useState6 = React.useState(false),
-    isFileDownloading = _useState6[0],
-    setDownlStatus = _useState6[1];
   var _useState7 = React.useState(false),
-    isSortingChange = _useState7[0],
-    setSortingChange = _useState7[1];
+    isOpenImportUsersModal = _useState7[0],
+    setOpenImportUsersModal = _useState7[1];
   var _useState8 = React.useState(false),
-    isSearchingChange = _useState8[0],
-    setSearchingChange = _useState8[1];
+    approveeStatus = _useState8[0],
+    setApproveeStatus = _useState8[1];
   var _useState9 = React.useState(false),
-    isSortingChangeTemp = _useState9[0],
-    setSortingChangeTemp = _useState9[1];
+    isFileDownloading = _useState9[0],
+    setDownlStatus = _useState9[1];
   var _useState10 = React.useState(false),
-    isSearchingChangeTemp = _useState10[0],
-    setSearchingChangeTemp = _useState10[1];
+    isSortingChange = _useState10[0],
+    setSortingChange = _useState10[1];
   var _useState11 = React.useState(false),
-    isApiFetching = _useState11[0],
-    setisApiFetching = _useState11[1];
-  var _useState12 = React.useState({
+    isSearchingChange = _useState11[0],
+    setSearchingChange = _useState11[1];
+  var _useState12 = React.useState(false),
+    isSortingChangeTemp = _useState12[0],
+    setSortingChangeTemp = _useState12[1];
+  var _useState13 = React.useState(false),
+    isSearchingChangeTemp = _useState13[0],
+    setSearchingChangeTemp = _useState13[1];
+  var _useState14 = React.useState(false),
+    isApiFetching = _useState14[0],
+    setisApiFetching = _useState14[1];
+  var _useState15 = React.useState({
       value: '',
       label: 'Select approver'
     }),
-    approverRole = _useState12[0],
-    setApproverRole = _useState12[1];
-  var _useState13 = React.useState(false),
-    showInviteModal = _useState13[0],
-    setToggleInviteModal = _useState13[1];
-  var _useState14 = React.useState(''),
-    userIds = _useState14[0],
-    setUserIds = _useState14[1];
+    approverRole = _useState15[0],
+    setApproverRole = _useState15[1];
+  var _useState16 = React.useState(false),
+    showInviteModal = _useState16[0],
+    setToggleInviteModal = _useState16[1];
+  var _useState17 = React.useState(''),
+    userIds = _useState17[0],
+    setUserIds = _useState17[1];
   var _React$useState9 = React__default.useState(false),
     overlayMenu = _React$useState9[0],
     setOverlayMenu = _React$useState9[1];
-  var _useState15 = React.useState(''),
-    userFirstName = _useState15[0],
-    setUserFirstName = _useState15[1];
-  var _useState16 = React.useState(''),
-    userLastName = _useState16[0],
-    setUserLastName = _useState16[1];
-  var _useState17 = React.useState(true),
-    isDisabledSubmitBtn = _useState17[0],
-    setIsDisabledSubmitBtn = _useState17[1];
+  var _useState18 = React.useState(''),
+    userFirstName = _useState18[0],
+    setUserFirstName = _useState18[1];
+  var _useState19 = React.useState(''),
+    userLastName = _useState19[0],
+    setUserLastName = _useState19[1];
+  var _useState20 = React.useState(true),
+    isDisabledSubmitBtn = _useState20[0],
+    setIsDisabledSubmitBtn = _useState20[1];
   useScrollPosition.useScrollPosition(function (_ref3) {
     var prevPos = _ref3.prevPos,
       currPos = _ref3.currPos;
@@ -8839,30 +8875,30 @@ var UserList = function UserList(_ref2) {
   var _React$useState10 = React__default.useState(1),
     signup_page = _React$useState10[0],
     setSignUpPage = _React$useState10[1];
-  var _useState18 = React.useState(5),
-    signup_rowsPerPage = _useState18[0],
-    setSignUpRowsPerPage = _useState18[1];
+  var _useState21 = React.useState(5),
+    signup_rowsPerPage = _useState21[0],
+    setSignUpRowsPerPage = _useState21[1];
   var _React$useState11 = React__default.useState('asc'),
     signup_order = _React$useState11[0],
     setSignUpOrder = _React$useState11[1];
   var _React$useState12 = React__default.useState('fname'),
     signup_orderBy = _React$useState12[0],
     setSignUpOrderBy = _React$useState12[1];
-  var _useState19 = React.useState(''),
-    signup_searchValue = _useState19[0],
-    set_signup_SearchValue = _useState19[1];
-  var _useState20 = React.useState(false),
-    isSignUpSortingChange = _useState20[0],
-    setSignUpSortingChange = _useState20[1];
-  var _useState21 = React.useState(false),
-    isSignUpSearchingChange = _useState21[0],
-    setSignUpSearchingChange = _useState21[1];
-  var _useState22 = React.useState(false),
-    isSignUpSortingChangeTemp = _useState22[0],
-    setSignUpSortingChangeTemp = _useState22[1];
+  var _useState22 = React.useState(''),
+    signup_searchValue = _useState22[0],
+    set_signup_SearchValue = _useState22[1];
   var _useState23 = React.useState(false),
-    isSignUpSearchingChangeTemp = _useState23[0],
-    setSignUpSearchingChangeTemp = _useState23[1];
+    isSignUpSortingChange = _useState23[0],
+    setSignUpSortingChange = _useState23[1];
+  var _useState24 = React.useState(false),
+    isSignUpSearchingChange = _useState24[0],
+    setSignUpSearchingChange = _useState24[1];
+  var _useState25 = React.useState(false),
+    isSignUpSortingChangeTemp = _useState25[0],
+    setSignUpSortingChangeTemp = _useState25[1];
+  var _useState26 = React.useState(false),
+    isSignUpSearchingChangeTemp = _useState26[0],
+    setSignUpSearchingChangeTemp = _useState26[1];
   var _useSelector3 = reactRedux.useSelector(function (state) {
       return state.userList;
     }),
@@ -8875,11 +8911,18 @@ var UserList = function UserList(_ref2) {
       IUIToastMessageService$7.warningNotify('Select at least one user to deactivate.');
       return false;
     }
-    setOpenDeActivateModalFlag(true);
+    if (selectedUsersApprover.length) {
+      setIsBulkDeactivateModalOpen(true);
+    } else {
+      setOpenDeActivateModalFlag(true);
+    }
   };
   var closeDeActivateModal = function closeDeActivateModal() {
     setOpenDeActivateModalFlag(false);
   };
+  var closeDeActiveModal = function closeDeActiveModal() {
+    setIsBulkDeactivateModalOpen(false);
+  };
   var handleAddPageNavigation = function handleAddPageNavigation() {
     history.push(config.routes.users.add.path);
   };
@@ -8927,12 +8970,25 @@ var UserList = function UserList(_ref2) {
   };
   var deselectingCheckboxHandler = function deselectingCheckboxHandler(page) {
     var _extends2;
+    var selectedId = [];
+    var _selectedUsersNotApprover = [].concat(selectedUsersNotApprover);
+    var _selectedUsersApprover = [].concat(selectedUsersApprover);
     var _newSelecteds = newSelecteds.filter(function (n) {
       return n.is_active;
-    }).map(function (obj) {
-      return obj.id.toString();
     });
-    setSelected(_extends({}, selected, (_extends2 = {}, _extends2[page] = _newSelecteds, _extends2)));
+    _newSelecteds.map(function (obj) {
+      if (selected && !Object.values(selected).flat().includes(obj.id.toString())) {
+        if (obj.roles.is_approver === true) {
+          _selectedUsersApprover.push(obj);
+        } else if (obj.roles.is_approver === false) {
+          _selectedUsersNotApprover.push(obj);
+        }
+      }
+      selectedId.push(obj.id.toString());
+    });
+    setSelected(_extends({}, selected, (_extends2 = {}, _extends2[page] = selectedId, _extends2)));
+    setSelectedUsersNotApprover(_selectedUsersNotApprover);
+    setSelectedUsersApprover(_selectedUsersApprover);
   };
   var handleSelectAllClick = function handleSelectAllClick(event, page) {
     var _extends3;
@@ -8941,6 +8997,8 @@ var UserList = function UserList(_ref2) {
       return;
     }
     setSelected(_extends({}, selected, (_extends3 = {}, _extends3[page] = [], _extends3)));
+    setSelectedUsersNotApprover([]);
+    setSelectedUsersApprover([]);
   };
   var onRequestSort = function onRequestSort(event, property) {
     var isAsc = orderBy === property && order === 'asc';
@@ -8959,7 +9017,7 @@ var UserList = function UserList(_ref2) {
     setSignUpSearchingChange(true);
     setSignUpSearchingChangeTemp(!isSignUpSearchingChangeTemp);
   };
-  var handleSingleCheckBoxClick = function handleSingleCheckBoxClick(event, id, page) {
+  var handleSingleCheckBoxClick = function handleSingleCheckBoxClick(event, id, page, data) {
     var _extends4;
     var selectedTemp = _extends({}, selected);
     if (!(page in selectedTemp)) {
@@ -8976,6 +9034,26 @@ var UserList = function UserList(_ref2) {
     } else if (selectedIndex > 0) {
       _newSelected = _newSelected.concat(selectedTemp[page].slice(0, selectedIndex), selectedTemp[page].slice(selectedIndex + 1));
     }
+    if (selectedUsersNotApprover !== null && selectedUsersNotApprover !== void 0 && selectedUsersNotApprover.length || selectedUsersApprover !== null && selectedUsersApprover !== void 0 && selectedUsersApprover.length) {
+      var _SelectedUsersNotApprover = [].concat(selectedUsersNotApprover);
+      var _SelectedUsersApprover = [].concat(selectedUsersApprover);
+      if (Object.values(selected).flat().includes(id.toString())) {
+        _SelectedUsersNotApprover = selectedUsersNotApprover.filter(function (item) {
+          return id !== item.id.toString();
+        });
+        _SelectedUsersApprover = selectedUsersApprover.filter(function (item) {
+          return item.id.toString() !== id;
+        });
+      } else if (data !== null && data !== void 0 && data.roles) {
+        if (data.roles.is_approver === true) {
+          _SelectedUsersApprover.push(data);
+        } else if (data.roles.is_approver === false) {
+          _SelectedUsersNotApprover.push(data);
+        }
+      }
+      setSelectedUsersNotApprover(_SelectedUsersNotApprover);
+      setSelectedUsersApprover(_SelectedUsersApprover);
+    }
     setSelected(_extends({}, selected, (_extends4 = {}, _extends4[page] = _newSelected, _extends4)));
   };
   React.useEffect(function () {
@@ -8983,23 +9061,20 @@ var UserList = function UserList(_ref2) {
       value: '',
       label: 'Select approver'
     });
+    setDefaultId(null);
     setIsDisabledSubmitBtn(true);
     setApproveeStatus(false);
     if (deactivateSingle === true) {
-      api$7.get(userAddEditUrl._approversSearch() + "user_id=" + user.id + "&page=1").then(function (response) {
-        setDefaultId(response.data["default"].id);
-        response.data.results.map(function (item) {
-          if (response.data["default"].id === item.id) {
-            setApproverRole({
-              value: '',
-              label: item.email
-            });
-            setIsDisabledSubmitBtn(false);
-            if (item.approvee_status) {
-              setApproveeStatus(true);
-            }
-          }
-        });
+      api$7.get(userAddEditUrl.transferAppover() + "user_id=" + user.id + "&page=1").then(function (response) {
+        if (response.data["default"].id) {
+          setDefaultId(response.data["default"].id);
+          setApproverRole({
+            value: '',
+            label: response.data["default"].email
+          });
+          setIsDisabledSubmitBtn(false);
+          setApproveeStatus(response.data["default"].approvee_status);
+        }
       });
     }
   }, [deactivateSingle]);
@@ -9007,6 +9082,8 @@ var UserList = function UserList(_ref2) {
     setRowsPerPage(+event.target.value);
     setPage(1);
     setSelected({});
+    setSelectedUsersNotApprover([]);
+    setSelectedUsersApprover([]);
     setSortingChange(true);
     setSortingChangeTemp(!isSortingChangeTemp);
   };
@@ -9026,8 +9103,18 @@ var UserList = function UserList(_ref2) {
               if (Object.values(selected).flat().includes(id.toString())) {
                 var _extends5;
                 var selectedTemp = _extends({}, selected);
+                var _selectedUsersApprover = [].concat(selectedUsersApprover);
+                var _selectedUsersNotApprover = [].concat(selectedUsersNotApprover);
                 selectedTemp[page].splice(selectedTemp[page].indexOf(id.toString()), 1);
+                _selectedUsersApprover = _selectedUsersApprover.filter(function (item) {
+                  return item.id != id;
+                });
+                _selectedUsersNotApprover = _selectedUsersNotApprover.filter(function (item) {
+                  return item.id != id;
+                });
                 setSelected(_extends({}, selected, (_extends5 = {}, _extends5[page] = selectedTemp[page], _extends5)));
+                setSelectedUsersApprover(_selectedUsersApprover);
+                setSelectedUsersNotApprover(_selectedUsersNotApprover);
               }
             }
           });
@@ -9042,14 +9129,35 @@ var UserList = function UserList(_ref2) {
     } else {
       setApproveeStatus(false);
     }
+    setDefaultId(_value.data.id);
     setApproverRole(_value);
     setIsDisabledSubmitBtn(false);
   };
-  var handleDeactivateUsers = function handleDeactivateUsers() {
-    dispatch(updateActiveStatus(0, user.id, user.roles.is_approver, approverRole.data.id));
+  var handleDeactivateUser = function handleDeactivateUser() {
+    dispatch(updateActiveStatus(0, user.id, user.roles.is_approver, defaultId));
     setOpenDeActivateModalFlag(false);
     setDeactivateSingle(false);
     setSelected({});
+    setSelectedUsersNotApprover([]);
+    setSelectedUsersApprover([]);
+  };
+  var handleDeactivateUsers = function handleDeactivateUsers() {
+    dispatch(deActivateUsers(Object.values(selected).flat()));
+    setOpenDeActivateModalFlag(false);
+    setSelected({});
+    setSelectedUsersNotApprover([]);
+    setSelectedUsersApprover([]);
+    setIsBulkDeactivateModalOpen(false);
+  };
+  var handleDeactivateSafeUsers = function handleDeactivateSafeUsers() {
+    var _selectedUsersNotApprover = selectedUsersNotApprover.map(function (item) {
+      return item.id;
+    });
+    dispatch(deActivateUsers(_selectedUsersNotApprover));
+    setIsBulkDeactivateModalOpen(false);
+    setSelected({});
+    setSelectedUsersNotApprover([]);
+    setSelectedUsersApprover([]);
   };
   var importUserHandler = function importUserHandler() {
     setOpenImportUsersModal(true);
@@ -9444,21 +9552,21 @@ var UserList = function UserList(_ref2) {
     },
     cancelLabel: "Cancel",
     submitLabel: "Deactivate",
-    submitHandler: handleDeactivateUsers,
+    submitHandler: handleDeactivateUser,
     headerText: "Deactivate this user?",
     width: "400px",
     subHanderText: "",
     submitBtnClass: styles$5.deactivateBtn,
     isDisabledSubmitBtn: isDisabledSubmitBtn
   }, /*#__PURE__*/React__default.createElement(iuistyles.IUIBox, {
-    className: styles$5.deactivateSingle
+    className: clsx(styles$5.deactivateSingle, 'iui__mb-16')
   }, /*#__PURE__*/React__default.createElement(iuistyles.IUIBox, {
     className: styles$5.deactivateAlert
   }, /*#__PURE__*/React__default.createElement(InfoYellowIcon, {
     width: "9",
     height: "9"
   }), /*#__PURE__*/React__default.createElement(iuistyles.IUITypography, null, /*#__PURE__*/React__default.createElement("b", null, deactivateUser), " is linked with multiple roles. You can deactivate them only once you transfer the roles to another user.")), /*#__PURE__*/React__default.createElement(iuistyles.IUIBox, {
-    className: "iui__my-15"
+    className: "iui__mt-15"
   }, /*#__PURE__*/React__default.createElement(iuistyles.IUIAsyncSelect, {
     isMove: true,
     additional: {
@@ -9471,7 +9579,8 @@ var UserList = function UserList(_ref2) {
     value: approverRole,
     onValueChange: selectApprover,
     loadOption: transferRoleOptions,
-    disableText: "Please get in touch with your administrator to change this value."
+    disableText: "Please get in touch with your administrator to change this value.",
+    customLoadingText: "No results found"
   }), approveeStatus && /*#__PURE__*/React__default.createElement(iuistyles.IUIBox, {
     className: "iui__d-flex iui__align-items-baseline iui__mr-5"
   }, /*#__PURE__*/React__default.createElement(iuistyles.IUIBox, null, /*#__PURE__*/React__default.createElement(RedWarningIcon, null)), /*#__PURE__*/React__default.createElement(iuistyles.IUIBox, {
@@ -9503,6 +9612,72 @@ var UserList = function UserList(_ref2) {
   }, 'Are you sure you want to deactivate ' + Object.values(selected).flat().length.toString() + (Object.values(selected).flat().length === 1 ? ' user ?' : ' users ?')), /*#__PURE__*/React__default.createElement(iuistyles.IUITypography, {
     className: styles$5.description
   }, "The", ' ', Object.values(selected).flat().length === 1 ? ' user ' : ' users ', "won\u2019t be able to access itilite platform"))), /*#__PURE__*/React__default.createElement(iuistyles.IUIModal, {
+    isOpen: isBulkDeactivateModalOpen,
+    closeHandler: closeDeActiveModal,
+    cancelLabel: "Cancel",
+    submitLabel: "Deactivate safe users",
+    submitBtnClass: clsx(styles$5.deactivateSubmitBtn),
+    customButtonLabel: "Deactivate all users",
+    customButtonHandler: handleDeactivateUsers,
+    submitHandler: handleDeactivateSafeUsers,
+    width: "640px",
+    customButtonClass: clsx(styles$5.deactivateCustomButtonClass),
+    headerText: "Deactivate users?"
+  }, /*#__PURE__*/React__default.createElement(iuistyles.IUIBox, {
+    className: clsx(styles$5.deactivateAlert, styles$5.warningSvg)
+  }, /*#__PURE__*/React__default.createElement(RedWarningIcon, {
+    color: "#9A6700",
+    size: "14"
+  }), /*#__PURE__*/React__default.createElement(iuistyles.IUITypography, null, "Some users are linked with multiple roles. Deactivating these users will result in missing roles and approvers. Deactivate these users individually and transfer their roles to avoid missing roles.")), /*#__PURE__*/React__default.createElement(iuistyles.IUIBox, {
+    className: "iui__my-15"
+  }, /*#__PURE__*/React__default.createElement(iuistyles.IUIBox, {
+    className: "iui__font--para-large iui__font--weight-medium"
+  }, "Users with multiple roles"), /*#__PURE__*/React__default.createElement(iuistyles.IUIBox, {
+    className: "iui__font--color-black500 iui__font--size-sm iui__mt-2"
+  }, "Deactivating these users will affect the associated approval rules."), (selectedUsersApprover === null || selectedUsersApprover === void 0 ? void 0 : selectedUsersApprover.length) && selectedUsersApprover.map(function (item, index) {
+    var _item$data;
+    return /*#__PURE__*/React__default.createElement(iuistyles.IUIBox, {
+      key: index,
+      className: "iui__d-flex iui__justify-content-spaceBetween iui__align-items-center iui__mt-10"
+    }, /*#__PURE__*/React__default.createElement(iuistyles.IUIProfileBox, {
+      firstName: item.first_name,
+      lastName: item.last_name,
+      isLetterAvatar: "true",
+      primaryText: item.first_name + ' ' + item.last_name,
+      secondaryText: item.email,
+      letterAvatarTextColor: "black",
+      letterAvatarBackgroundColor: "#d3d3d3",
+      profilePath: (_item$data = item.data) === null || _item$data === void 0 ? void 0 : _item$data.profile_pic
+    }), /*#__PURE__*/React__default.createElement(RedWarningIcon, {
+      color: "#9A6700",
+      size: "14"
+    }));
+  })), selectedUsersNotApprover !== null && selectedUsersNotApprover !== void 0 && selectedUsersNotApprover.length ? /*#__PURE__*/React__default.createElement(iuistyles.IUIBox, null, /*#__PURE__*/React__default.createElement("hr", {
+    style: {
+      borderColor: '#E5E9ED'
+    }
+  }), /*#__PURE__*/React__default.createElement(iuistyles.IUIBox, {
+    className: "iui__my-15"
+  }, /*#__PURE__*/React__default.createElement(iuistyles.IUIBox, {
+    className: "iui__font--para-large iui__font--weight-medium"
+  }, "Safe users"), /*#__PURE__*/React__default.createElement(iuistyles.IUIBox, {
+    className: "iui__font--color-black500 iui__font--size-sm iui__mt-2"
+  }, "These users are not linked to any roles and can be deactivated safely."), (selectedUsersNotApprover === null || selectedUsersNotApprover === void 0 ? void 0 : selectedUsersNotApprover.length) && selectedUsersNotApprover.map(function (item, index) {
+    var _item$data2;
+    return /*#__PURE__*/React__default.createElement(iuistyles.IUIBox, {
+      key: index,
+      className: "iui__d-flex iui__justify-content-spaceBetween iui__align-items-center iui__mt-10"
+    }, /*#__PURE__*/React__default.createElement(iuistyles.IUIProfileBox, {
+      firstName: item.first_name,
+      lastName: item.last_name,
+      isLetterAvatar: "true",
+      primaryText: item.first_name + ' ' + item.last_name,
+      secondaryText: item.email,
+      letterAvatarTextColor: "black",
+      letterAvatarBackgroundColor: "#d3d3d3",
+      profilePath: (_item$data2 = item.data) === null || _item$data2 === void 0 ? void 0 : _item$data2.profile_pic
+    }));
+  }))) : null), /*#__PURE__*/React__default.createElement(iuistyles.IUIModal, {
     isOpen: showInviteModal,
     closeHandler: function closeHandler() {
       return toggleInviteModalClose();