@itilite/iui-user-management 1.3.1 → 1.3.2

package/dist/index.js

@@ -149,17 +149,11 @@ function r(e) {
   var t,
     f,
     n = "";
-  if ("string" == typeof e || "number" == typeof e) n += e;else if ("object" == typeof e) if (Array.isArray(e)) for (t = 0; t < e.length; t++) {
-    e[t] && (f = r(e[t])) && (n && (n += " "), n += f);
-  } else for (t in e) {
-    e[t] && (n && (n += " "), n += t);
-  }
+  if ("string" == typeof e || "number" == typeof e) n += e;else if ("object" == typeof e) if (Array.isArray(e)) for (t = 0; t < e.length; t++) e[t] && (f = r(e[t])) && (n && (n += " "), n += f);else for (t in e) e[t] && (n && (n += " "), n += t);
   return n;
 }
 function clsx() {
-  for (var e, t, f = 0, n = ""; f < arguments.length;) {
-    (e = arguments[f++]) && (t = r(e)) && (n && (n += " "), n += t);
-  }
+  for (var e, t, f = 0, n = ""; f < arguments.length;) (e = arguments[f++]) && (t = r(e)) && (n && (n += " "), n += t);
   return n;
 }
 
@@ -363,6 +357,9 @@ var userAddEditUrl = {
   approversSearch: function approversSearch() {
     return "api/v1/user-management/company/" + IUILocalStorageService.getCompanyId() + "/company-approvers";
   },
+  transferAppover: function transferAppover() {
+    return "api/v1/user-management/users/single-user/transfer-approver-role?";
+  },
   preSignedUrl: function preSignedUrl() {
     return "api/v1/user-management/company/" + IUILocalStorageService.getCompanyId() + "/presigned-url";
   },
@@ -608,11 +605,53 @@ var currencyLoadOptions = function currencyLoadOptions(search, loadedOptions, _r
     return Promise.reject(e);
   }
 };
