ordering-ui-admin-external 1.15.0 → 1.15.2

package/_modules/components/Users/UsersDeleteButton/index.js

@@ -29,7 +29,8 @@ var UsersDeleteButtonUI = function UsersDeleteButtonUI(props) {
     getCheckPassword = props.getCheckPassword,
     selectedUsers = props.selectedUsers,
     deleteUsersActionState = props.deleteUsersActionState,
-    handleDeleteSeveralUsers = props.handleDeleteSeveralUsers;
+    handleDeleteSeveralUsers = props.handleDeleteSeveralUsers,
+    disabled = props.disabled;
   var _useLanguage = (0, _orderingComponentsAdminExternal.useLanguage)(),
     _useLanguage2 = _slicedToArray(_useLanguage, 2),
     t = _useLanguage2[1];
@@ -75,7 +76,7 @@ var UsersDeleteButtonUI = function UsersDeleteButtonUI(props) {
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_styles.Button, {
     borderRadius: "5px",
     color: "secundary",
-    disabled: !selectedUsers.length || deleteUsersActionState.loading,
+    disabled: !selectedUsers.length || deleteUsersActionState.loading || disabled,
     onClick: function onClick() {
       return handleModalOpen();
     }

package/_modules/components/Users/UsersExportCSV/index.js

@@ -26,7 +26,8 @@ function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefine
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 var UsersExportCSVUI = function UsersExportCSVUI(props) {
   var actionStatus = props.actionStatus,
-    getCSV = props.getCSV;
+    getCSV = props.getCSV,
+    disabled = props.disabled;
   var _useLanguage = (0, _orderingComponentsAdminExternal.useLanguage)(),
     _useLanguage2 = _slicedToArray(_useLanguage, 2),
     t = _useLanguage2[1];
@@ -75,7 +76,7 @@ var UsersExportCSVUI = function UsersExportCSVUI(props) {
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_styles2.ExportContainer, null, /*#__PURE__*/_react.default.createElement(_styles.Button, {
     borderRadius: "5px",
     color: "secundary",
-    disabled: actionStatus.loading,
+    disabled: actionStatus.loading || disabled,
     onClick: function onClick() {
       return handleCSV();
     }

package/_modules/components/Users/UsersListing/index.js

@@ -51,7 +51,6 @@ var UsersListingUI = function UsersListingUI(props) {
     handleSelectedUsers = props.handleSelectedUsers,
     deleteUsersActionState = props.deleteUsersActionState,
     handleDeleteSeveralUsers = props.handleDeleteSeveralUsers,
-    onUserRedirect = props.onUserRedirect,
     handleSuccessUpdate = props.handleSuccessUpdate,
     handleSuccessAddUser = props.handleSuccessAddUser,
     handleSuccessDeleteUser = props.handleSuccessDeleteUser,
@@ -61,6 +60,7 @@ var UsersListingUI = function UsersListingUI(props) {
   var _useLanguage = (0, _orderingComponentsAdminExternal.useLanguage)(),
     _useLanguage2 = _slicedToArray(_useLanguage, 2),
     t = _useLanguage2[1];
+  var history = (0, _reactRouterDom.useHistory)();
   var query = new URLSearchParams((0, _reactRouterDom.useLocation)().search);
   var _useState = (0, _react.useState)(null),
     _useState2 = _slicedToArray(_useState, 2),
@@ -82,10 +82,12 @@ var UsersListingUI = function UsersListingUI(props) {
     setIsOpenUserDetails(false);
     setOpenUser(null);
     setQueryId(null);
-    onUserRedirect();
+    var enabled = selectedUserActiveState ? 'active' : 'inactive';
+    history.replace("".concat(location.pathname, "?enabled=").concat(enabled));
   };
   var handleOpenUserDetails = function handleOpenUserDetails(user) {
-    onUserRedirect(user === null || user === void 0 ? void 0 : user.id);
+    var enabled = selectedUserActiveState ? 'active' : 'inactive';
+    history.replace("".concat(location.pathname, "?enabled=").concat(enabled, "&id=").concat(user === null || user === void 0 ? void 0 : user.id));
     setOpenUser(user);
     setOpenUserAddForm(false);
     setIsOpenUserDetails(true);
@@ -179,7 +181,10 @@ var UsersListingUI = function UsersListingUI(props) {
   })));
 };
 var UsersListing = function UsersListing(props) {
+  var query = new URLSearchParams((0, _reactRouterDom.useLocation)().search);
+  var defaultUserActiveState = query.get('enabled') !== 'inactive';
   var usersListingProps = _objectSpread(_objectSpread({}, props), {}, {
+    defaultUserActiveState: defaultUserActiveState,
     UIComponent: UsersListingUI,
     isSearchByUserEmail: true,
     isSearchByUserPhone: true,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ordering-ui-admin-external",
-  "version": "1.15.0",
+  "version": "1.15.2",
   "description": "Ordering UI Admin Components",
   "main": "./_modules/index.js",
   "exports": {
@@ -83,7 +83,7 @@
     "lodash": "^4.17.20",
     "moment": "^2.29.1",
     "moment-range": "^4.0.2",
-    "ordering-components-admin-external": "1.15.0",
+    "ordering-components-admin-external": "1.15.1",
     "polished": "^3.6.7",
     "prop-types": "^15.7.2",
     "react-big-calendar": "^1.4.2",

package/src/components/Delivery/DeliveryUsersListing/index.js

@@ -47,7 +47,9 @@ const DeliveryUsersListingUI = (props) => {
     onUserRedirect,
     handleSuccessUpdate,
     handleSuccessAddUser,
-    handleSuccessDeleteUser
+    handleSuccessDeleteUser,
+    actionDisabled,
+    driversGroupsState
   } = props
 
   const history = useHistory()
@@ -163,8 +165,8 @@ const DeliveryUsersListingUI = (props) => {
           onSearch={onSearch}
           handleDeleteSeveralUsers={handleDeleteSeveralUsers}
           handleOpenUserAddForm={handleOpenUserAddForm}
-
           handleOpenTour={() => handleOpenTour()}
+          actionDisabled={actionDisabled}
         />
         {isShowActiveStateFilter && (
           <UserActiveStateFilter
@@ -192,6 +194,7 @@ const DeliveryUsersListingUI = (props) => {
           userDetailsId={openUser?.id || queryId}
           handleOpenUserDetails={handleOpenUserDetails}
           handleOpenUserAddForm={handleOpenUserAddForm}
+          actionDisabled={actionDisabled}
         />
       </UsersListingContainer>
 
@@ -207,6 +210,7 @@ const DeliveryUsersListingUI = (props) => {
           handleSuccessUpdate={handleSuccessUpdate}
           handleSuccessDeleteUser={handleSuccessDeleteUser}
           handleChangeActiveUser={handleChangeActiveUser}
+          actionDisabled={actionDisabled}
         />
       )}
       {openUserAddForm && (
@@ -222,6 +226,7 @@ const DeliveryUsersListingUI = (props) => {
             handleSuccessAdd={handleSuccessAddUser}
             onClose={() => setOpenUserAddForm(false)}
             isTourOpen={isTourOpen}
+            driversGroupsState={driversGroupsState}
           />
         </SideBar>
       )}

package/src/components/Delivery/DriversGroupBusinesses/index.js

@@ -25,7 +25,8 @@ export const DriversGroupBusinesses = (props) => {
     handleUpdateDriversGroup,
     handleAddDriversGroup,
     handleSelectAllBusiness,
-    selectedBusinessIds
+    selectedBusinessIds,
+    actionDisabled
   } = props
 
   const [, t] = useLanguage()
@@ -56,6 +57,7 @@ export const DriversGroupBusinesses = (props) => {
     <Container
       data-tour='tour_select_business'
       onSubmit={handleSubmit(onSubmit)}
+      disabled={actionDisabled}
     >
       <SearchBarWrapper>
         <SearchBar

package/src/components/Delivery/DriversGroupBusinesses/styles.js

@@ -3,6 +3,10 @@ import styled, { css } from 'styled-components'
 
 export const Container = styled.form`
   height: calc(100% - 130px);
+  ${({ disabled }) => disabled && css`
+    opacity: 0.7;
+    pointer-events: none;
+  `}
   > button {
     position: sticky;
     top: 100%;

package/src/components/Delivery/DriversGroupDeliveryDetails/index.js

@@ -25,7 +25,8 @@ const DriverGroupDeliveryDetailsUI = (props) => {
     zoneList,
     setZoneList,
     setIsOpenDetails,
-    isOpenDetails
+    isOpenDetails,
+    actionDisabled
   } = props
 
   const [, t] = useLanguage()
@@ -40,7 +41,9 @@ const DriverGroupDeliveryDetailsUI = (props) => {
   }, [actionState?.error])
 
   return (
-    <Container>
+    <Container
+      disabled={actionDisabled}
+    >
       <DriverGroupDeliveryZoneList
         setZoneList={setZoneList}
         handleParentSidebarMove={handleParentSidebarMove}

package/src/components/Delivery/DriversGroupDeliveryDetails/styles.js

@@ -1,7 +1,11 @@
-import styled from 'styled-components'
+import styled, { css } from 'styled-components'
 
 export const Container = styled.div`
   height: calc(100% - 130px);
+  ${({ disabled }) => disabled && css`
+    opacity: 0.7;
+    pointer-events: none;
+  `}
   > button {
     position: sticky;
     top: 100%;

package/src/components/Delivery/DriversGroupDetails/index.js

@@ -35,7 +35,8 @@ const DriversGroupDetailsUI = (props) => {
     handleDeleteDriversGroup,
     handleNextTour,
     handleUpdateDriversGroup,
-    setIsExtendExtraOpen
+    setIsExtendExtraOpen,
+    actionDisabled
   } = props
 
   const history = useHistory()
@@ -155,6 +156,7 @@ const DriversGroupDetailsUI = (props) => {
                 <Switch
                   defaultChecked={driversGroupState.driversGroup?.enabled}
                   onChange={enabled => handleUpdateDriversGroup({ enabled: enabled })}
+                  disabled={actionDisabled}
                 />
               </div>
               <RightHeader>
@@ -174,6 +176,7 @@ const DriversGroupDetailsUI = (props) => {
                   >
                     <Dropdown.Item
                       onClick={() => onDeleteGroup()}
+                      disabled={actionDisabled}
                     >
                       {t('DELETE', 'Delete')}
                     </Dropdown.Item>

package/src/components/Delivery/DriversGroupGeneralForm/index.js

@@ -22,7 +22,7 @@ export const DriversGroupGeneralForm = (props) => {
     setUseAdvanced,
     handleUpdateDriversGroup,
     handleAddDriversGroup,
-
+    actionDisabled,
     isTourOpen,
     handleNextClick
   } = props
@@ -126,6 +126,7 @@ export const DriversGroupGeneralForm = (props) => {
     <Container
       data-tour='tour_fill_group'
       onSubmit={handleSubmit(onSubmit)}
+      disabled={actionDisabled}
     >
       <InputWrapper>
         <label>{t('NAME', 'Name')}</label>

package/src/components/Delivery/DriversGroupGeneralForm/styles.js

@@ -2,6 +2,10 @@ import styled, { css } from 'styled-components'
 
 export const Container = styled.form`
   padding-bottom: 30px;
+  ${({ disabled }) => disabled && css`
+    opacity: 0.7;
+    pointer-events: none;
+  `}
 
   > button {
     position: sticky;

package/src/components/Delivery/DriversGroupLogistics/index.js

@@ -23,7 +23,8 @@ export const DriversGroupLogistics = (props) => {
     changesState,
     handleChangesState,
     handleParentSidebarMove,
-    handleUpdateDriversGroup
+    handleUpdateDriversGroup,
+    actionDisabled
   } = props
 
   const history = useHistory()
@@ -74,7 +75,9 @@ export const DriversGroupLogistics = (props) => {
   }, [])
 
   return (
-    <LogisticsContainer>
+    <LogisticsContainer
+      disabled={actionDisabled}
+    >
       <OrderStatusWrapper
         onClick={() => handleChangesState({ orders_group_start_in_status: 7 })}
       >

package/src/components/Delivery/DriversGroupLogistics/styles.js

@@ -3,6 +3,10 @@ import styled, { css } from 'styled-components'
 export const LogisticsContainer = styled.div`
   padding: 20px 0;
   min-height: calc(100% - 120px);
+  ${({ disabled }) => disabled && css`
+    opacity: 0.7;
+    pointer-events: none;
+  `}
 
   > button {
     position: sticky;

package/src/components/Delivery/DriversGroupLogs/index.js

@@ -18,7 +18,8 @@ const DriversGroupLogsUI = (props) => {
   const {
     logsList,
     paginationProps,
-    getDriversGroupLogs
+    getDriversGroupLogs,
+    actionDisabled
   } = props
 
   const [, t] = useLanguage()
@@ -72,7 +73,9 @@ const DriversGroupLogsUI = (props) => {
 
   return (
     <>
-      <DriversGroupLogsContainer>
+      <DriversGroupLogsContainer
+        disabled={actionDisabled}
+      >
         <TableWrapper>
           {(logsList.loading || logsList.logs.length > 0) ? (
             <Table>
@@ -117,7 +120,7 @@ const DriversGroupLogsUI = (props) => {
                   </tbody>
                 ))
               ) : (
-                logsList.logs.map(log => (
+                !logsList.error && logsList.logs?.map(log => (
                   <tbody key={log.id}>
                     <tr>
                       <td>

package/src/components/Delivery/DriversGroupLogs/styles.js

@@ -2,6 +2,10 @@ import styled, { css } from 'styled-components'
 
 export const DriversGroupLogsContainer = styled.div`
   height: calc(100% - 180px);
+  ${({ disabled }) => disabled && css`
+    opacity: 0.7;
+    pointer-events: none;
+  `}
 `
 
 export const TableWrapper = styled.div`

package/src/components/Delivery/DriversGroupPaymethods/index.js

@@ -21,7 +21,8 @@ export const DriversGroupPaymethods = (props) => {
     handleUpdateDriversGroup,
     handleAddDriversGroup,
     handleSelectPaymethod,
-    handleSelectAllPaymethod
+    handleSelectAllPaymethod,
+    actionDisabled
   } = props
   const [, t] = useLanguage()
   const [searchValue, setSearchValue] = useState(null)
@@ -39,7 +40,9 @@ export const DriversGroupPaymethods = (props) => {
 
   return (
     <>
-      <Container>
+      <Container
+        disabled={actionDisabled}
+      >
         <SearchBarWrapper>
           <SearchBar
             placeholder={t('SEARCH', 'Search')}

package/src/components/Delivery/DriversGroupPaymethods/styles.js

@@ -2,6 +2,10 @@ import styled, { css } from 'styled-components'
 
 export const Container = styled.div`
   height: calc(100% - 160px);
+  ${({ disabled }) => disabled && css`
+    opacity: 0.7;
+    pointer-events: none;
+  `}
   > button {
     position: sticky;
     top: 100%;

package/src/components/Delivery/DriversGroupsList/index.js

@@ -34,7 +34,8 @@ export const DriversGroupsList = (props) => {
     selectedGroupList,
     isFromStore,
     handleSelectGroup,
-    handleAllSelectGroup
+    handleAllSelectGroup,
+    actionDisabled
   } = props
 
   const [, t] = useLanguage()
@@ -218,6 +219,7 @@ export const DriversGroupsList = (props) => {
                         <EnableWrapper className='group-enabled'>
                           <span>{t('ENABLE', 'Enable')}</span>
                           <Switch
+                            disabled={actionDisabled}
                             defaultChecked={group?.enabled}
                             onChange={enabled => handleUpdateDriversGroup?.(group.id, { enabled: enabled })}
                           />
@@ -235,6 +237,7 @@ export const DriversGroupsList = (props) => {
             {!isFromStore && (
               <AddNewGroupButton
                 onClick={() => handleOpenDetails(null)}
+                disabled={actionDisabled}
               >
                 {t('ADD_NEW_DRIVER_GROUP', 'Add new driver group')}
               </AddNewGroupButton>

package/src/components/Delivery/DriversGroupsList/styles.js

@@ -222,4 +222,10 @@ export const AddNewGroupButton = styled.div`
   cursor: pointer;
   font-size: 12px;
   color: ${props => props.theme.colors.primary};
+
+  ${({ disabled }) => disabled && css`
+    opacity: 0.5;
+    cursor: not-allowed;
+    pointer-events: none;
+  `}
 `

package/src/components/Delivery/DriversGroupsListing/index.js

@@ -33,7 +33,8 @@ const DriversGroupsListingUI = (props) => {
     actionState,
     handleUpdateDriversGroup,
     handleDeleteDriversGroup,
-    driversCompanyList
+    driversCompanyList,
+    actionDisabled
   } = props
 
   const history = useHistory()
@@ -170,13 +171,14 @@ const DriversGroupsListingUI = (props) => {
               color='lightPrimary'
               data-tour='tour_add_group'
               onClick={() => handleOpenDetails(null)}
+              disabled={actionDisabled}
             >
               {t('ADD_DRIVER_GROUP', 'Add driver group')}
             </Button>
             <Button
               borderRadius='8px'
               color='secundary'
-              disabled={selectedGroupList.length === 0}
+              disabled={selectedGroupList.length === 0 || actionDisabled}
               onClick={() => onClickSelectedGroupsDelete()}
             >
               {t('DELETE', 'Delete')}
@@ -199,6 +201,7 @@ const DriversGroupsListingUI = (props) => {
           selectedGroupList={selectedGroupList}
           handleSelectGroup={handleSelectGroup}
           handleAllSelectGroup={handleAllSelectGroup}
+          actionDisabled={actionDisabled}
         />
       </DriversGroupsListingContainer>
       {openDetails && (
@@ -232,6 +235,7 @@ const DriversGroupsListingUI = (props) => {
             }}
             isTourOpen={isTourOpen}
             handleNextTour={handleNextTour}
+            actionDisabled={actionDisabled}
           />
         </SideBar>
       )}

package/src/components/Delivery/UserAddForm/index.js

@@ -2,6 +2,7 @@ import React, { useState, useEffect, useRef } from 'react'
 import { useForm } from 'react-hook-form'
 import {
   useLanguage,
+  useSession,
   useEvent,
   DragAndDrop,
   ExamineClick,
@@ -14,6 +15,8 @@ import parsePhoneNumber from 'libphonenumber-js'
 import Skeleton from 'react-loading-skeleton'
 import BiImage from '@meronex/icons/bi/BiImage'
 import { useWindowSize } from '../../../hooks/useWindowSize'
+import MdCheckBoxOutlineBlank from '@meronex/icons/md/MdCheckBoxOutlineBlank'
+import MdCheckBox from '@meronex/icons/md/MdCheckBox'
 
 import {
   FormContainer,
@@ -25,7 +28,10 @@ import {
   FormInput,
   ActionsForm,
   SkeletonForm,
-  MainInformationContainer
+  MainInformationContainer,
+  DriverGroupListContainer,
+  DriverGroupItem,
+  CheckboxWrapper
 } from './styles'
 
 const UserAddFormUI = (props) => {
@@ -42,13 +48,16 @@ const UserAddFormUI = (props) => {
     isDriversPage,
     isDriversManagersPage,
     handleChangeSwtich,
-
-    isTourOpen
+    isTourOpen,
+    driversGroupsState,
+    selectedDriverGroupIds,
+    handleDriverGroupClick
   } = props
   const formMethods = useForm()
   const [, t] = useLanguage()
   const [events] = useEvent()
   const { width } = useWindowSize()
+  const [session] = useSession()
 
   const [isValidPhoneNumber, setIsValidPhoneNumber] = useState(null)
   const [userPhoneNumber, setUserPhoneNumber] = useState(null)
@@ -349,6 +358,36 @@ const UserAddFormUI = (props) => {
                 props.afterMidComponents?.map((MidComponent, i) => (
                   <MidComponent key={i} {...props} />))
                 }
+                {isDriversPage && session?.user?.level === 5 && (
+                  <DriverGroupListContainer>
+                    {driversGroupsState.loading ? (
+                      [...Array(10).keys()].map(i => (
+                        <DriverGroupItem key={i}>
+                          <Skeleton width={20} height={20} />
+                          <Skeleton width={100} />
+                        </DriverGroupItem>
+                      ))
+                    ) : (
+                      driversGroupsState.groups.map(group => (
+                        <DriverGroupItem
+                          key={group.id}
+                          onClick={() => handleDriverGroupClick(group.id)}
+                        >
+                          <CheckboxWrapper
+                            active={selectedDriverGroupIds.includes(group.id)}
+                          >
+                            {selectedDriverGroupIds.includes(group.id) ? (
+                              <MdCheckBox />
+                            ) : (
+                              <MdCheckBoxOutlineBlank />
+                            )}
+                          </CheckboxWrapper>
+                          <span>{group?.name}</span>
+                        </DriverGroupItem>
+                      ))
+                    )}
+                  </DriverGroupListContainer>
+                )}
                 <ActionsForm>
                   <Button
                     color='primary'

package/src/components/Delivery/UserAddForm/styles.js

@@ -188,3 +188,37 @@ export const SkeletonForm = styled.div`
 export const MainInformationContainer = styled.div`
   flex: 1;
 `
+
+export const DriverGroupListContainer = styled.div`
+  margin: 15px 0;
+`
+
+export const DriverGroupItem = styled.div`
+  display: flex;
+  align-items: center;
+  border-bottom: 1px solid ${props => props.theme.colors.borderColor};
+  padding: 12px 0;
+  cursor: pointer;
+
+  > span {
+    font-size: 14px;
+    ${props => props.theme?.rtl ? css`
+      margin-right: 15px;
+    ` : css`
+      margin-left: 15px;
+    `}
+  }
+`
+
+export const CheckboxWrapper = styled.div`
+  svg {
+    font-size: 20px;
+    color: ${props => props.theme.colors.lightGray};
+  }
+
+  ${({ active }) => active && css`
+    svg {
+      color: ${props => props.theme.colors.primary};
+    }
+  `}
+`

package/src/components/Delivery/UserDetails/index.js

@@ -36,7 +36,8 @@ export const UserDetailsUI = (props) => {
     handleChangeActiveUser,
     scheduleState,
     handleScheduleState,
-    handleScheduleUpdateUser
+    handleScheduleUpdateUser,
+    actionDisabled
   } = props
 
   const history = useHistory()
@@ -98,6 +99,7 @@ export const UserDetailsUI = (props) => {
             <>
               {handleChangeActiveUser && (
                 <Switch
+                  disabled={actionDisabled}
                   defaultChecked={userState?.user?.enabled || false}
                   onChange={enabled => handleChangeActiveUser({ id: userState?.user?.id, enabled: enabled })}
                 />
@@ -121,13 +123,13 @@ export const UserDetailsUI = (props) => {
                 title={<ThreeDots />}
                 id={theme?.rtl ? 'dropdown-menu-align-left' : 'dropdown-menu-align-right'}
               >
-                <Dropdown.Item onClick={() => setIsCustomField(true)}>
+                <Dropdown.Item onClick={() => setIsCustomField(true)} disabled={actionDisabled}>
                   {t('CUSTOM_FIELDS', 'Custom fields')}
                 </Dropdown.Item>
-                <Dropdown.Item onClick={() => setIsPersonalization(true)}>
+                <Dropdown.Item onClick={() => setIsPersonalization(true)} disabled={actionDisabled}>
                   {t('PERSONALIZATION', 'Personalization')}
                 </Dropdown.Item>
-                <Dropdown.Item onClick={() => handleDeleteUser(userState.user?.id)}>
+                <Dropdown.Item onClick={() => handleDeleteUser(userState.user?.id)} disabled={actionDisabled}>
                   {t('DELETE', 'Delete')}
                 </Dropdown.Item>
               </DropdownButton>

package/src/components/Delivery/UsersList/index.js

@@ -41,7 +41,8 @@ export const UsersList = (props) => {
     handleOpenUserDetails,
     handleOpenUserAddForm,
     isDriversPage,
-    isDriversManagersPage
+    isDriversManagersPage,
+    actionDisabled
   } = props
 
   const [, t] = useLanguage()
@@ -123,7 +124,7 @@ export const UsersList = (props) => {
                 <th>{t('USER', 'User')}</th>
                 <th>{t('DETAILS', 'Details')}</th>
                 <th />
-                <th colspan={2}>{t('ACTION', 'Action')}</th>
+                <th colSpan={2}>{t('ACTION', 'Action')}</th>
               </tr>
             </thead>
             {usersList.loading ? (
@@ -238,6 +239,7 @@ export const UsersList = (props) => {
                       <UserEnableWrapper className='user_enable_control'>
                         <span>{t('ENABLE', 'Enable')}</span>
                         <Switch
+                          disabled={actionDisabled}
                           notAsync={user.level === 0}
                           defaultChecked={user?.enabled}
                           onChange={enabled => handleEnable(user, enabled)}
@@ -251,7 +253,10 @@ export const UsersList = (props) => {
           </UsersTable>
         </UserTableWrapper>
         <UsersBottomContainer>
-          <AddNewUserButton onClick={() => handleOpenUserAddForm()}>
+          <AddNewUserButton
+            onClick={() => handleOpenUserAddForm()}
+            disabled={actionDisabled}
+          >
             {
               isDriversPage
                 ? t('ADD_NEW_DRIVER', 'Add new driver')

package/src/components/Delivery/UsersList/styles.js

@@ -214,6 +214,11 @@ export const AddNewUserButton = styled.div`
   color: ${props => props.theme.colors.primary};
   width: fit-content;
   font-size: 14px;
+
+  ${({ disabled }) => disabled && css`
+    opacity: 0.5;
+    pointer-events: none;
+  `}
 `
 
 export const UsersBottomContainer = styled.div`