ordering-ui-admin-external 1.43.7 → 1.43.9

package/_modules/components/Orders/OrdersContentHeader/styles.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.WrapperSearchAndFilter = exports.TopRightSection = exports.SLAControlsWrapper = exports.OrderContentHeaderContainer = exports.HeaderTitle = exports.HeaderSection = void 0;
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16;
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17;
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
@@ -24,20 +24,23 @@ var HeaderSection = exports.HeaderSection = _styledComponents.default.div(_templ
 var HeaderTitle = exports.HeaderTitle = _styledComponents.default.p(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n  color: ", ";\n  font-size: 20px;\n  font-weight: bold;\n  margin: 0px;\n  text-transform: capitalize;\n  white-space: nowrap;\n\n  @media (max-width: 560px) {\n    width: calc(100% - 50px);\n  }\n"])), function (props) {
   return props.theme.colors.headingColor;
 });
-var TopRightSection = exports.TopRightSection = _styledComponents.default.div(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  flex-wrap: wrap;\n  ", "\n  \n  @media (min-width: 768px) {\n    flex-direction: row;\n    align-items: center;\n  }\n"])), function (_ref2) {
+var TopRightSection = exports.TopRightSection = _styledComponents.default.div(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  flex-wrap: wrap;\n  ", "\n\n  ", "\n\n  @media (min-width: 768px) {\n    flex-direction: row;\n    align-items: center;\n  }\n"])), function (_ref2) {
   var isCustomLayout = _ref2.isCustomLayout;
   return !isCustomLayout && (0, _styledComponents.css)(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n    justify-content: flex-end;\n  "])));
+}, function (_ref3) {
+  var isCustomLayout = _ref3.isCustomLayout;
+  return isCustomLayout && (0, _styledComponents.css)(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n    .websocket-container {\n      padding-bottom: 10px;\n    }\n  "])));
 });
-var SLAControlsWrapper = exports.SLAControlsWrapper = _styledComponents.default.div(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  margin-top: 10px;\n\n  @media (min-width: 768px) {\n    margin-top: 0px;\n  }\n"])));
-var WrapperSearchAndFilter = exports.WrapperSearchAndFilter = _styledComponents.default.div(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n  position: relative;\n  display: flex;\n  align-items: center;\n  margin-top: 10px;\n\n  ", "\n\n  input {\n    background: ", ";\n    border: none;\n  }\n\n  > button {\n    ", "\n  }\n\n  @media (min-width: 760px) {\n    margin: 20px 0 10px 0;\n  }\n\n  @media (min-width: 992px) {\n    ", "\n  }\n"])), function (_ref3) {
-  var fullWidth = _ref3.fullWidth;
-  return fullWidth && (0, _styledComponents.css)(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n    width: 100%;\n    > div {\n      width: 100%;\n\n      input {\n        width: 100%;\n      }\n    }\n  "])));
+var SLAControlsWrapper = exports.SLAControlsWrapper = _styledComponents.default.div(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  margin-top: 10px;\n\n  @media (min-width: 768px) {\n    margin-top: 0px;\n  }\n"])));
+var WrapperSearchAndFilter = exports.WrapperSearchAndFilter = _styledComponents.default.div(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n  position: relative;\n  display: flex;\n  align-items: center;\n  margin-top: 10px;\n\n  ", "\n\n  input {\n    background: ", ";\n    border: none;\n  }\n\n  > button {\n    ", "\n  }\n\n  @media (min-width: 760px) {\n    margin: 20px 0 10px 0;\n  }\n\n  @media (min-width: 992px) {\n    ", "\n  }\n"])), function (_ref4) {
+  var fullWidth = _ref4.fullWidth;
+  return fullWidth && (0, _styledComponents.css)(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral(["\n    width: 100%;\n    > div {\n      width: 100%;\n\n      input {\n        width: 100%;\n      }\n    }\n  "])));
 }, function (props) {
   return props.theme.colors.secundary;
 }, function (props) {
   var _props$theme3;
-  return (_props$theme3 = props.theme) !== null && _props$theme3 !== void 0 && _props$theme3.rtl ? (0, _styledComponents.css)(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral(["\n      margin-right: 8px;\n    "]))) : (0, _styledComponents.css)(_templateObject15 || (_templateObject15 = _taggedTemplateLiteral(["\n      margin-left: 8px;\n    "])));
-}, function (_ref4) {
-  var fullWidth = _ref4.fullWidth;
-  return !fullWidth && (0, _styledComponents.css)(_templateObject16 || (_templateObject16 = _taggedTemplateLiteral(["\n      margin: 0px;\n    "])));
+  return (_props$theme3 = props.theme) !== null && _props$theme3 !== void 0 && _props$theme3.rtl ? (0, _styledComponents.css)(_templateObject15 || (_templateObject15 = _taggedTemplateLiteral(["\n      margin-right: 8px;\n    "]))) : (0, _styledComponents.css)(_templateObject16 || (_templateObject16 = _taggedTemplateLiteral(["\n      margin-left: 8px;\n    "])));
+}, function (_ref5) {
+  var fullWidth = _ref5.fullWidth;
+  return !fullWidth && (0, _styledComponents.css)(_templateObject17 || (_templateObject17 = _taggedTemplateLiteral(["\n      margin: 0px;\n    "])));
 });

package/_modules/components/Orders/OrdersHeaderFilterGroup/index.js

@@ -34,7 +34,8 @@ var OrdersHeaderFilterGroupUI = function OrdersHeaderFilterGroupUI(props) {
     handleChangeDriver = props.handleChangeDriver,
     handleChangeFilterValues = props.handleChangeFilterValues,
     handleChangeExternalId = props.handleChangeExternalId,
-    handleChangeGroupUnassigned = props.handleChangeGroupUnassigned;
+    handleChangeGroupUnassigned = props.handleChangeGroupUnassigned,
+    isSelectedOrders = props.isSelectedOrders;
   var _useLanguage = (0, _orderingComponentsAdminExternal.useLanguage)(),
     _useLanguage2 = _slicedToArray(_useLanguage, 1),
     dictionary = _useLanguage2[0].dictionary;
@@ -79,7 +80,8 @@ var OrdersHeaderFilterGroupUI = function OrdersHeaderFilterGroupUI(props) {
   }, [filterValues]);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_styles2.WrapperRow, {
     ref: wrapperRef,
-    wrapperWidth: wrapperSize.width
+    wrapperWidth: wrapperSize.width,
+    isSelectedOrders: isSelectedOrders
   }, !loading && configFilter.includes('external_id') && /*#__PURE__*/_react.default.createElement(_Shared.SearchBar, {
     placeholder: (_dictionary$EXTERNAL_ = dictionary === null || dictionary === void 0 ? void 0 : dictionary.EXTERNAL_ID) !== null && _dictionary$EXTERNAL_ !== void 0 ? _dictionary$EXTERNAL_ : 'External Id',
     onChange: handleChangeExternalId,

package/_modules/components/Orders/OrdersHeaderFilterGroup/styles.js

@@ -15,8 +15,9 @@ var WrapperRow = exports.WrapperRow = _styledComponents.default.div(_templateObj
 }, function (props) {
   return props.theme.colors.headingColor;
 }, function (_ref) {
-  var wrapperWidth = _ref.wrapperWidth;
-  return wrapperWidth < 992 && (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n      flex-direction: column !important;\n      padding: 15px 10px 0 10px;\n  "])));
+  var wrapperWidth = _ref.wrapperWidth,
+    isSelectedOrders = _ref.isSelectedOrders;
+  return wrapperWidth < 992 && (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n      flex-direction: column !important;\n      padding: ", ";\n  "])), !isSelectedOrders && '15px 10px 0 10px');
 });
 var Option = exports.Option = _styledComponents.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  font-weight: 400;\n  font-size: 14px;\n  line-height: 24px;\n  color: ", ";\n  display: flex;\n  align-items: center;\n  padding: 5px;\n"])), function (props) {
   return props.theme.colors.secundaryContrast;

package/_modules/components/Orders/OrdersManager/index.js

@@ -233,6 +233,7 @@ var OrdersManagerUI = function OrdersManagerUI(props) {
     setSlaSettingTime: setSlaSettingTime,
     isLateralBar: isLateralBar
   }), /*#__PURE__*/_react.default.createElement(_OrdersHeaderFilterGroup.OrdersHeaderFilterGroup, {
+    isSelectedOrders: isSelectedOrders,
     driverGroupList: driverGroupList,
     driversList: driversList,
     handleChangeFilterValues: handleChangeFilterValues

package/_modules/components/Orders/WebsocketStatus/index.js

@@ -65,7 +65,9 @@ var SocketStatusUI = function SocketStatusUI(props) {
       });
     }
   }, [reconnectAttemptCount]);
-  return /*#__PURE__*/_react.default.createElement(_styles2.Contatiner, null, /*#__PURE__*/_react.default.createElement(_styles2.InfoWrapper, null, /*#__PURE__*/_react.default.createElement(_styles.IconButton, {
+  return /*#__PURE__*/_react.default.createElement(_styles2.Contatiner, {
+    className: "websocket-container"
+  }, /*#__PURE__*/_react.default.createElement(_styles2.InfoWrapper, null, /*#__PURE__*/_react.default.createElement(_styles.IconButton, {
     color: "primary"
   }, /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.InfoCircle, null)), isEnabledWhiteLabelModule ? /*#__PURE__*/_react.default.createElement(_styles2.InfoContent, null, t('WEBSOCKET_STATUS_INFO_WITHOUT_LINK', 'Verify the server connection by date and time using the Connection status button. Press update to refresh you dashboard and update the status as well. Need help? Contact our Customer support team.')) : /*#__PURE__*/_react.default.createElement(_styles2.InfoContent, null, t('WEBSOCKET_STATUS_INFO', 'Verify the server connection by date and time using the Connection status button. Press update to refresh you dashboard and update the status as well. Need help? Contact our Customer support team here:'), /*#__PURE__*/_react.default.createElement("a", {
     href: "https://www.ordering.co/contact-ordering",

package/_modules/components/Stores/BusinessMenu/index.js

@@ -7,6 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.BusinessMenu = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _reactRouterDom = require("react-router-dom");
+var _reactLoadingSkeleton = _interopRequireDefault(require("react-loading-skeleton"));
 var _orderingComponentsAdminExternal = require("ordering-components-admin-external");
 var _BusinessMenuOptions = require("../BusinessMenuOptions");
 var _Shared = require("../../Shared");
@@ -15,6 +16,7 @@ var _styles = require("../../../styles");
 var _reactBootstrapIcons = require("react-bootstrap-icons");
 var _utils = require("../../../utils");
 var _styles2 = require("./styles");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
@@ -171,7 +173,14 @@ var BusinessMenuUI = function BusinessMenuUI(props) {
     onSearch: function onSearch(val) {
       return setSearchValue(val);
     }
-  })), menuList.map(function (menu, index) {
+  })), (businessMenusState === null || businessMenusState === void 0 ? void 0 : businessMenusState.loading) && _toConsumableArray(Array(4).keys()).map(function (i) {
+    return /*#__PURE__*/_react.default.createElement(_styles2.MeunItem, {
+      key: i
+    }, /*#__PURE__*/_react.default.createElement(_reactLoadingSkeleton.default, {
+      width: 120,
+      height: 24
+    }));
+  }), !(businessMenusState !== null && businessMenusState !== void 0 && businessMenusState.loading) && menuList.map(function (menu, index) {
     return /*#__PURE__*/_react.default.createElement(_styles2.MeunItem, {
       key: menu.id,
       isBorderTop: index === 0,
@@ -190,7 +199,8 @@ var BusinessMenuUI = function BusinessMenuUI(props) {
   }), !isSelectedSharedMenus && /*#__PURE__*/_react.default.createElement(_styles2.AddMenuButtonWrapper, null, /*#__PURE__*/_react.default.createElement(_styles.LinkButton, {
     onClick: function onClick() {
       return handleOpenOptions('option', {});
-    }
+    },
+    disabled: businessMenusState === null || businessMenusState === void 0 ? void 0 : businessMenusState.loading
   }, t('ADD_MENU', 'Add menu')))), width >= 1000 ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, showOption === 'option' && /*#__PURE__*/_react.default.createElement(_BusinessMenuOptions.BusinessMenuOptions, {
     open: showOption === 'option',
     business: business,

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

@@ -239,9 +239,7 @@ var CustomersListing = exports.CustomersListing = function CustomersListing(prop
   var customersProps = _objectSpread(_objectSpread({}, props), {}, {
     defaultUserActiveState: defaultUserActiveState,
     UIComponent: CustomersListingUI,
-    isSearchByUserEmail: true,
     isSearchByUserPhone: true,
-    isSearchByUserName: true,
     paginationSettings: {
       initialPage: props.isUseQuery && !isNaN(defaultPage) ? Number(defaultPage) : 1,
       pageSize: props.isUseQuery && !isNaN(defaultPage) ? Number(defaultPageSize) : 10,

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

@@ -192,7 +192,7 @@ var UserFilterGroupUI = function UserFilterGroupUI(props) {
         })
       });
     }
-  })))), /*#__PURE__*/_react.default.createElement(_styles2.FormGroup, null, /*#__PURE__*/_react.default.createElement(_styles2.FormControl, null, /*#__PURE__*/_react.default.createElement("label", null, t('COUNTRY_PHONE_CODE', 'Country phone code')), /*#__PURE__*/_react.default.createElement(_styles.DefaultSelect, {
+  })))), !isCustomers && /*#__PURE__*/_react.default.createElement(_styles2.FormGroup, null, /*#__PURE__*/_react.default.createElement(_styles2.FormControl, null, /*#__PURE__*/_react.default.createElement("label", null, t('COUNTRY_PHONE_CODE', 'Country phone code')), /*#__PURE__*/_react.default.createElement(_styles.DefaultSelect, {
     placeholder: t('SELECT_OPTION', 'Select a option'),
     defaultValue: filterValues === null || filterValues === void 0 ? void 0 : filterValues.countryPhoneCode,
     options: phoneCodeList,
@@ -284,6 +284,16 @@ var UserFilterGroupUI = function UserFilterGroupUI(props) {
     },
     optionInnerMaxHeight: "300px",
     className: "full-select"
+  }))), isCustomers && /*#__PURE__*/_react.default.createElement(_styles2.FormGroup, null, /*#__PURE__*/_react.default.createElement(_styles2.FormControl, null, /*#__PURE__*/_react.default.createElement("label", null, t('ID', 'ID')), /*#__PURE__*/_react.default.createElement(_styles.Input, {
+    type: "text",
+    placeholder: t('ID', 'ID'),
+    autoComplete: "off",
+    value: (filterValues === null || filterValues === void 0 ? void 0 : filterValues.id) || '',
+    onChange: function onChange(e) {
+      return handleChangeValue({
+        id: e.target.value
+      });
+    }
   }))), /*#__PURE__*/_react.default.createElement(_styles2.ButtonGroup, null, /*#__PURE__*/_react.default.createElement(_styles.Button, {
     color: "primary",
     borderRadius: "8px",

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

@@ -62,7 +62,7 @@ var UsersListingHeader = exports.UsersListingHeader = function UsersListingHeade
     isCustomLayout: true,
     onSearch: onSearch,
     search: searchValue,
-    placeholder: t('SEARCH', 'Search')
+    placeholder: isCustomers ? t('SEARCH_BY_CELLPHONE', 'Search by phone') : t('SEARCH', 'Search')
   }), multiFilterValues && /*#__PURE__*/_react.default.createElement(_styles.IconButton, {
     color: "black",
     onClick: function onClick() {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ordering-ui-admin-external",
-  "version": "1.43.7",
+  "version": "1.43.9",
   "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.43.2",
+    "ordering-components-admin-external": "1.43.3",
     "polished": "^3.6.7",
     "prop-types": "^15.7.2",
     "react-big-calendar": "^1.4.2",

package/src/components/Orders/OrdersContentHeader/styles.js

@@ -71,7 +71,13 @@ export const TopRightSection = styled.div`
   ${({ isCustomLayout }) => !isCustomLayout && css`
     justify-content: flex-end;
   `}
-  
+
+  ${({ isCustomLayout }) => isCustomLayout && css`
+    .websocket-container {
+      padding-bottom: 10px;
+    }
+  `}
+
   @media (min-width: 768px) {
     flex-direction: row;
     align-items: center;

package/src/components/Orders/OrdersHeaderFilterGroup/index.js

@@ -17,7 +17,8 @@ const OrdersHeaderFilterGroupUI = (props) => {
     handleChangeDriver,
     handleChangeFilterValues,
     handleChangeExternalId,
-    handleChangeGroupUnassigned
+    handleChangeGroupUnassigned,
+    isSelectedOrders
   } = props
 
   const [{ dictionary }] = useLanguage()
@@ -51,7 +52,7 @@ const OrdersHeaderFilterGroupUI = (props) => {
 
   return (
     <>
-      <WrapperRow ref={wrapperRef} wrapperWidth={wrapperSize.width}>
+      <WrapperRow ref={wrapperRef} wrapperWidth={wrapperSize.width} isSelectedOrders={isSelectedOrders}>
         {!loading && configFilter.includes('external_id') && (
           <SearchBar
             placeholder={dictionary?.EXTERNAL_ID ?? 'External Id'}

package/src/components/Orders/OrdersHeaderFilterGroup/styles.js

@@ -62,9 +62,9 @@ export const WrapperRow = styled.div`
     flex-direction: row;
   }
 
-  ${({ wrapperWidth }) => wrapperWidth < 992 && css`
+  ${({ wrapperWidth, isSelectedOrders }) => wrapperWidth < 992 && css`
       flex-direction: column !important;
-      padding: 15px 10px 0 10px;
+      padding: ${!isSelectedOrders && '15px 10px 0 10px'};
   `}
 `
 export const Option = styled.div`

package/src/components/Orders/OrdersManager/index.js

@@ -196,6 +196,7 @@ const OrdersManagerUI = (props) => {
           isLateralBar={isLateralBar}
         />
         <OrdersHeaderFilterGroup
+          isSelectedOrders={isSelectedOrders}
           driverGroupList={driverGroupList}
           driversList={driversList}
           handleChangeFilterValues={handleChangeFilterValues}

package/src/components/Orders/WebsocketStatus/index.js

@@ -48,7 +48,7 @@ const SocketStatusUI = (props) => {
   }, [reconnectAttemptCount])
 
   return (
-    <Contatiner>
+    <Contatiner className='websocket-container'>
       <InfoWrapper>
         <IconButton
           color='primary'

package/src/components/Stores/BusinessMenu/index.js

@@ -1,5 +1,6 @@
 import React, { useEffect, useState } from 'react'
 import { useLocation } from 'react-router-dom'
+import Skeleton from 'react-loading-skeleton'
 import { useLanguage, BusinessMenu as BusinessMenuController } from 'ordering-components-admin-external'
 import { BusinessMenuOptions } from '../BusinessMenuOptions'
 import { Confirm, Modal, SearchBar } from '../../Shared'
@@ -160,8 +161,14 @@ const BusinessMenuUI = (props) => {
             {t('SELECT_NONE', 'Select none')}
           </Button>
         </SelectButtonGroup> */}
-
-        {menuList.map((menu, index) => (
+        {businessMenusState?.loading && (
+          [...Array(4).keys()].map(i => (
+            <MeunItem key={i}>
+              <Skeleton width={120} height={24} />
+            </MeunItem>
+          ))
+        )}
+        {!businessMenusState?.loading && menuList.map((menu, index) => (
           <MeunItem
             key={menu.id}
             isBorderTop={index === 0}
@@ -184,6 +191,7 @@ const BusinessMenuUI = (props) => {
           <AddMenuButtonWrapper>
             <LinkButton
               onClick={() => handleOpenOptions('option', {})}
+              disabled={businessMenusState?.loading}
             >
               {t('ADD_MENU', 'Add menu')}
             </LinkButton>

package/src/components/Users/CustomersListing/index.js

@@ -231,9 +231,7 @@ export const CustomersListing = (props) => {
     ...props,
     defaultUserActiveState,
     UIComponent: CustomersListingUI,
-    isSearchByUserEmail: true,
     isSearchByUserPhone: true,
-    isSearchByUserName: true,
     paginationSettings: {
       initialPage: props.isUseQuery && !isNaN(defaultPage) ? Number(defaultPage) : 1,
       pageSize: props.isUseQuery && !isNaN(defaultPage) ? Number(defaultPageSize) : 10,

package/src/components/Users/UserFilterGroup/index.js

@@ -164,34 +164,36 @@ const UserFilterGroupUI = (props) => {
             </FormControl>
           )}
         </FormGroup>
-        <FormGroup>
-          <FormControl>
-            <label>{t('COUNTRY_PHONE_CODE', 'Country phone code')}</label>
-            <DefaultSelect
-              placeholder={t('SELECT_OPTION', 'Select a option')}
-              defaultValue={filterValues?.countryPhoneCode}
-              options={phoneCodeList}
-              onChange={val => handleChangeValue({ countryPhoneCode: val })}
-              optionInnerMaxHeight='300px'
-              className='full-select'
-            />
-          </FormControl>
-          <FormControl>
-            <label>{t('PHONE_NUMBER', 'Phone number')}</label>
-            <Input
-              type='text'
-              placeholder={t('PHONE_NUMBER', 'Phone number')}
-              autoComplete='off'
-              onKeyPress={(e) => {
-                if (!/^[0-9]$/.test(e.key)) {
-                  e.preventDefault()
-                }
-              }}
-              value={filterValues?.cellphone || ''}
-              onChange={(e) => handleChangeValue({ cellphone: e.target.value })}
-            />
-          </FormControl>
-        </FormGroup>
+        {!isCustomers && (
+          <FormGroup>
+            <FormControl>
+              <label>{t('COUNTRY_PHONE_CODE', 'Country phone code')}</label>
+              <DefaultSelect
+                placeholder={t('SELECT_OPTION', 'Select a option')}
+                defaultValue={filterValues?.countryPhoneCode}
+                options={phoneCodeList}
+                onChange={val => handleChangeValue({ countryPhoneCode: val })}
+                optionInnerMaxHeight='300px'
+                className='full-select'
+              />
+            </FormControl>
+            <FormControl>
+              <label>{t('PHONE_NUMBER', 'Phone number')}</label>
+              <Input
+                type='text'
+                placeholder={t('PHONE_NUMBER', 'Phone number')}
+                autoComplete='off'
+                onKeyPress={(e) => {
+                  if (!/^[0-9]$/.test(e.key)) {
+                    e.preventDefault()
+                  }
+                }}
+                value={filterValues?.cellphone || ''}
+                onChange={(e) => handleChangeValue({ cellphone: e.target.value })}
+              />
+            </FormControl>
+          </FormGroup>
+        )}
         <FormGroup>
           <FormControl>
             <label>{t('PHONE_VERIFIED', 'Phone verified')}</label>
@@ -276,6 +278,20 @@ const UserFilterGroupUI = (props) => {
             )}
           </FormGroup>
         )}
+        {isCustomers && (
+          <FormGroup>
+            <FormControl>
+              <label>{t('ID', 'ID')}</label>
+              <Input
+                type='text'
+                placeholder={t('ID', 'ID')}
+                autoComplete='off'
+                value={filterValues?.id || ''}
+                onChange={(e) => handleChangeValue({ id: e.target.value })}
+              />
+            </FormControl>
+          </FormGroup>
+        )}
         <ButtonGroup>
           <Button
             color='primary'

package/src/components/Users/UsersListingHeader/index.js

@@ -68,7 +68,7 @@ export const UsersListingHeader = (props) => {
             isCustomLayout
             onSearch={onSearch}
             search={searchValue}
-            placeholder={t('SEARCH', 'Search')}
+            placeholder={isCustomers ? t('SEARCH_BY_CELLPHONE', 'Search by phone') : t('SEARCH', 'Search')}
           />
           {multiFilterValues && (
             <IconButton