-var approversOptions = function approversOptions(search, loadedOptions, _ref4) {
+var transferRoleOptions = function transferRoleOptions(search, loadedOptions, _ref4) {
   var page = _ref4.page,
     product = _ref4.product,
-    userId = _ref4.userId,
-    placeholder = _ref4.placeholder;
+    userId = _ref4.userId;
+  try {
+    return Promise.resolve(_catch(function () {
+      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) {
+          return {
+            value: item.email,
+            label: item.email,
+            type: 'detailed',
+            data: item
+          };
+        });
+        return {
+          options: mappedValue,
+          hasMore: !!response.next,
+          additional: {
+            page: page + 1,
+            product: product,
+            userId: userId
+          }
+        };
+      });
+    }, function () {
+      return {
+        options: [],
+        hasMore: false,
+        additional: {
+          page: 1,
+          product: product,
+          userId: userId
+        }
+      };
+    }));
+  } catch (e) {
+    return Promise.reject(e);
+  }
+};
+var approversOptions = function approversOptions(search, loadedOptions, _ref5) {
+  var page = _ref5.page,
+    product = _ref5.product,
+    userId = _ref5.userId,
+    placeholder = _ref5.placeholder;
   try {
     return Promise.resolve(_catch(function () {
       return Promise.resolve(api.get(userAddEditUrl.approversSearch() + "?page=" + page + "&product=" + product + "&search=" + search + "&user_id=" + userId).then(function (res) {
@@ -658,9 +697,9 @@ var approversOptions = function approversOptions(search, loadedOptions, _ref4) {
     return Promise.reject(e);
   }
 };
-var countryOptions = function countryOptions(search, loadedOptions, _ref5) {
-  var page = _ref5.page,
-    tabelName = _ref5.tabelName;
+var countryOptions = function countryOptions(search, loadedOptions, _ref6) {
+  var page = _ref6.page,
+    tabelName = _ref6.tabelName;
   try {
     return Promise.resolve(_catch(function () {
       return Promise.resolve(api.get(userAddEditUrl.countryPaginated() + "&search=" + search + "&page=" + page + "&info=" + tabelName).then(function (res) {
@@ -695,9 +734,9 @@ var countryOptions = function countryOptions(search, loadedOptions, _ref5) {
     return Promise.reject(e);
   }
 };
-var departmentHeadOptions = function departmentHeadOptions(search, loadedOptions, _ref6) {
-  var page = _ref6.page,
-    departmentId = _ref6.departmentId;
+var departmentHeadOptions = function departmentHeadOptions(search, loadedOptions, _ref7) {
+  var page = _ref7.page,
+    departmentId = _ref7.departmentId;
   try {
     return Promise.resolve(_catch(function () {
       return Promise.resolve(api.get(departmentUrl.getDepartmentHead(departmentId, page) + "&search=" + search).then(function (res) {
@@ -1203,10 +1242,19 @@ var updateTabValue = function updateTabValue(tabId) {
     payload: tabId
   };
 };
-var updateActiveStatus = function updateActiveStatus(activateVal, id) {
+var updateActiveStatus = function updateActiveStatus(activateVal, id, roleTransfer, newApproverUserId) {
+  if (roleTransfer === void 0) {
+    roleTransfer = false;
+  }
+  var _payload = {
+    role_transfer: roleTransfer
+  };
+  if (roleTransfer) {
+    _payload.new_approver_user_id = newApproverUserId;
+  }
   return function (dispatch) {
     return new Promise(function (resolve, reject) {
-      api$1.get(userListUrl.updateActiveStatus + 'user_id=' + id + '&activate=' + activateVal).then(function (res) {
+      api$1.put(userListUrl.updateActiveStatus + "user_id=" + id + "&activate=" + activateVal, _payload).then(function (res) {
         dispatch(setUserActiveStatus({
           is_active: activateVal !== 0,
           id: id
@@ -5219,7 +5267,7 @@ var UserAddEdit = function UserAddEdit(props) {
   };
   var onPersonalInfoChange = function onPersonalInfoChange(args) {
     try {
-      var _temp6 = function _temp6() {
+      var _temp5 = function _temp5() {
         if (Object.hasOwnProperty.call(inputChangeLog, _name)) {
           var _extends6;
           updateInputChangeLog(_extends({}, inputChangeLog, (_extends6 = {}, _extends6[_name] = true, _extends6)));
@@ -5233,7 +5281,7 @@ var UserAddEdit = function UserAddEdit(props) {
         _errorMsg = _args$_errorMsg === void 0 ? '' : _args$_errorMsg,
         _args$_obj = args._obj,
         _obj = _args$_obj === void 0 ? {} : _args$_obj;
-      var _temp7 = function () {
+      var _temp4 = function () {
         if (_name === 'contact_number') {
           setPersonalInfoInput(_extends({}, personalInfoInput, {
             contact_number: _value.trim(),
@@ -5244,14 +5292,14 @@ var UserAddEdit = function UserAddEdit(props) {
           updateError('country_code', _isError, _errorMsg);
           updateError('contact_country_code', _isError, _errorMsg);
         } else {
-          var _temp8 = function _temp8() {
+          var _temp3 = function _temp3() {
             var _extends7;
             setPersonalInfoInput(_extends({}, personalInfoInput, (_extends7 = {}, _extends7[_name] = _value, _extends7)));
             updateError(_name, _isError, _errorMsg);
           };
-          var _temp9 = function () {
+          var _temp2 = function () {
             if (_name === 'profile_pic') {
-              var _temp10 = function () {
+              var _temp = function () {
                 if (_obj.isUpload) {
                   return Promise.resolve(uploadDocs(_value, _name)).then(function (docsData) {
                     _value = _value.map(function (_val) {
@@ -5282,13 +5330,13 @@ var UserAddEdit = function UserAddEdit(props) {
                   setProfilePicDelete([].concat(profilePicDelete, _deletedFiles));
                 }
               }();
-              if (_temp10 && _temp10.then) return _temp10.then(function () {});
+              if (_temp && _temp.then) return _temp.then(function () {});
             }
           }();
-          return _temp9 && _temp9.then ? _temp9.then(_temp8) : _temp8(_temp9);
+          return _temp2 && _temp2.then ? _temp2.then(_temp3) : _temp3(_temp2);
         }
       }();
-      return Promise.resolve(_temp7 && _temp7.then ? _temp7.then(_temp6) : _temp6(_temp7));
+      return Promise.resolve(_temp4 && _temp4.then ? _temp4.then(_temp5) : _temp5(_temp4));
     } catch (e) {
       return Promise.reject(e);
     }
@@ -5404,7 +5452,7 @@ var UserAddEdit = function UserAddEdit(props) {
   };
   var onPassportInfoInputChange = function onPassportInfoInputChange(args) {
     try {
-      var _temp14 = function _temp14() {
+      var _temp8 = function _temp8() {
         var _extends18;
         setPassportInfoInput(_extends({}, passportInfoInput, (_extends18 = {}, _extends18[_name] = _value, _extends18)));
         if (Object.hasOwnProperty.call(inputChangeLog, _name)) {
@@ -5447,9 +5495,9 @@ var UserAddEdit = function UserAddEdit(props) {
         }
         return Promise.resolve();
       }
-      var _temp15 = function () {
+      var _temp7 = function () {
         if (_name === 'passport_photo' || _name === 'travel_docs') {
-          var _temp16 = function () {
+          var _temp6 = function () {
             if (_obj.isUpload) {
               var checkAlreadyUploadedFiles = uploadedFiles.filter(function (_file) {
                 if (_name === 'passport_photo') {
@@ -5493,10 +5541,10 @@ var UserAddEdit = function UserAddEdit(props) {
               setFilesForDelete([].concat(filesForDelete, _deletedFiles));
             }
           }();
-          if (_temp16 && _temp16.then) return _temp16.then(function () {});
+          if (_temp6 && _temp6.then) return _temp6.then(function () {});
         }
       }();
-      return Promise.resolve(_temp15 && _temp15.then ? _temp15.then(_temp14) : _temp14(_temp15));
+      return Promise.resolve(_temp7 && _temp7.then ? _temp7.then(_temp8) : _temp8(_temp7));
     } catch (e) {
       return Promise.reject(e);
     }
@@ -5822,7 +5870,7 @@ var UserAddEdit = function UserAddEdit(props) {
   }, [renderFields.expenseApprovers]);
   var uploadDocs = function uploadDocs(docToUpload, type) {
     try {
-      var _temp19 = function _temp19() {
+      var _temp10 = function _temp10() {
         setUploadedFiles([].concat(uploadedFiles, data));
         dispatch(stopLoader());
         return data;
@@ -5838,12 +5886,12 @@ var UserAddEdit = function UserAddEdit(props) {
           userID: editUserId
         });
       });
-      var _temp20 = _forTo(docs, function (i) {
+      var _temp9 = _forTo(docs, function (i) {
         return Promise.resolve(dispatch(uploadSingleDocumnet(docs[i]))).then(function (res) {
           data.push(res);
         });
       });
-      return Promise.resolve(_temp20 && _temp20.then ? _temp20.then(_temp19) : _temp19(_temp20));
+      return Promise.resolve(_temp9 && _temp9.then ? _temp9.then(_temp10) : _temp10(_temp9));
     } catch (e) {
       return Promise.reject(e);
     }
@@ -5999,27 +6047,28 @@ var UserAddEdit = function UserAddEdit(props) {
       if (_isError) {
         setErrorArray(_errorArray);
         setErrorMsgs(_errorMsgs);
-        for (var _key3 in _errorMsgs) {
+        var _loop = function _loop() {
           if (Object.hasOwnProperty.call(_errorMsgs, _key3)) {
             if (_errorMsgs[_key3]) {
-              var _ret = function () {
-                if (_key3 in passportInfoInput || _key3 in travelPreferenceInfo || _key3 in secureTravelInputInfo) {
-                  setAdditionalInfoFlag('open');
-                }
-                var el = document.getElementById(_key3 === 'country_code' || _key3 === 'contact_country_code' ? 'contact_number' : _key3);
-                if (el) {
-                  setTimeout(function () {
-                    el.scrollIntoView({
-                      behavior: 'smooth',
-                      block: 'center'
-                    });
-                  }, 500);
-                  return "break";
-                }
-              }();
-              if (_ret === "break") break;
+              if (_key3 in passportInfoInput || _key3 in travelPreferenceInfo || _key3 in secureTravelInputInfo) {
+                setAdditionalInfoFlag('open');
+              }
+              var el = document.getElementById(_key3 === 'country_code' || _key3 === 'contact_country_code' ? 'contact_number' : _key3);
+              if (el) {
+                setTimeout(function () {
+                  el.scrollIntoView({
+                    behavior: 'smooth',
+                    block: 'center'
+                  });
+                }, 500);
+                return "break";
+              }
             }
           }
+        };
+        for (var _key3 in _errorMsgs) {
+          var _ret = _loop();
+          if (_ret === "break") break;
         }
         return Promise.resolve();
       }
@@ -6049,27 +6098,28 @@ var UserAddEdit = function UserAddEdit(props) {
             }
             setErrorArray(Object.keys(err));
             setErrorMsgs(err);
-            for (var _key4 in err) {
+            var _loop2 = function _loop2() {
               if (Object.hasOwnProperty.call(err, _key4)) {
                 if (err[_key4]) {
-                  var _ret2 = function () {
-                    if (_key4 in passportInfoInput || _key4 in travelPreferenceInfo || _key4 in secureTravelInputInfo) {
-                      setAdditionalInfoFlag('open');
-                    }
-                    var el = document.getElementById(_key4 === 'country_code' || _key4 === 'contact_country_code' ? 'contact_number' : _key4);
-                    if (el) {
-                      setTimeout(function () {
-                        el.scrollIntoView({
-                          behavior: 'smooth',
-                          block: 'center'
-                        });
-                      }, 500);
-                      return "break";
-                    }
-                  }();
-                  if (_ret2 === "break") break;
+                  if (_key4 in passportInfoInput || _key4 in travelPreferenceInfo || _key4 in secureTravelInputInfo) {
+                    setAdditionalInfoFlag('open');
+                  }
+                  var el = document.getElementById(_key4 === 'country_code' || _key4 === 'contact_country_code' ? 'contact_number' : _key4);
+                  if (el) {
+                    setTimeout(function () {
+                      el.scrollIntoView({
+                        behavior: 'smooth',
+                        block: 'center'
+                      });
+                    }, 500);
+                    return "break";
+                  }
                 }
               }
+            };
+            for (var _key4 in err) {
+              var _ret2 = _loop2();
+              if (_ret2 === "break") break;
             }
           } else if (typeof err === 'string') {
             IUIToastMessageService$4.warningNotify(err);
@@ -6098,27 +6148,28 @@ var UserAddEdit = function UserAddEdit(props) {
             }
             setErrorArray(Object.keys(err));
             setErrorMsgs(err);
-            for (var _key5 in err) {
+            var _loop3 = function _loop3() {
               if (Object.hasOwnProperty.call(err, _key5)) {
                 if (err[_key5]) {
-                  var _ret3 = function () {
-                    if (_key5 in passportInfoInput || _key5 in travelPreferenceInfo || _key5 in secureTravelInputInfo) {
-                      setAdditionalInfoFlag('open');
-                    }
-                    var el = document.getElementById(_key5 === 'country_code' || _key5 === 'contact_country_code' ? 'contact_number' : _key5);
-                    if (el) {
-                      setTimeout(function () {
-                        el.scrollIntoView({
-                          behavior: 'smooth',
-                          block: 'center'
-                        });
-                      }, 500);
-                      return "break";
-                    }
-                  }();
-                  if (_ret3 === "break") break;
+                  if (_key5 in passportInfoInput || _key5 in travelPreferenceInfo || _key5 in secureTravelInputInfo) {
+                    setAdditionalInfoFlag('open');
+                  }
+                  var el = document.getElementById(_key5 === 'country_code' || _key5 === 'contact_country_code' ? 'contact_number' : _key5);
+                  if (el) {
+                    setTimeout(function () {
+                      el.scrollIntoView({
+                        behavior: 'smooth',
+                        block: 'center'
+                      });
+                    }, 500);
+                    return "break";
+                  }
                 }
               }
+            };
+            for (var _key5 in err) {
+              var _ret3 = _loop3();
+              if (_ret3 === "break") break;
             }
           } else if (typeof err === 'string') {
             IUIToastMessageService$4.warningNotify(err);
@@ -6842,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_","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,
@@ -6911,7 +6962,7 @@ var BulkUploadModal = function BulkUploadModal(props) {
           file: doc
         });
       });
-      var _temp2 = _forTo(docs, function (i) {
+      var _temp = _forTo(docs, function (i) {
         return Promise.resolve(dispatch(uploadBulkUsersFile(docs[i]))).then(function (res) {
           return Promise.resolve(dispatch(validateUploadedFile(res.user_file_name)).then(function (validatedRes) {
             if (validatedRes.data.status) {
@@ -6951,7 +7002,7 @@ var BulkUploadModal = function BulkUploadModal(props) {
           })).then(function () {});
         });
       });
-      return Promise.resolve(_temp2 && _temp2.then ? _temp2.then(function () {}) : void 0);
+      return Promise.resolve(_temp && _temp.then ? _temp.then(function () {}) : void 0);
     } catch (e) {
       return Promise.reject(e);
     }
@@ -8328,9 +8379,9 @@ var StickyHeadTable = function StickyHeadTable(props) {
     cell: function cell(row) {
       return /*#__PURE__*/React__default.createElement(iuistyles.IUIBox, {
         component: "div",
-        width: 60
+        width: 80
       }, row && row.has_visited === 0 ? /*#__PURE__*/React__default.createElement(Tooltip, {
-        title: "This user hasn't logged on to the platform yet",
+        title: "This user hasn't logged in to the platform yet",
         arrow: true,
         classes: {
           arrow: classes.arrow,
@@ -8338,7 +8389,7 @@ var StickyHeadTable = function StickyHeadTable(props) {
         },
         placement: "top-start"
       }, /*#__PURE__*/React__default.createElement("div", {
-        className: clsx(styles$5.tooltipText)
+        className: clsx(styles$5.tooltipTextDiv)
       }, "Invited")) : null);
     }
   }, {
@@ -8439,7 +8490,7 @@ var StickyHeadTable = function StickyHeadTable(props) {
         options.push({
           label: 'Resend invite',
           handler: function handler() {
-            return toggleInviteModal(row.id, 'single');
+            return toggleInviteModal(row.id, 'single', row.first_name, row.last_name);
           }
         });
       }
@@ -8611,22 +8662,6 @@ var SingupRequests = function SingupRequests(props) {
   });
 };
 
-function InviteInfoIcon() {
-  return /*#__PURE__*/React__default.createElement("svg", {
-    xmlns: "http://www.w3.org/2000/svg",
-    width: "20",
-    height: "20",
-    fill: "none",
-    viewBox: "0 0 20 20"
-  }, /*#__PURE__*/React__default.createElement("path", {
-    fill: "#CA8A04",
-    d: "M11 5a1 1 0 11-2 0 1 1 0 012 0zM8 8a1 1 0 000 2h1v3H8a1 1 0 100 2h4a1 1 0 100-2h-1V9a1 1 0 00-1-1H8z"
-  }), /*#__PURE__*/React__default.createElement("path", {
-    fill: "#CA8A04",
-    d: "M0 10c0 5.522 4.477 10 10 10s10-4.478 10-10c0-5.523-4.477-10-10-10S0 4.477 0 10zm10-8a8 8 0 110 16 8 8 0 010-16z"
-  }));
-}
-
 function InfoYellowIcon(props) {
   return /*#__PURE__*/React__default.createElement("svg", {
     width: props.width,
@@ -8646,8 +8681,42 @@ function InfoYellowIcon(props) {
   }));
 }
 
+function RedWarningIcon(props) {
+  var _props$color = props.color,
+    color = _props$color === void 0 ? '#E11D48' : _props$color,
+    _props$size = props.size,
+    size = _props$size === void 0 ? '14' : _props$size;
+  return /*#__PURE__*/React__default.createElement("svg", {
+    width: size,
+    height: size,
+    viewBox: "0 0 14 14",
+    fill: color,
+    xmlns: "http://www.w3.org/2000/svg"
+  }, /*#__PURE__*/React__default.createElement("path", {
+    d: "M7 14C10.866 14 14 10.866 14 7C14 3.13401 10.866 0 7 0C3.13401 0 0 3.13401 0 7C0 10.866 3.13401 14 7 14ZM6 4C6 3.44772 6.44772 3 7 3C7.55229 3 8 3.44772 8 4V6C8 6.55229 7.55229 7 7 7C6.44772 7 6 6.55229 6 6V4ZM6 10C6 9.44771 6.44772 9 7 9C7.55229 9 8 9.44771 8 10C8 10.5523 7.55229 11 7 11C6.44772 11 6 10.5523 6 10Z",
+    fill: color
+  }));
+}
+
+function InviteInfoIcon() {
+  return /*#__PURE__*/React__default.createElement("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: "20",
+    height: "20",
+    fill: "none",
+    viewBox: "0 0 20 20"
+  }, /*#__PURE__*/React__default.createElement("path", {
+    fill: "#CA8A04",
+    d: "M11 5a1 1 0 11-2 0 1 1 0 012 0zM8 8a1 1 0 000 2h1v3H8a1 1 0 100 2h4a1 1 0 100-2h-1V9a1 1 0 00-1-1H8z"
+  }), /*#__PURE__*/React__default.createElement("path", {
+    fill: "#CA8A04",
+    d: "M0 10c0 5.522 4.477 10 10 10s10-4.478 10-10c0-5.523-4.477-10-10-10S0 4.477 0 10zm10-8a8 8 0 110 16 8 8 0 010-16z"
+  }));
+}
+
 var IUIToastMessageService$7 = utils.services.IUIToastMessageService;
-var env$7 = utils.configs.env;
+var env$7 = utils.configs.env,
+  api$7 = utils.configs.api;
 var UndoButton = function UndoButton(_ref) {
   var onUndo = _ref.onUndo,
     msg = _ref.msg;
@@ -8685,30 +8754,49 @@ var UserList = function UserList(_ref2) {
     isDataFetching = _useSelector.isDataFetching,
     deactivatedUsers = _useSelector.deactivatedUsers,
     tabValue = _useSelector.tabValue;
-  var _React$useState = React__default.useState(1),
-    page = _React$useState[0],
-    setPage = _React$useState[1];
-  var _useState = React.useState(10),
-    rowsPerPage = _useState[0],
-    setRowsPerPage = _useState[1];
-  var _React$useState2 = React__default.useState({}),
-    selected = _React$useState2[0],
-    setSelected = _React$useState2[1];
-  var _React$useState3 = React__default.useState('asc'),
-    order = _React$useState3[0],
-    setOrder = _React$useState3[1];
-  var _React$useState4 = React__default.useState(false),
-    deactivateSingle = _React$useState4[0],
-    setDeactivateSingle = _React$useState4[1];
-  var _React$useState5 = React__default.useState('first_name'),
-    orderBy = _React$useState5[0],
-    setOrderBy = _React$useState5[1];
-  var _useState2 = React.useState(''),
-    searchValue = _useState2[0],
-    setSearchValue = _useState2[1];
+  var newSelecteds = userListInfo.results;
+  var _React$useState = React__default.useState(''),
+    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),
-    isOpenDeActivateModal = _useState3[0],
-    setOpenDeActivateModalFlag = _useState3[1];
+    isBulkDeactivateModalOpen = _useState3[0],
+    setIsBulkDeactivateModalOpen = _useState3[1];
+  var _React$useState4 = React__default.useState(''),
+    user = _React$useState4[0],
+    setUser = _React$useState4[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];
+  var _React$useState6 = React__default.useState('asc'),
+    order = _React$useState6[0],
+    setOrder = _React$useState6[1];
+  var _React$useState7 = React__default.useState(false),
+    deactivateSingle = _React$useState7[0],
+    setDeactivateSingle = _React$useState7[1];
+  var _React$useState8 = React__default.useState('first_name'),
+    orderBy = _React$useState8[0],
+    setOrderBy = _React$useState8[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;
     }),
@@ -8716,42 +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),
-    isFileDownloading = _useState5[0],
-    setDownlStatus = _useState5[1];
-  var _useState6 = React.useState(false),
-    isSortingChange = _useState6[0],
-    setSortingChange = _useState6[1];
   var _useState7 = React.useState(false),
-    isSearchingChange = _useState7[0],
-    setSearchingChange = _useState7[1];
+    isOpenImportUsersModal = _useState7[0],
+    setOpenImportUsersModal = _useState7[1];
   var _useState8 = React.useState(false),
-    isSortingChangeTemp = _useState8[0],
-    setSortingChangeTemp = _useState8[1];
+    approveeStatus = _useState8[0],
+    setApproveeStatus = _useState8[1];
   var _useState9 = React.useState(false),
-    isSearchingChangeTemp = _useState9[0],
-    setSearchingChangeTemp = _useState9[1];
+    isFileDownloading = _useState9[0],
+    setDownlStatus = _useState9[1];
   var _useState10 = React.useState(false),
-    isApiFetching = _useState10[0],
-    setisApiFetching = _useState10[1];
-  var _useState11 = React.useState({
+    isSortingChange = _useState10[0],
+    setSortingChange = _useState10[1];
+  var _useState11 = React.useState(false),
+    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'
     }),
-    travelFYI = _useState11[0],
-    setTravelFYI = _useState11[1];
-  var _useState12 = React.useState(false),
-    showInviteModal = _useState12[0],
-    setToggleInviteModal = _useState12[1];
-  var _useState13 = React.useState(''),
-    userIds = _useState13[0],
-    setUserIds = _useState13[1];
-  var _React$useState6 = React__default.useState(false),
-    overlayMenu = _React$useState6[0],
-    setOverlayMenu = _React$useState6[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 _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;
@@ -8772,47 +8872,68 @@ var UserList = function UserList(_ref2) {
       behavior: 'smooth'
     });
   };
-  var _React$useState7 = React__default.useState(1),
-    signup_page = _React$useState7[0],
-    setSignUpPage = _React$useState7[1];
-  var _useState14 = React.useState(5),
-    signup_rowsPerPage = _useState14[0],
-    setSignUpRowsPerPage = _useState14[1];
-  var _React$useState8 = React__default.useState('asc'),
-    signup_order = _React$useState8[0],
-    setSignUpOrder = _React$useState8[1];
-  var _React$useState9 = React__default.useState('fname'),
-    signup_orderBy = _React$useState9[0],
-    setSignUpOrderBy = _React$useState9[1];
-  var _useState15 = React.useState(''),
-    signup_searchValue = _useState15[0],
-    set_signup_SearchValue = _useState15[1];
-  var _useState16 = React.useState(false),
-    isSignUpSortingChange = _useState16[0],
-    setSignUpSortingChange = _useState16[1];
-  var _useState17 = React.useState(false),
-    isSignUpSearchingChange = _useState17[0],
-    setSignUpSearchingChange = _useState17[1];
-  var _useState18 = React.useState(false),
-    isSignUpSortingChangeTemp = _useState18[0],
-    setSignUpSortingChangeTemp = _useState18[1];
-  var _useState19 = React.useState(false),
-    isSignUpSearchingChangeTemp = _useState19[0],
-    setSignUpSearchingChangeTemp = _useState19[1];
+  var _React$useState10 = React__default.useState(1),
+    signup_page = _React$useState10[0],
+    setSignUpPage = _React$useState10[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 _useState22 = React.useState(''),
+    signup_searchValue = _useState22[0],
+    set_signup_SearchValue = _useState22[1];
+  var _useState23 = React.useState(false),
+    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;
     }),
     signupRequestListInfo = _useSelector3.signupRequestListInfo;
+  var redirectToNotifications = function redirectToNotifications() {
+    history.push(config.routes.notification.path);
+  };
   var openDeactivateModal = function openDeactivateModal() {
     if (Object.values(selected).flat().length === 0 || Object.values(selected).flat() === undefined) {
       IUIToastMessageService$7.warningNotify('Select at least one user to deactivate.');
       return false;
     }
-    setOpenDeActivateModalFlag(true);
+    if (selectedUsersApprover.length) {
+      var _SelectedUsersNotApprover = [].concat(selectedUsersNotApprover);
+      var _SelectedUsersApprover = [].concat(selectedUsersApprover);
+      var _selected = Object.values(selected).flat();
+      _SelectedUsersNotApprover = _SelectedUsersNotApprover.filter(function (item) {
+        return _selected.includes(item.id.toString());
+      });
+      _SelectedUsersApprover = _SelectedUsersApprover.filter(function (item) {
+        return _selected.includes(item.id.toString());
+      });
+      setSelectedUsersNotApprover(_SelectedUsersNotApprover);
+      setSelectedUsersApprover(_SelectedUsersApprover);
+      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);
   };
@@ -8860,12 +8981,25 @@ var UserList = function UserList(_ref2) {
   };
   var deselectingCheckboxHandler = function deselectingCheckboxHandler(page) {
     var _extends2;
-    var newSelecteds = userListInfo.results.filter(function (n) {
+    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;
@@ -8892,49 +9026,145 @@ 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)) {
       selectedTemp[page] = [];
     }
     var selectedIndex = selectedTemp[page].indexOf(id);
-    var newSelected = [];
+    var _newSelected = [];
     if (selectedIndex === -1) {
-      newSelected = newSelected.concat(selectedTemp[page], id);
+      _newSelected = _newSelected.concat(selectedTemp[page], id);
     } else if (selectedIndex === 0) {
-      newSelected = newSelected.concat(selectedTemp[page].slice(1));
+      _newSelected = _newSelected.concat(selectedTemp[page].slice(1));
     } else if (selectedIndex === selectedTemp[page].length - 1) {
-      newSelected = newSelected.concat(selectedTemp[page].slice(0, -1));
+      _newSelected = _newSelected.concat(selectedTemp[page].slice(0, -1));
     } else if (selectedIndex > 0) {
-      newSelected = newSelected.concat(selectedTemp[page].slice(0, selectedIndex), selectedTemp[page].slice(selectedIndex + 1));
+      _newSelected = _newSelected.concat(selectedTemp[page].slice(0, selectedIndex), selectedTemp[page].slice(selectedIndex + 1));
     }
-    setSelected(_extends({}, selected, (_extends4 = {}, _extends4[page] = newSelected, _extends4)));
+    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 () {
+    setApproverRole({
+      value: '',
+      label: 'Select approver'
+    });
+    setDefaultId(null);
+    setIsDisabledSubmitBtn(true);
+    setApproveeStatus(false);
+    if (deactivateSingle === 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]);
   var handleChangeRowsPerPage = function handleChangeRowsPerPage(event) {
     setRowsPerPage(+event.target.value);
     setPage(1);
     setSelected({});
+    setSelectedUsersNotApprover([]);
+    setSelectedUsersApprover([]);
     setSortingChange(true);
     setSortingChangeTemp(!isSortingChangeTemp);
   };
   var handleActiveUser = function handleActiveUser(e, id, page) {
     var isActive = e.target.checked;
-    dispatch(updateActiveStatus(e.target.checked ? 1 : 0, e.target.id)).then(function () {
-      if (!isActive) {
-        if (Object.values(selected).flat().includes(id.toString())) {
-          var _extends5;
-          var selectedTemp = _extends({}, selected);
-          selectedTemp[page].splice(selectedTemp[page].indexOf(id.toString()), 1);
-          setSelected(_extends({}, selected, (_extends5 = {}, _extends5[page] = selectedTemp[page], _extends5)));
+    var _isApprover;
+    newSelecteds.map(function (item) {
+      if (item.id === id) {
+        _isApprover = item.roles.is_approver;
+        if (_isApprover === true && isActive === false) {
+          setDeactivateSingle(true);
+          setDeactivateUser(item.first_name + ' ' + item.last_name);
+          setUser(item);
+        } else {
+          dispatch(updateActiveStatus(e.target.checked ? 1 : 0, e.target.id, _isApprover)).then(function () {
+            if (!isActive) {
+              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);
+              }
+            }
+          });
         }
       }
     });
   };
+  var selectApprover = function selectApprover(_ref4) {
+    var _value = _ref4._value;
+    if (_value.data.approvee_status) {
+      setApproveeStatus(true);
+    } else {
+      setApproveeStatus(false);
+    }
+    setDefaultId(_value.data.id);
+    setApproverRole(_value);
+    setIsDisabledSubmitBtn(false);
+  };
+  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);
@@ -8951,13 +9181,19 @@ var UserList = function UserList(_ref2) {
       email: email
     }));
   };
-  var toggleInviteModal = function toggleInviteModal(ids, type) {
-    console.log(type);
-    if (!type && (Object.values(selected).flat().length === 0 || Object.values(selected).flat() === undefined)) {
-      IUIToastMessageService$7.warningNotify('Select at least one user to invite.');
-      return false;
+  var toggleInviteModal = function toggleInviteModal(ids, type, firstName, lastName) {
+    if (type === undefined) {
+      if (Object.values(selected).flat().length === 0 || Object.values(selected).flat() === undefined) {
+        IUIToastMessageService$7.warningNotify('Select at least one user to invite.');
+        return false;
+      }
     }
     setUserIds(ids);
+    setUserFirstName(firstName);
+    setUserLastName(lastName);
+    setToggleInviteModal(!showInviteModal);
+  };
+  var toggleInviteModalClose = function toggleInviteModalClose() {
     setToggleInviteModal(!showInviteModal);
   };
   var onResendInviteHandler = function onResendInviteHandler() {
@@ -9030,6 +9266,9 @@ var UserList = function UserList(_ref2) {
       userId: userId
     }));
   };
+  var knowMore = function knowMore() {
+    window.open('https://itilite.notion.site/All-about-deactivating-users-77554de1fb494832ac7e344ca14277f0', '_blank');
+  };
   var dispatch = reactRedux.useDispatch();
   React.useEffect(function () {
     if (isTokenVerified === true) {
@@ -9281,7 +9520,10 @@ var UserList = function UserList(_ref2) {
       }, /*#__PURE__*/React__default.createElement(iuistyles.IUITypography, {
         variant: "body2",
         className: clsx(styles$5.description)
-      }, "Verify and add users to allow them to start using ITILITE. Set up preferences for receiving sign up request updates in Notifications.")), /*#__PURE__*/React__default.createElement(SingupRequests, {
+      }, "Verify and add users to allow them to start using ITILITE. Set up preferences for receiving sign up request updates in", ' ', /*#__PURE__*/React__default.createElement("span", {
+        onClick: config.routes.notification && redirectToNotifications,
+        className: clsx(config.routes.notification && 'iui__cursor-pointer iui__border--bottom_solid_black500-1')
+      }, "Notifications"))), /*#__PURE__*/React__default.createElement(SingupRequests, {
         data: signupRequestListInfo,
         handleChangeRowsPerPage: function handleChangeRowsPerPage(event) {
           setSignUpRowsPerPage(+event.target.value);
@@ -9319,76 +9561,48 @@ 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: true
+    isDisabledSubmitBtn: isDisabledSubmitBtn,
+    modalClass: "deactivateSingleModal",
+    modalBodyStyle: {
+      overflowY: 'unset'
+    }
   }, /*#__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, "Anvesh Dunna"), " 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__mb-15 iui__mt-15"
-  }, /*#__PURE__*/React__default.createElement(iuistyles.IUIAsyncSelect, {
-    isMove: true,
-    additional: {
-      page: 1,
-      product: 'travel',
-      placeholder: 'Select a user'
-    },
-    placeHolderCheck: travelFYI !== undefined && travelFYI.value === '',
-    label: "Transfer admin role to",
-    value: travelFYI,
-    onValueChange: function onValueChange(_ref4) {
-      var _value = _ref4._value;
-      return setTravelFYI(_value);
-    },
-    loadOption: approversOptions,
-    disableText: "Please get in touch with your administrator to change this value."
-  })), /*#__PURE__*/React__default.createElement(iuistyles.IUITypography, {
-    className: clsx('iui__mb-5', styles$5.departmentHeadText)
-  }, "Anvesh Dunna is the department head for: Product Design."), /*#__PURE__*/React__default.createElement(iuistyles.IUIBox, {
-    className: "iui__mb-15"
-  }, /*#__PURE__*/React__default.createElement(iuistyles.IUIAsyncSelect, {
-    isMove: true,
-    additional: {
-      page: 1,
-      product: 'travel',
-      placeholder: 'Select a user'
-    },
-    placeHolderCheck: travelFYI !== undefined && travelFYI.value === '',
-    label: "Transfer department head role to",
-    value: travelFYI,
-    onValueChange: function onValueChange(_ref5) {
-      var _value = _ref5._value;
-      return setTravelFYI(_value);
-    },
-    loadOption: approversOptions,
-    disableText: "Please get in touch with your administrator to change this value."
-  })), /*#__PURE__*/React__default.createElement(iuistyles.IUIBox, {
-    className: "iui__mb-15"
+  }), /*#__PURE__*/React__default.createElement(iuistyles.IUITypography, {
+    variant: "body2"
+  }, /*#__PURE__*/React__default.createElement("b", null, deactivateUser), " is linked with following role. You can deactivate only once you transfer the role to another user. The changes will reflect subsequently.", ' ', /*#__PURE__*/React__default.createElement("span", {
+    onClick: knowMore,
+    className: "iui__cursor-pointer iui__border--bottom_solid_black500-1"
+  }, "Know more"))), /*#__PURE__*/React__default.createElement(iuistyles.IUIBox, {
+    className: "iui__mt-15"
   }, /*#__PURE__*/React__default.createElement(iuistyles.IUIAsyncSelect, {
     isMove: true,
     additional: {
       page: 1,
       product: 'travel',
-      placeholder: 'Select a user'
+      userId: user.id
     },
-    placeHolderCheck: travelFYI !== undefined && travelFYI.value === '',
     label: "Transfer approver role to",
-    value: travelFYI,
-    onValueChange: function onValueChange(_ref6) {
-      var _value = _ref6._value;
-      return setTravelFYI(_value);
-    },
-    loadOption: approversOptions,
-    disableText: "Please get in touch with your administrator to change this value."
-  })))), /*#__PURE__*/React__default.createElement(iuistyles.IUIModal, {
+    value: approverRole,
+    onValueChange: selectApprover,
+    loadOption: transferRoleOptions,
+    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, {
+    className: "iui__font--para-normal iui__font--color-black500 iui__mt-5 iui__ml-5"
+  }, "The user you're deactivating is the approver of the user you're transferring the role to. If you continue, this user will become a self-approver"))))), /*#__PURE__*/React__default.createElement(iuistyles.IUIModal, {
     isOpen: Object.values(selected).flat().length > 0 && isOpenDeActivateModal,
     closeHandler: closeDeActivateModal,
     cancelLabel: "Cancel",
@@ -9415,8 +9629,85 @@ 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",
+    isDisabledSubmitBtn: !((selectedUsersNotApprover === null || selectedUsersNotApprover === void 0 ? void 0 : selectedUsersNotApprover.length) > 0),
+    submitBtnClass: clsx(styles$5.deactivateSubmitBtn),
+    customButtonLabel: "Deactivate all users",
+    customButtonHandler: handleDeactivateUsers,
+    submitHandler: handleDeactivateSafeUsers,
+    width: "640px",
+    customButtonClass: clsx(styles$5.deactivateCustomButtonClass),
+    headerText: "Deactivate users?",
+    modalBodyStyle: {
+      maxHeight: 'calc(100vh - 50vh)'
+    }
+  }, /*#__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, {
+    variant: "body2"
+  }, "Some users are linked with approval roles. Deactivating these users will result in missing roles and approvers. Deactivate these users individually and transfer their roles to avoid missing roles. The changes will reflect subsequently.", ' ', /*#__PURE__*/React__default.createElement("span", {
+    onClick: knowMore,
+    className: "iui__cursor-pointer iui__border--bottom_solid_black500-1"
+  }, "Know more"))), /*#__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 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: toggleInviteModal,
+    closeHandler: function closeHandler() {
+      return toggleInviteModalClose();
+    },
     cancelLabel: "Cancel",
     headerText: "Resend Invites?",
     submitLabel: "Send",
@@ -9448,7 +9739,13 @@ var UserList = function UserList(_ref2) {
       fontSize: '14px',
       color: '#374151'
     }
-  }, "This invitation will be sent to users who have not logged into the platform."))), /*#__PURE__*/React__default.createElement(BulkUploadModal, {
+  }, "This invitation will be sent to", ' ', /*#__PURE__*/React__default.createElement("span", {
+    style: {
+      fontSize: '14px',
+      color: '#374151',
+      fontWeight: 'bold'
+    }
+  }, userFirstName != null ? userFirstName + " " + userLastName : 'selected users'), ", who have not logged into the platform."))), /*#__PURE__*/React__default.createElement(BulkUploadModal, {
     isOpenImportUsersModal: isOpenImportUsersModal,
     closeImportUsersModal: closeImportUsersModal,
     closeImportModal: closeImportModal
@@ -9457,8 +9754,8 @@ var UserList = function UserList(_ref2) {
     errMsg: hasVerificationError
   }));
 };
-var TabLabelCount = function TabLabelCount(_ref7) {
-  var count = _ref7.count;
+var TabLabelCount = function TabLabelCount(_ref5) {
+  var count = _ref5.count;
   return /*#__PURE__*/React__default.createElement(iuistyles.IUIBox, {
     className: styles$5.TabLabelCount
   }, " ", count, " ");