@itilite/iui-user-management 1.0.0 → 1.0.2

package/dist/index.modern.js

@@ -1,4 +1,4 @@
-import { IUIAsyncSelect, IUIBox, IUILabel, IUIFileUpload, IUICheckboxButton, IUIPhone, IUISelect, IUIDatePicker, IUIInput, IUIDivider, IUIGrid, IUITypography, IUIRadio, IUIButton, IUIModal, IUIAccordion, IUIAccordionSummary, IUIAccordionDetails, IUIIconButton, IUICard, IUIBackdrop, IUICircularProgress, IUIBreadCrumb, IUIDropzone, IUIStepper, IUIFormControlLabel, IUICheckBox, IUIPrimaryRadio, IUITable, IUISkeleton, IUIProfileBox, IUIFormGroup, IUIDropdownButton, IUITabs } from '@itilite/iuistyles';
+import { IUIAsyncSelect, IUIBox, IUILabel, IUIFileUpload, IUICheckboxButton, IUIPhone, IUISelect, IUIDatePicker, IUIInput, IUIDivider, IUIGrid, IUITypography, IUIRadio, IUIButton, IUIModal, IUIAccordion, IUIAccordionSummary, IUIAccordionDetails, IUIIconButton, IUICard, IUIBackdrop, IUICircularProgress, IUIBreadCrumb, IUIDropzone, IUIStepper, IUIFormControlLabel, IUICheckBox, IUIPrimaryRadio, IUITable, IUISkeleton, IUIProfileBox, IUIFormGroup, IUISearch, IUIDropdownButton, IUITabs } from '@itilite/iuistyles';
 import React, { useState, useEffect, useRef, Fragment as Fragment$1 } from 'react';
 import { configs, services, utilUrls } from '@itilite/utils';
 import axios from 'axios';
@@ -14,7 +14,8 @@ import { withStyles } from '@material-ui/core/styles';
 import Switch from '@material-ui/core/Switch';
 import MoreHorizIcon from '@material-ui/icons/MoreHoriz';
 import Button from '@material-ui/core/Button';
