ordering-ui-admin-external 1.10.0 → 1.11.1

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

@@ -1,6 +1,6 @@
 import React, { useState, useEffect } from 'react'
 import { useLocation } from 'react-router-dom'
-import { useLanguage, UsersList as UsersListController } from 'ordering-components-admin-external'
+import { useLanguage, useConfig, UsersList as UsersListController } from 'ordering-components-admin-external'
 import { ProfessionalList } from '../ProfessionalList'
 import { UsersListingHeader } from '../UsersListingHeader'
 import { UserActiveStateFilter } from '../UserActiveStateFilter'
@@ -15,7 +15,8 @@ import { OccupationsFilter } from '../OccupationsFilter'
 import {
   UsersListingContainer,
   ActionsContainer,
-  ActionButtonsGroup
+  ActionButtonsGroup,
+  WarningText
 } from './styles'
 
 const ProfessionalListingUI = (props) => {
@@ -51,11 +52,14 @@ const ProfessionalListingUI = (props) => {
   } = props
 
   const [, t] = useLanguage()
+  const [{ configs }] = useConfig()
+
   const query = new URLSearchParams(useLocation().search)
   const [queryId, setQueryId] = useState(null)
   const [isOpenUserDetails, setIsOpenUserDetails] = useState(false)
   const [openUser, setOpenUser] = useState(null)
   const [openUserAddForm, setOpenUserAddForm] = useState(false)
+  const isEnabledAppointmentsFeature = configs?.appointments?.value
 
   const handleBackRedirect = () => {
     setIsOpenUserDetails(false)
@@ -98,56 +102,62 @@ const ProfessionalListingUI = (props) => {
   return (
     <>
       <UsersListingContainer>
-        <UsersListingHeader
-          isProfessionals
-          title={headerTitle}
-          searchValue={searchValue}
-          onSearch={onSearch}
-        />
-        <UserActiveStateFilter
-          selectedUserActiveState={selectedUserActiveState}
-          handleChangeUserActiveState={handleChangeUserActiveState}
-        />
-        <ActionsContainer>
-          <OccupationsFilter
-            occupationsState={occupationsState}
-            selectedOccupation={selectedOccupation}
-            handleSelectOccupation={handleSelectOccupation}
-          />
-          <ActionButtonsGroup>
-            <Button
-              borderRadius='8px'
-              color='lightPrimary'
-              onClick={() => handleOpenUserAddForm()}
-            >
-              {t('ADD_PROFESSIONAL', 'Add professional')}
-            </Button>
-            <UsersExportCSV
-              defaultUserTypesSelected={defaultUserTypesSelected}
-              disabledActiveStateCondition={disabledActiveStateCondition}
-              userTypesSelected={userTypesSelected}
+        {isEnabledAppointmentsFeature ? (
+          <>
+            <UsersListingHeader
+              isProfessionals
+              title={headerTitle}
+              searchValue={searchValue}
+              onSearch={onSearch}
+            />
+            <UserActiveStateFilter
               selectedUserActiveState={selectedUserActiveState}
+              handleChangeUserActiveState={handleChangeUserActiveState}
             />
-            <UsersDeleteButton
+            <ActionsContainer>
+              <OccupationsFilter
+                occupationsState={occupationsState}
+                selectedOccupation={selectedOccupation}
+                handleSelectOccupation={handleSelectOccupation}
+              />
+              <ActionButtonsGroup>
+                <Button
+                  borderRadius='8px'
+                  color='lightPrimary'
+                  onClick={() => handleOpenUserAddForm()}
+                >
+                  {t('ADD_PROFESSIONAL', 'Add professional')}
+                </Button>
+                <UsersExportCSV
+                  defaultUserTypesSelected={defaultUserTypesSelected}
+                  disabledActiveStateCondition={disabledActiveStateCondition}
+                  userTypesSelected={userTypesSelected}
+                  selectedUserActiveState={selectedUserActiveState}
+                />
+                <UsersDeleteButton
+                  selectedUsers={selectedUsers}
+                  deleteUsersActionState={deleteUsersActionState}
+                  handleDeleteSeveralUsers={handleDeleteSeveralUsers}
+                />
+              </ActionButtonsGroup>
+            </ActionsContainer>
+            <ProfessionalList
+              usersList={usersList}
+              getUsers={getUsers}
+              paginationProps={paginationProps}
+              paginationDetail={paginationDetail}
+              handleChangeActiveUser={handleChangeActiveUser}
               selectedUsers={selectedUsers}
-              deleteUsersActionState={deleteUsersActionState}
-              handleDeleteSeveralUsers={handleDeleteSeveralUsers}
+              handleSelectedUsers={handleSelectedUsers}
+              userDetailsId={openUser?.id || queryId}
+              handleOpenUserDetails={handleOpenUserDetails}
+              handleOpenUserAddForm={handleOpenUserAddForm}
+              setSelectedUsers={setSelectedUsers}
             />
-          </ActionButtonsGroup>
-        </ActionsContainer>
-        <ProfessionalList
-          usersList={usersList}
-          getUsers={getUsers}
-          paginationProps={paginationProps}
-          paginationDetail={paginationDetail}
-          handleChangeActiveUser={handleChangeActiveUser}
-          selectedUsers={selectedUsers}
-          handleSelectedUsers={handleSelectedUsers}
-          userDetailsId={openUser?.id || queryId}
-          handleOpenUserDetails={handleOpenUserDetails}
-          handleOpenUserAddForm={handleOpenUserAddForm}
-          setSelectedUsers={setSelectedUsers}
-        />
+          </>
+        ) : (
+          <WarningText>{t('APPOINTMENTS_FEATURE_NOT_ENABLED', 'The appointments feature is not enabled.')}</WarningText>
+        )}
       </UsersListingContainer>
 
       {isOpenUserDetails && (
@@ -183,6 +193,7 @@ const ProfessionalListingUI = (props) => {
 export const ProfessionalListing = (props) => {
   const usersListingProps = {
     ...props,
+    isProfessional: true,
     UIComponent: ProfessionalListingUI,
     isSearchByUserEmail: true,
     isSearchByUserPhone: true,

package/src/components/Users/ProfessionalListing/styles.js

@@ -44,3 +44,7 @@ export const ActionButtonsGroup = styled.div`
     margin-top: 0;
   }
 `
+export const WarningText = styled.p`
+  margin-top: 30px;
+  color: ${props => props.theme.colors.danger};
+`

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

@@ -274,7 +274,6 @@ export const UsersList = (props) => {
                 totalPages={paginationProps.totalPages}
                 handleChangePage={handleChangePage}
                 handleChangePageSize={handleChangePageSize}
-                defaultPageSize={paginationProps?.pageSize}
               />
             </WrapperPagination>
           )}

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

@@ -211,6 +211,7 @@ export const UsersBottomContainer = styled.div`
   justify-content: space-between;
   align-items: center;
   margin-top: 10px;
+  margin-bottom: 37px;
 `
 
 export const VerifiedItem = styled.span`

package/src/index.js

@@ -141,6 +141,7 @@ import {
 import { HomePage } from './components/Home'
 import { LoginForm, ForgotPasswordForm, QueryLogin, ResetPassword } from './components/Login'
 import {
+  AdBannersListing,
   EnterprisePromotionListing,
   CampaignListing,
   EnterprisePromotionList,
@@ -308,7 +309,9 @@ import {
   ProductStartGuide,
   ImportersButton,
   RestaurantSelectGuide,
-  ProductStep
+  ProductStep,
+  BusinessSync,
+  BusinessDelete
 } from './components/Stores'
 import {
   CustomersListing,
@@ -384,7 +387,7 @@ import {
 import { LogoutButton } from './components/LogoutButton'
 import { LanguageSelector } from './components/LanguageSelector'
 
-import { capitalize, verifyDecimals } from './utils'
+import { capitalize, verifyDecimals, setStorageItem, getStorageItem } from './utils'
 
 // contexts
 import { ThemeContext, ThemeProvider, useTheme } from './contexts/ThemeContext'
@@ -543,6 +546,7 @@ export {
   QueryLogin,
   ResetPassword,
 
+  AdBannersListing,
   EnterprisePromotionListing,
   CampaignListing,
   EnterprisePromotionList,
@@ -714,6 +718,8 @@ export {
   ImportersButton,
   RestaurantSelectGuide,
   ProductStep,
+  BusinessSync,
+  BusinessDelete,
 
   LogoutButton,
   LanguageSelector,
@@ -787,6 +793,8 @@ export {
 
   capitalize,
   verifyDecimals,
+  setStorageItem,
+  getStorageItem,
 
   // contexts
   ThemeContext,

package/src/styles/Select/index.js

@@ -35,7 +35,10 @@ export const Select = (props) => {
     searchBarIsCustomLayout,
     searchBarPlaceholder,
     searchBarIsNotLazyLoad,
-    className
+    className,
+    isShowCustomOption,
+    customOptionTitle,
+    handleCustomOptionClick
   } = props
   const defaultOption = options?.find(
     (option) => option.value === defaultValue
@@ -142,7 +145,7 @@ export const Select = (props) => {
         )}
         {selectedOption && (
           <Selected>
-            <Header>
+            <Header className='header'>
               {selectedOption.showOnSelected || selectedOption.content}
             </Header>
             <Chevron>
@@ -179,12 +182,24 @@ export const Select = (props) => {
                 optionBottomBorder={props.optionBottomBorder}
                 disabled={option.disabled}
                 showDisable={option?.showDisable}
-                className={option.disabled ? 'disabled' : null}
+                className={option.disabled ? 'option disabled' : 'option'}
               >
                 {option.content}
               </Option>
             ))}
           </OptionsInner>
+
+          {isShowCustomOption && (
+            <Option
+              className='option custom-option'
+              onClick={() => {
+                handleCustomOptionClick()
+                setOpen(false)
+              }}
+            >
+              {customOptionTitle}
+            </Option>
+          )}
         </Options>
       </PopoverBody>
     </div>

package/src/utils/index.js

@@ -26,6 +26,14 @@ export const getIconCard = (brand = '') => {
       return <FaCreditCard />
   }
 }
+/**
+ * Function to get unique id
+ */
+export const getUniqueId = () => {
+  const dateString = Date.now().toString(36)
+  const randomness = Math.random().toString(36).substr(2)
+  return dateString + randomness
+}
 
 /**
  * Function to convert a string in string capitalized

package/template/app.js

@@ -69,6 +69,7 @@ import { CampaignListing } from './pages/CampaignListing'
 import { Professionals } from './pages/Professionals'
 import { QueryLogin } from '../src/components/Login'
 import { PluginSettings } from './pages/PluginSettings'
+import { AdBannersList } from './pages/AdBannersList'
 import { Profile } from './pages/Profile'
 import settings from './config.json'
 import { BusinessAdd } from './pages/BusinessAdd'
@@ -284,6 +285,9 @@ export const App = () => {
                     <ProtectedRoute path='/marketing/campaign' allowedLevels={[0]}>
                       <CampaignListing />
                     </ProtectedRoute>
+                    <ProtectedRoute path='/marketing/ad-banners' allowedLevels={[0]}>
+                      <AdBannersList />
+                    </ProtectedRoute>
 
                     <ProtectedRoute path='/loyalty/rewards-programs' allowedLevels={[0]}>
                       <RewardsPrograms />

package/template/components/ListenPageChanges/index.js

@@ -52,6 +52,7 @@ export const ListenPageChanges = ({ children }) => {
     drivers_groups: '/delivery/drivers-groups',
     enterprise_promotions: '/marketing/promotions-enterprise',
     campaign: '/marketing/campaign',
+    ad_banners: '/marketing/ad-banners',
     ordering_products: '/ordering-products',
     support: '/support',
     rewards_programs: '/loyalty/rewards-programs',

package/template/helmetdata.json

@@ -349,6 +349,13 @@
     "robots": "index, follow",
     "canonicalUrl": ""
   },
+  "ad_banners": {
+    "title": "Ad banners",
+    "description": "a dummy description about this page",
+    "keywords": "test, dummy, data",
+    "robots": "index, follow",
+    "canonicalUrl": ""
+  },
   "reset_password": {
     "title": "Reset Password",
     "description": "a dummy description about this page",

package/template/pages/AdBannersList/index.js

@@ -0,0 +1,12 @@
+import React from 'react'
+import { HelmetTags } from '../../components/HelmetTags'
+import { AdBannersListing as AdBannersListController } from '../../../src/components/Marketing'
+
+export const AdBannersList = (props) => {
+  return (
+    <>
+      <HelmetTags page='ad_banners' />
+      <AdBannersListController {...props} />
+    </>
+  )
+}

package/template/pages/BusinessAdd/index.js

@@ -1,11 +1,20 @@
 import React from 'react'
 import { HelmetTags } from '../../components/HelmetTags'
+import { useLocation } from 'react-router-dom'
 import { BusinessAdd as BusinessAddController } from '../../../src/components/Stores'
 export const BusinessAdd = (props) => {
+  const { search } = useLocation()
+  const placeId = search?.split('=')[1]
+
+  const businessAddProps = {
+    placeId,
+    ...props
+  }
+
   return (
     <>
       <HelmetTags page='business_add' />
-      <BusinessAddController {...props} />
+      <BusinessAddController {...businessAddProps} />
     </>
   )
 }

package/template/pages/Professionals/index.js

@@ -8,7 +8,6 @@ export const Professionals = (props) => {
   const [events] = useEvent()
   const professionalProps = {
     ...props,
-    isProfessional: true,
     headerTitle: t('PROFESSIONALS', 'Professionals'),
     defaultUserTypesSelected: [8],
     propsToFetch: [