-import { Popper, Grow, Paper, ClickAwayListener, MenuList, MenuItem, Typography } from '@material-ui/core';
+import { Popper, Grow, Paper, ClickAwayListener, MenuList, MenuItem, Typography, Box } from '@material-ui/core';
+import { useScrollPosition } from '@n8tb1t/use-scroll-position';
 
 function _extends() {
   _extends = Object.assign ? Object.assign.bind() : function (target) {
@@ -67,7 +68,6 @@ var _Pact = /*#__PURE__*/function () {
   };
   return _Pact;
 }();
-
 function _settle(pact, state, value) {
   if (!pact.s) {
     if (value instanceof _Pact) {
@@ -96,7 +96,6 @@ function _settle(pact, state, value) {
 function _isSettledPact(thenable) {
   return thenable instanceof _Pact && thenable.s & 1;
 }
-
 function _forTo(array, body, check) {
   var i = -1,
     pact,
@@ -128,7 +127,6 @@ function _forTo(array, body, check) {
 }
 var _iteratorSymbol = /*#__PURE__*/typeof Symbol !== "undefined" ? Symbol.iterator || (Symbol.iterator = Symbol("Symbol.iterator")) : "@@iterator";
 var _asyncIteratorSymbol = /*#__PURE__*/typeof Symbol !== "undefined" ? Symbol.asyncIterator || (Symbol.asyncIterator = Symbol("Symbol.asyncIterator")) : "@@asyncIterator";
-
 function _catch(body, recover) {
   try {
     var result = body();
@@ -466,7 +464,6 @@ var NAoptionConfig = {
   },
   applyFor: ['employee_level', 'department']
 };
-
 var commonLoadOptions = function commonLoadOptions(search, loadedOptions, _ref) {
   var page = _ref.page,
     tabelName = _ref.tabelName,
@@ -663,7 +660,6 @@ var countryOptions = function countryOptions(search, loadedOptions, _ref5) {
             label: item[tabelName]
           };
         });
-
         return {
           options: mappedValue,
           hasMore: !!response.next,
@@ -765,7 +761,6 @@ var formatCreateUserPayload = function formatCreateUserPayload(payload) {
   if (userTags.length) {
     res.user_tags = userTags;
   }
-
   if (payload.productAccess.travel) {
     var _payload$passportInfo, _payload$passportInfo2, _payload$passportInfo3, _payload$passportInfo4, _payload$membershipIn, _payload$uploadedFile;
     res.approvers.travel = [];
@@ -777,14 +772,12 @@ var formatCreateUserPayload = function formatCreateUserPayload(payload) {
         });
       }
     }
-
     if (payload.travelFYI && payload.travelFYI.value) {
       res.approvers.travel.push({
         email: payload.travelFYI.value,
         sequence: 'fyi'
       });
     }
-
     res.user_travel_info = {
       passport_issue_country: payload !== null && payload !== void 0 && (_payload$passportInfo = payload.passportInfoInput) !== null && _payload$passportInfo !== void 0 && (_payload$passportInfo2 = _payload$passportInfo.passport_issue_country) !== null && _payload$passportInfo2 !== void 0 && _payload$passportInfo2.value ? payload.passportInfoInput.passport_issue_country.value : null,
       nationality: payload !== null && payload !== void 0 && (_payload$passportInfo3 = payload.passportInfoInput) !== null && _payload$passportInfo3 !== void 0 && (_payload$passportInfo4 = _payload$passportInfo3.nationality) !== null && _payload$passportInfo4 !== void 0 && _payload$passportInfo4.value ? payload.passportInfoInput.nationality.value : null,
@@ -823,7 +816,6 @@ var formatCreateUserPayload = function formatCreateUserPayload(payload) {
       res.files = [];
     }
   }
-
   if (payload.productAccess.expense) {
     res.approvers.expense = [];
     for (var _key2 in payload.expenseApproversInput) {
@@ -834,7 +826,6 @@ var formatCreateUserPayload = function formatCreateUserPayload(payload) {
         });
       }
     }
-
     if (payload.expenseFYI && payload.expenseFYI.value) {
       res.approvers.expense.push({
         email: payload.expenseFYI.value,
@@ -942,7 +933,6 @@ var formatUpdateUserPayload = function formatUpdateUserPayload(payload, inputCha
           });
         }
       }
-
       if (payload.travelFYI && payload.travelFYI.value) {
         res.fields.approvers.travel.push({
           email: payload.travelFYI.value,
@@ -1019,7 +1009,6 @@ var formatUpdateUserPayload = function formatUpdateUserPayload(payload, inputCha
       res.fields.user_travel_info.redress_number = payload.secureTravelInputInfo.redress_number || null;
     }
   }
-
   if (payload.productAccess.expense) {
     if (!env$1.isProfilePage()) {
       res.fields.approvers.expense = [];
@@ -1031,7 +1020,6 @@ var formatUpdateUserPayload = function formatUpdateUserPayload(payload, inputCha
           });
         }
       }
-
       if (payload.expenseFYI && payload.expenseFYI.value) {
         res.fields.approvers.expense.push({
           email: payload.expenseFYI.value,
@@ -1485,17 +1473,13 @@ var uploadSingleDocumnet = function uploadSingleDocumnet(payload) {
     });
   };
 };
-
 var uploadFileToS3 = function uploadFileToS3(presignedPostData, file) {
   return new Promise(function (resolve, reject) {
     var formData = new FormData();
-
     Object.keys(presignedPostData.fields).forEach(function (key) {
       formData.append(key, presignedPostData.fields[key]);
     });
-
     formData.append('file', file);
-
     axios.post(presignedPostData.url, formData, {
       headers: {
         'Content-Type': 'multipart/form-data'
@@ -1777,7 +1761,6 @@ var getUserPanalData = function getUserPanalData(params) {
     });
   };
 };
-
 var addRecord = function addRecord(tableName, data, getParam) {
   return function (dispatch) {
     return new Promise(function (resolve, reject) {
@@ -2321,7 +2304,6 @@ var TravelExpenseFields = function TravelExpenseFields(props) {
       setOpenEditAproverModalFlag(false);
     });
   };
-
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(IUIGrid, {
     container: true,
     className: (styles.headingPadding)
@@ -2469,8 +2451,7 @@ var TravelExpenseFields = function TravelExpenseFields(props) {
     headerText: "Edit approver field",
     cancelLabel: "Cancel",
     submitLabel: "Save",
-    submitHandler: handleEditAproverLabel
-    ,
+    submitHandler: handleEditAproverLabel,
     width: "420px",
     modalBodyStyle: {
       maxHeight: '600px',
@@ -3025,31 +3006,6 @@ var workInfo = [{
     minLength: 0
   },
   disableText: 'Please get in touch with your administrator to change this value.'
-}, {
-  id: 7,
-  label: 'Manager',
-  name: 'manager',
-  required: false,
-  type: 'async_select',
-  fullWidth: false,
-  visibility: true,
-  readOnly: false,
-  placeholder: 'Select manager',
-  tabelName: 'manager',
-  product: 'travel',
-  loadOption: approversOptions
-}, {
-  id: 8,
-  label: 'Skip manager',
-  name: 'skip manager',
-  required: false,
-  type: 'async_select',
-  fullWidth: false,
-  visibility: true,
-  readOnly: false,
-  placeholder: 'Select manager',
-  product: 'travel',
-  loadOption: approversOptions
 }, {
   id: 9,
   label: 'Base location',
@@ -3885,7 +3841,6 @@ var reducer$1 = function reducer(state, action) {
             _userListInfo.results[i].is_active = action.payload.is_active;
           }
         });
-
         var _deactivatedUsers = _userListInfo.results.length > 0 ? _userListInfo.results.filter(function (val) {
           return !val.is_active;
         }).map(function (obj) {
@@ -3908,7 +3863,6 @@ var reducer$1 = function reducer(state, action) {
             }
           });
         });
-
         var _deactivatedUsers2 = _userListInfo2.results.length > 0 ? _userListInfo2.results.filter(function (val) {
           return !val.is_active;
         }).map(function (obj) {
@@ -4217,8 +4171,7 @@ var rootReducer = combineReducers({
   customFields: reducer$5
 });
 
-var store = createStore(rootReducer, composeWithDevTools(applyMiddleware(thunk)
-));
+var store = createStore(rootReducer, composeWithDevTools(applyMiddleware(thunk)));
 
 function withStore(Component) {
   function WrappedComponent(props) {
@@ -4761,8 +4714,7 @@ function AddPanelDialog(_ref) {
     flexDirection: "column",
     padding: "8px 20px"
   }, /*#__PURE__*/React.createElement(IUIInput, {
-    label: name + " name"
-    ,
+    label: name + " name",
     name: "name",
     defaultValue: "",
     onValueChange: onValueChange,
@@ -4846,7 +4798,6 @@ var UserAddEdit = function UserAddEdit(props) {
     }
     setProductAccess(_productAccess);
   };
-
   var _useState2 = useState({
       first_name: '',
       last_name: '',
@@ -5095,7 +5046,7 @@ var UserAddEdit = function UserAddEdit(props) {
       dispatch(submitAddModalData(addModalData.id, {
         names: [validatedValue]
       })).then(function (res) {
-        var _extends2;
+        var _extends2, _extends3;
         setAddModalData(_extends({}, addModalData, {
           isOpen: false
         }));
@@ -5105,10 +5056,11 @@ var UserAddEdit = function UserAddEdit(props) {
           value: res.data.value,
           label: res.data.label
         }, _extends2)));
+        updateInputChangeLog(_extends({}, inputChangeLog, (_extends3 = {}, _extends3[tempKey] = true, _extends3)));
         asyncSelectRefs.current[tempKey].current.blur();
         clearCacheForAsyncDropdown(function (prevState) {
-          var _extends3;
-          return _extends({}, prevState, (_extends3 = {}, _extends3[tempKey] = prevState[tempKey] + 1, _extends3));
+          var _extends4;
+          return _extends({}, prevState, (_extends4 = {}, _extends4[tempKey] = prevState[tempKey] + 1, _extends4));
         });
         dispatch(stopLoader());
       });
@@ -5127,8 +5079,8 @@ var UserAddEdit = function UserAddEdit(props) {
     try {
       var _temp6 = function _temp6() {
         if (Object.hasOwnProperty.call(inputChangeLog, _name)) {
-          var _extends4;
-          updateInputChangeLog(_extends({}, inputChangeLog, (_extends4 = {}, _extends4[_name] = true, _extends4)));
+          var _extends5;
+          updateInputChangeLog(_extends({}, inputChangeLog, (_extends5 = {}, _extends5[_name] = true, _extends5)));
         }
       };
       var _name = args._name,
@@ -5151,8 +5103,8 @@ var UserAddEdit = function UserAddEdit(props) {
           updateError('contact_country_code', _isError, _errorMsg);
         } else {
           var _temp8 = function _temp8() {
-            var _extends5;
-            setPersonalInfoInput(_extends({}, personalInfoInput, (_extends5 = {}, _extends5[_name] = _value, _extends5)));
+            var _extends6;
+            setPersonalInfoInput(_extends({}, personalInfoInput, (_extends6 = {}, _extends6[_name] = _value, _extends6)));
             updateError(_name, _isError, _errorMsg);
           };
           var _temp9 = function () {
@@ -5200,16 +5152,20 @@ var UserAddEdit = function UserAddEdit(props) {
     }
   };
   var onEmployeeInfoChange = function onEmployeeInfoChange(args) {
-    var _extends6;
+    var _extends7;
     var _name = args._name,
       _value = args._value,
       _isError = args._isError,
       _errorMsg = args._errorMsg;
-    setEmployeeInfoInput(_extends({}, employeeInfoInput, (_extends6 = {}, _extends6[_name] = _value, _extends6)));
+    console.log({
+      _name: _name,
+      _value: _value
+    });
+    setEmployeeInfoInput(_extends({}, employeeInfoInput, (_extends7 = {}, _extends7[_name] = _value, _extends7)));
     updateError(_name, _isError, _errorMsg);
     if (Object.hasOwnProperty.call(inputChangeLog, _name)) {
-      var _extends7;
-      updateInputChangeLog(_extends({}, inputChangeLog, (_extends7 = {}, _extends7[_name] = true, _extends7)));
+      var _extends8;
+      updateInputChangeLog(_extends({}, inputChangeLog, (_extends8 = {}, _extends8[_name] = true, _extends8)));
     }
   };
   var getUserTagTypeId = function getUserTagTypeId(name) {
@@ -5219,9 +5175,9 @@ var UserAddEdit = function UserAddEdit(props) {
     return tag.id;
   };
   var onUserTagTypeChange = function onUserTagTypeChange(args) {
-    var _extends8;
+    var _extends9;
     var e = args._event;
-    setUserTagType(_extends({}, userTagType, (_extends8 = {}, _extends8[e.target.name] = userTagType[e.target.name] ? false : getUserTagTypeId(e.target.name), _extends8)));
+    setUserTagType(_extends({}, userTagType, (_extends9 = {}, _extends9[e.target.name] = userTagType[e.target.name] ? false : getUserTagTypeId(e.target.name), _extends9)));
     if (Object.hasOwnProperty.call(inputChangeLog, 'userTagType')) {
       updateInputChangeLog(_extends({}, inputChangeLog, {
         userTagType: true
@@ -5229,30 +5185,26 @@ var UserAddEdit = function UserAddEdit(props) {
     }
   };
   var onCustomFieldsChange = function onCustomFieldsChange(_ref2) {
-    var _extends9;
+    var _extends10;
     var _name = _ref2._name,
       _value = _ref2._value;
-    setCustomFieldsInput(_extends({}, customFieldsInput, (_extends9 = {}, _extends9[_name] = _value, _extends9)));
+    setCustomFieldsInput(_extends({}, customFieldsInput, (_extends10 = {}, _extends10[_name] = _value, _extends10)));
   };
   var onTravelApproversInputChange = function onTravelApproversInputChange(_ref3) {
-    var _extends10;
+    var _extends11;
     var _name = _ref3._name,
       _value = _ref3._value;
-    setTravelApproversInput(_extends({}, travelApproversInput, (_extends10 = {}, _extends10[_name] = _value, _extends10)));
+    setTravelApproversInput(_extends({}, travelApproversInput, (_extends11 = {}, _extends11[_name] = _value, _extends11)));
   };
   var onExpenseApproversInputChange = function onExpenseApproversInputChange(_ref4) {
-    var _extends11;
+    var _extends12;
     var _name = _ref4._name,
       _value = _ref4._value;
-    setExpenseApproversInput(_extends({}, expenseApproversInput, (_extends11 = {}, _extends11[_name] = _value, _extends11)));
+    setExpenseApproversInput(_extends({}, expenseApproversInput, (_extends12 = {}, _extends12[_name] = _value, _extends12)));
   };
   var onMemInfoInputChange = function onMemInfoInputChange(index, key, val) {
     var _membershipInfoInput = [].concat(membershipInfoInput);
-    if (_membershipInfoInput[index].membership_type === 'flight' && key === 'name') {
-      _membershipInfoInput[index][key] = val.label;
-    } else {
-      _membershipInfoInput[index][key] = val;
-    }
+    _membershipInfoInput[index][key] = val;
     _membershipInfoInput[index].isEditMode = isEditMode;
     setMembershipInfoInput(_membershipInfoInput);
   };
@@ -5282,39 +5234,39 @@ var UserAddEdit = function UserAddEdit(props) {
     setMembershipInfoInput(_membershipInfoInputTemp);
   };
   var travelPreferenceOnChange = function travelPreferenceOnChange(args) {
-    var _extends12;
+    var _extends13;
     var _name = args._name,
       _value = args._value,
       _isError = args._isError,
       _errorMsg = args._errorMsg;
-    settravelPreferenceInfo(_extends({}, travelPreferenceInfo, (_extends12 = {}, _extends12[_name] = _value, _extends12)));
+    settravelPreferenceInfo(_extends({}, travelPreferenceInfo, (_extends13 = {}, _extends13[_name] = _value, _extends13)));
     if (Object.hasOwnProperty.call(inputChangeLog, _name)) {
-      var _extends13;
-      updateInputChangeLog(_extends({}, inputChangeLog, (_extends13 = {}, _extends13[_name] = true, _extends13)));
+      var _extends14;
+      updateInputChangeLog(_extends({}, inputChangeLog, (_extends14 = {}, _extends14[_name] = true, _extends14)));
     }
     updateError(_name, _isError, _errorMsg);
   };
   var onSecureTraveelerInfoInputChange = function onSecureTraveelerInfoInputChange(args) {
-    var _extends14;
+    var _extends15;
     var _name = args._name,
       _value = args._value,
       _isError = args._isError,
       _errorMsg = args._errorMsg;
-    setSecureTravelInputInfo(_extends({}, secureTravelInputInfo, (_extends14 = {}, _extends14[_name] = _value, _extends14)));
+    setSecureTravelInputInfo(_extends({}, secureTravelInputInfo, (_extends15 = {}, _extends15[_name] = _value, _extends15)));
     if (Object.hasOwnProperty.call(inputChangeLog, _name)) {
-      var _extends15;
-      updateInputChangeLog(_extends({}, inputChangeLog, (_extends15 = {}, _extends15[_name] = true, _extends15)));
+      var _extends16;
+      updateInputChangeLog(_extends({}, inputChangeLog, (_extends16 = {}, _extends16[_name] = true, _extends16)));
     }
     updateError(_name, _isError, _errorMsg);
   };
   var onPassportInfoInputChange = function onPassportInfoInputChange(args) {
     try {
       var _temp14 = function _temp14() {
-        var _extends16;
-        setPassportInfoInput(_extends({}, passportInfoInput, (_extends16 = {}, _extends16[_name] = _value, _extends16)));
+        var _extends17;
+        setPassportInfoInput(_extends({}, passportInfoInput, (_extends17 = {}, _extends17[_name] = _value, _extends17)));
         if (Object.hasOwnProperty.call(inputChangeLog, _name)) {
-          var _extends17;
-          updateInputChangeLog(_extends({}, inputChangeLog, (_extends17 = {}, _extends17[_name] = true, _extends17)));
+          var _extends18;
+          updateInputChangeLog(_extends({}, inputChangeLog, (_extends18 = {}, _extends18[_name] = true, _extends18)));
         }
         updateError(_name, _isError, _errorMsg);
       };
@@ -5420,8 +5372,8 @@ var UserAddEdit = function UserAddEdit(props) {
       return _errorArray;
     });
     setErrorMsgs(function (prevState) {
-      var _extends18;
-      return _extends({}, prevState, (_extends18 = {}, _extends18[_name] = _errorMsg, _extends18));
+      var _extends19;
+      return _extends({}, prevState, (_extends19 = {}, _extends19[_name] = _errorMsg, _extends19));
     });
   };
   var dispatch = useDispatch();
@@ -5680,7 +5632,6 @@ var UserAddEdit = function UserAddEdit(props) {
               required: true
             }
           }));
-
           var _productAccess = _extends({}, productAccess);
           renderFields.products.forEach(function (product) {
             _productAccess[product.name] = true;
@@ -5877,8 +5828,7 @@ var UserAddEdit = function UserAddEdit(props) {
           }
           _errorMsgs.passport_issue_date = '';
         }
-        if (passportInfoInput.passport_photo.length === 0 && userTravelInfo.file_name === false &&
-        fieldsVisibility.user_travel_info.file_name !== 2) {
+        if (passportInfoInput.passport_photo.length === 0 && userTravelInfo.file_name === false && fieldsVisibility.user_travel_info.file_name !== 2) {
           _isError = true;
           if (_errorArray.indexOf('passport_photo') === -1) {
             _errorArray.push('passport_photo');
@@ -5890,8 +5840,7 @@ var UserAddEdit = function UserAddEdit(props) {
           }
           _errorMsgs.passport_photo = '';
         }
-        if (passportInfoInput.travel_docs.length === 0 && userTravelInfo.file_name === false &&
-        fieldsVisibility.user_travel_info.file_name !== 2) {
+        if (passportInfoInput.travel_docs.length === 0 && userTravelInfo.file_name === false && fieldsVisibility.user_travel_info.file_name !== 2) {
           _isError = true;
           if (_errorArray.indexOf('travel_docs') === -1) {
             _errorArray.push('travel_docs');
@@ -5941,6 +5890,8 @@ var UserAddEdit = function UserAddEdit(props) {
             var _config$routes2, _config$routes2$users, _config$routes2$users2;
             (config === null || config === void 0 ? void 0 : (_config$routes2 = config.routes) === null || _config$routes2 === void 0 ? void 0 : (_config$routes2$users = _config$routes2.users) === null || _config$routes2$users === void 0 ? void 0 : (_config$routes2$users2 = _config$routes2$users.list) === null || _config$routes2$users2 === void 0 ? void 0 : _config$routes2$users2.path) && history.push(config.routes.users.list.path);
           }
+          setFilesForDelete([]);
+          setProfilePicDelete([]);
         })["catch"](function (err) {
           if (typeof err === 'object') {
             if (err.country_code) {
@@ -6049,8 +6000,7 @@ var UserAddEdit = function UserAddEdit(props) {
           window.location.href = config.routes.profile.redirectUrl.cancel;
         }
       }
-    }
-    else {
+    } else {
       var _config$routes4, _config$routes4$users, _config$routes4$users2;
       (config === null || config === void 0 ? void 0 : (_config$routes4 = config.routes) === null || _config$routes4 === void 0 ? void 0 : (_config$routes4$users = _config$routes4.users) === null || _config$routes4$users === void 0 ? void 0 : (_config$routes4$users2 = _config$routes4$users.list) === null || _config$routes4$users2 === void 0 ? void 0 : _config$routes4$users2.path) && history.push(config.routes.users.list.path);
     }
@@ -6083,7 +6033,6 @@ var UserAddEdit = function UserAddEdit(props) {
               var months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
               return dt.getDate() + " " + months[dt.getMonth()] + " " + dt.getFullYear();
             }(),
-
             gender: function () {
               if (res.gender === 'male') return 'Male';else if (res.gender === 'female') return 'Female';else if (res.gender === 'others') return 'Others';else return '';
             }()
@@ -6128,7 +6077,6 @@ var UserAddEdit = function UserAddEdit(props) {
             }()
           });
         });
-
         if (res.client_admin) {
           setTravelApproversInput(function (prevState) {
             var nextState = _extends({}, prevState);
@@ -6162,7 +6110,6 @@ var UserAddEdit = function UserAddEdit(props) {
       });
     }
   };
-
   return /*#__PURE__*/React.createElement(IUIBox, {
     component: "div",
     className: styles.UUIUserManagementAddEdit
@@ -6179,8 +6126,7 @@ var UserAddEdit = function UserAddEdit(props) {
     className: styles.breadcrumb
   }, /*#__PURE__*/React.createElement(IUIBreadCrumb, {
     breadCrumbs: [{
-      href:
-      config.routes.users.list.path,
+      href: config.routes.users.list.path,
       label: 'Users',
       hasLink: true
     }]
@@ -6249,6 +6195,9 @@ var UserAddEdit = function UserAddEdit(props) {
     if (!p.visibility) {
       return null;
     }
+    if (p.name === 'profile_pic' && config.env.isExpenseProduct) {
+      return null;
+    }
     return /*#__PURE__*/React.createElement(IUIGrid, {
       item: true,
       sm: 12,
@@ -6627,17 +6576,13 @@ var uploadBulkUsersFile = function uploadBulkUsersFile(payload) {
     });
   };
 };
-
 var uploadFileToS3$1 = function uploadFileToS3(presignedPostData, file) {
   return new Promise(function (resolve, reject) {
     var formData = new FormData();
-
     Object.keys(presignedPostData.fields).forEach(function (key) {
       formData.append(key, presignedPostData.fields[key]);
     });
-
     formData.append('file', file);
-
     axios.post(presignedPostData.url, formData, {
       headers: {
         'Content-Type': 'multipart/form-data'
@@ -6754,7 +6699,7 @@ var fetchBulkactionHistory = function fetchBulkactionHistory(url) {
   };
 };
 
-var styles$5 = {"UUIUserManagementList":"_3WNHx","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","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_","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","user_list_page_tabs":"_xWE7K","TabLabelCount":"_13pXn"};
 
 var BulkUploadModal = function BulkUploadModal(props) {
   var isOpenImportUsersModal = props.isOpenImportUsersModal,
@@ -7038,7 +6983,6 @@ var UserBulkUpload = function UserBulkUpload(_ref) {
     setOpenImportUsersModal(false);
     handleImportPagenavigation(jobId);
   };
-
   var handleDownloadRecords = function handleDownloadRecords(type) {
     try {
       setDownlStatus(true);
@@ -8064,7 +8008,6 @@ var DropdownBtn = function DropdownBtn(props) {
     if (val.disable) return false;
     if (val.handler && typeof val.handler === 'function') val.handler();
   };
-
   var prevOpen = React.useRef(open);
   React.useEffect(function () {
     if (prevOpen.current === true && open === false) {
@@ -8332,7 +8275,6 @@ var StickyHeadTable = function StickyHeadTable(props) {
       paddingLeft: '40px'
     }
   }];
-
   return /*#__PURE__*/React.createElement(IUITable, {
     searchPlaceholder: "Search by name, email & department",
     isCheckboxTable: true,
@@ -8355,7 +8297,8 @@ var StickyHeadTable = function StickyHeadTable(props) {
     isDataFetching: isDataFetching,
     disableRowCheckbox: disableRowCheckbox,
     searchBoxWidth: "400px",
-    searchValue: searchValue
+    searchValue: searchValue,
+    hideTopPagination: false
   });
 };
 var SingupRequests = function SingupRequests(props) {
@@ -8386,7 +8329,6 @@ var SingupRequests = function SingupRequests(props) {
     var months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
     return dt.getDate() + " " + months[dt.getMonth()] + " " + dt.getFullYear();
   };
-
   var columns = [{
     id: 'fname',
     label: 'Name',
@@ -8397,8 +8339,7 @@ var SingupRequests = function SingupRequests(props) {
       return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(IUIProfileBox, {
         firstName: row.fname,
         lastName: row.lname,
-        isLetterAvatar:
-        row.profile_pic && row.profile_pic.presigned_url ? false : true,
+        isLetterAvatar: row.profile_pic && row.profile_pic.presigned_url ? false : true,
         primaryText: row.fname + ' ' + row.lname,
         secondaryText: row.email,
         letterAvatarTextColor: "black",
@@ -8474,9 +8415,34 @@ var SingupRequests = function SingupRequests(props) {
 
 var IUIToastMessageService$7 = services.IUIToastMessageService;
 var env$7 = configs.env;
-var UserList = function UserList(_ref) {
-  var config = _ref.config,
-    isProfile = _ref.isProfile;
+var UndoButton = function UndoButton(_ref) {
+  var onUndo = _ref.onUndo,
+    msg = _ref.msg;
+  return /*#__PURE__*/React.createElement("div", {
+    style: {
+      display: 'flex',
+      flexDirection: 'row',
+      width: '270px',
+      justifyContent: 'space-between'
+    }
+  }, /*#__PURE__*/React.createElement("p", {
+    style: {
+      whiteSpace: 'nowrap',
+      paddingTop: '8px'
+    }
+  }, msg), /*#__PURE__*/React.createElement("p", {
+    onClick: onUndo,
+    style: {
+      whiteSpace: 'nowrap',
+      fontWeight: '600',
+      fontSize: '1rem',
+      padding: '8px 20px 0'
+    }
+  }, "UNDO"));
+};
+var UserList = function UserList(_ref2) {
+  var config = _ref2.config,
+    isProfile = _ref2.isProfile;
   env$7.init(config, isProfile);
   var history = useHistory();
   var _useSelector = useSelector(function (state) {
@@ -8489,7 +8455,7 @@ var UserList = function UserList(_ref) {
   var _React$useState = React.useState(1),
     page = _React$useState[0],
     setPage = _React$useState[1];
-  var _useState = useState(5),
+  var _useState = useState(10),
     rowsPerPage = _useState[0],
     setRowsPerPage = _useState[1];
   var _React$useState2 = React.useState({}),
@@ -8535,19 +8501,41 @@ var UserList = function UserList(_ref) {
   var _useState10 = useState(false),
     isApiFetching = _useState10[0],
     setisApiFetching = _useState10[1];
-
-  var _React$useState5 = React.useState(1),
-    signup_page = _React$useState5[0],
-    setSignUpPage = _React$useState5[1];
+  var _React$useState5 = React.useState(false),
+    overlayMenu = _React$useState5[0],
+    setOverlayMenu = _React$useState5[1];
+  useScrollPosition(function (_ref3) {
+    var prevPos = _ref3.prevPos,
+      currPos = _ref3.currPos;
+    if (prevPos.y - currPos.y > 0) {
+      if (currPos.y < -130) {
+        setOverlayMenu(true);
+      }
+    } else {
+      if (currPos.y > -190) {
+        setOverlayMenu(false);
+      }
+    }
+  }, [overlayMenu]);
+  var scrollTo = function scrollTo(id) {
+    var el = document.getElementById(id);
+    window.scrollTo({
+      top: el.offsetTop,
+      behavior: 'smooth'
+    });
+  };
+  var _React$useState6 = React.useState(1),
+    signup_page = _React$useState6[0],
+    setSignUpPage = _React$useState6[1];
   var _useState11 = useState(5),
     signup_rowsPerPage = _useState11[0],
     setSignUpRowsPerPage = _useState11[1];
-  var _React$useState6 = React.useState('asc'),
-    signup_order = _React$useState6[0],
-    setSignUpOrder = _React$useState6[1];
-  var _React$useState7 = React.useState('fname'),
-    signup_orderBy = _React$useState7[0],
-    setSignUpOrderBy = _React$useState7[1];
+  var _React$useState7 = React.useState('asc'),
+    signup_order = _React$useState7[0],
+    setSignUpOrder = _React$useState7[1];
+  var _React$useState8 = React.useState('fname'),
+    signup_orderBy = _React$useState8[0],
+    setSignUpOrderBy = _React$useState8[1];
   var _useState12 = useState(''),
     signup_searchValue = _useState12[0],
     set_signup_SearchValue = _useState12[1];
@@ -8589,38 +8577,16 @@ var UserList = function UserList(_ref) {
   var handleVerifyUserClick = function handleVerifyUserClick(userId) {
     history.push(config.routes.users.add.path + "?" + config.routes.users.add.queryParamKeys.verifyUserId + "=" + userId);
   };
-  var UndoButton = function UndoButton(_ref2) {
-    var msg = _ref2.msg,
-      id = _ref2.id;
-    return /*#__PURE__*/React.createElement(IUIBox, {
-      display: "flex",
-      flexDirection: "row",
-      width: "270px"
-    }, /*#__PURE__*/React.createElement(IUITypography, {
-      style: {
-        whiteSpace: 'nowrap',
-        paddingTop: '8px'
-      }
-    }, msg), /*#__PURE__*/React.createElement(IUIButton, {
-      type: "text",
-      buttonText: "UNDO",
-      style: {
-        color: '#FFFFFF'
-      },
-      onClick: function onClick() {
-        return dispatch(undoneSignUpRejection(id));
-      }
-    }));
-  };
   var handleRejectUserClick = function handleRejectUserClick(userId) {
     dispatch(rejectUserVerification(userId)).then(function (res) {
-      var _res$data;
-      console.log(res);
-      IUIToastMessageService$7.undoNotify( /*#__PURE__*/React.createElement(UndoButton, {
-        msg: (res === null || res === void 0 ? void 0 : (_res$data = res.data) === null || _res$data === void 0 ? void 0 : _res$data.message) || 'Sign-up request rejected',
-        id: userId
-      }));
       if (res.status === true) {
+        var _res$data;
+        IUIToastMessageService$7.undoNotify( /*#__PURE__*/React.createElement(UndoButton, {
+          onUndo: function onUndo() {
+            return dispatch(undoneSignUpRejection(userId));
+          },
+          msg: (res === null || res === void 0 ? void 0 : (_res$data = res.data) === null || _res$data === void 0 ? void 0 : _res$data.message) || 'Sign-up request rejected'
+        }));
         dispatch(showDataFetchingStatus());
         dispatch(fetchUserSignupRequests({
           ordering: signup_order === 'asc' ? signup_orderBy : "-" + signup_orderBy,
@@ -8794,6 +8760,7 @@ var UserList = function UserList(_ref) {
           dispatch(fetchUsersList(url)).then(function () {
             setSearchingChange(false);
             setisApiFetching(false);
+            scrollTo('table-root');
           });
         }, 1000);
         return function () {
@@ -8819,6 +8786,7 @@ var UserList = function UserList(_ref) {
       }
       if (isSortingChange) {
         setisApiFetching(true);
+        scrollTo('table-root');
         dispatch(fetchUsersList(url)).then(function () {
           setisApiFetching(false);
           setSortingChange(false);
@@ -8857,15 +8825,89 @@ var UserList = function UserList(_ref) {
       }
     }
   }, [isTokenVerified, isSearchingChangeTemp, isSortingChangeTemp, isSignUpSearchingChangeTemp, isSignUpSortingChangeTemp]);
+  var topRightButtons = function topRightButtons() {
+    return /*#__PURE__*/React.createElement(IUIBox, {
+      component: "div",
+      className: styles$5.buttonWrapper,
+      display: "flex",
+      justifyContent: "space-between",
+      alignItems: "center",
+      alignSelf: "flex-start"
+    }, /*#__PURE__*/React.createElement(IUIBox, {
+      component: "div",
+      className: clsx(styles$5.buttonSingle, styles$5.buttonLeft)
+    }, /*#__PURE__*/React.createElement(IUIButton, {
+      buttonText: "Export all users",
+      type: "outlined",
+      startIcon: /*#__PURE__*/React.createElement(BulkDownloadIcon, {
+        width: "22",
+        height: "22"
+      }),
+      onClick: handleExportUsers
+    })), /*#__PURE__*/React.createElement(IUIBox, {
+      component: "div",
+      className: clsx(styles$5.buttonSingle, styles$5.buttonLeft)
+    }, /*#__PURE__*/React.createElement(IUIDropdownButton, {
+      buttonText: "Bulk actions",
+      type: "outlined",
+      menuListInfo: BulkUploadInfo
+    })), /*#__PURE__*/React.createElement(IUIBox, {
+      component: "div",
+      className: "pageHeader--button-single button-right"
+    }, /*#__PURE__*/React.createElement(IUIButton, {
+      buttonText: "Add user",
+      type: "contained",
+      startIcon: /*#__PURE__*/React.createElement(AddIcon, {
+        width: "9",
+        height: "9",
+        color: "white"
+      }),
+      onClick: handleAddPageNavigation
+    })));
+  };
   return /*#__PURE__*/React.createElement(IUIBox, {
     component: "div",
     className: styles$5.UUIUserManagementList
-  }, !hasVerificationError ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(IUIBackdrop, {
+  }, overlayMenu ? /*#__PURE__*/React.createElement(Box, {
+    className: styles$5.scrollOverlayMenu
+  }, /*#__PURE__*/React.createElement(IUIBox, {
+    component: "div",
+    className: clsx(styles$5.pageHeader)
+  }, /*#__PURE__*/React.createElement(IUIBox, {
+    component: "div",
+    display: "flex",
+    justifyContent: "space-between",
+    alignItems: "center",
+    flexWrap: "wrap",
+    style: {
+      gap: '1rem'
+    }
+  }, /*#__PURE__*/React.createElement(IUIBox, {
+    component: "div",
+    display: "flex",
+    flexDirection: "column",
+    style: {
+      gap: '0.5rem'
+    }
+  }, /*#__PURE__*/React.createElement(IUISearch, {
+    placeholder: "Search by name, email & department",
+    value: searchValue,
+    onChangeHandler: function onChangeHandler(e) {
+      return onSearchHandler(e.target.value);
+    },
+    className: styles$5.overlaysearch
+  })), topRightButtons()), /*#__PURE__*/React.createElement(IUIBox, {
+    component: "div",
+    display: "flex",
+    justifyContent: "space-between",
+    alignItems: "center"
+  }))) : '', !hasVerificationError ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(IUIBackdrop, {
     open: isFileDownloading || isApiFetching,
     className: styles$5.backdrop
   }, /*#__PURE__*/React.createElement(IUICircularProgress, {
     color: "inherit"
   })), isDataFetching ? /*#__PURE__*/React.createElement(SkeletonLoader, null) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(IUIBox, {
+    id: "table-root",
     component: "div",
     className: clsx(styles$5.pageHeader)
   }, /*#__PURE__*/React.createElement(IUIBox, {
@@ -8890,44 +8932,7 @@ var UserList = function UserList(_ref) {
   }, /*#__PURE__*/React.createElement(IUITypography, {
     variant: "h3",
     className: clsx(styles$5.heading, styles$5.headingLarge)
-  }, isILadmin && companyName ? companyName + " - Users" : 'Users'))), /*#__PURE__*/React.createElement(IUIBox, {
-    component: "div",
-    className: styles$5.buttonWrapper,
-    display: "flex",
-    justifyContent: "space-between",
-    alignItems: "center",
-    alignSelf: "flex-start"
-  }, /*#__PURE__*/React.createElement(IUIBox, {
-    component: "div",
-    className: clsx(styles$5.buttonSingle, styles$5.buttonLeft)
-  }, /*#__PURE__*/React.createElement(IUIButton, {
-    buttonText: "Export all users",
-    type: "outlined",
-    startIcon: /*#__PURE__*/React.createElement(BulkDownloadIcon, {
-      width: "22",
-      height: "22"
-    }),
-    onClick: handleExportUsers
-  })), /*#__PURE__*/React.createElement(IUIBox, {
-    component: "div",
-    className: clsx(styles$5.buttonSingle, styles$5.buttonLeft)
-  }, /*#__PURE__*/React.createElement(IUIDropdownButton, {
-    buttonText: "Bulk actions",
-    type: "outlined",
-    menuListInfo: BulkUploadInfo
-  })), /*#__PURE__*/React.createElement(IUIBox, {
-    component: "div",
-    className: "pageHeader--button-single button-right"
-  }, /*#__PURE__*/React.createElement(IUIButton, {
-    buttonText: "Add user",
-    type: "contained",
-    startIcon: /*#__PURE__*/React.createElement(AddIcon, {
-      width: "9",
-      height: "9",
-      color: "white"
-    }),
-    onClick: handleAddPageNavigation
-  })))), /*#__PURE__*/React.createElement(IUIBox, {
+  }, isILadmin && companyName ? companyName + " - Users" : 'Users'))), topRightButtons()), /*#__PURE__*/React.createElement(IUIBox, {
     component: "div",
     display: "flex",
     justifyContent: "space-between",
@@ -9054,8 +9059,8 @@ var UserList = function UserList(_ref) {
     errMsg: hasVerificationError
   }));
 };
-var TabLabelCount = function TabLabelCount(_ref3) {
-  var count = _ref3.count;
+var TabLabelCount = function TabLabelCount(_ref4) {
+  var count = _ref4.count;
   return /*#__PURE__*/React.createElement(IUIBox, {
     className: styles$5.TabLabelCount
   }, " ", count, " ");
@@ -9269,7 +9274,6 @@ function EditPanelDialog(_ref) {
       return state.userPanel;
     }),
     dialogData = _useSelector.dialogData;
-
   return /*#__PURE__*/React.createElement(IUIModal, {
     isDisabledSubmitBtn: isDisabledSubmitBtn,
     isOpen: isOpen,
@@ -9296,8 +9300,7 @@ function EditPanelDialog(_ref) {
     flexDirection: "column",
     padding: "8px 24px"
   }, /*#__PURE__*/React.createElement(IUIInput, {
-    label: name + " name"
-    ,
+    label: name + " name",
     name: "name",
     defaultValue: dialogData.data.name,
     onValueChange: onValueChange,
@@ -9502,7 +9505,6 @@ var UserPanel = function UserPanel(_ref) {
     }),
     isTokenVerified = _useSelector2.isTokenVerified,
     hasVerificationError = _useSelector2.hasVerificationError;
-
   var onValueChange = function onValueChange(_ref2) {
     var _value = _ref2._value;
     var validatedValue = _value.replace(/\s+/g, ' ').trim();
@@ -9613,7 +9615,6 @@ var UserPanel = function UserPanel(_ref) {
     var message = title + " deleted successfully.";
     handleApiCall(deleteRecord, payload, message, 'delete');
   };
-
   var handleApiCall = function handleApiCall(dispatchFun, payload, message, type) {
     dispatch(userPanelShowLoader());
     dispatch(dispatchFun(tableName, payload, getApiData())).then(function (res) {