ordering-ui-admin-external 1.3.2 → 1.3.3

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

@@ -1,8 +1,6 @@
 import React, { useState, useEffect } from 'react'
 import {
   useLanguage,
-  useConfig,
-  useSession,
   ImporterListing as ImportersListingController
 } from 'ordering-components-admin-external'
 
@@ -13,7 +11,6 @@ import { ImporterForm } from '../ImporterForm'
 import { ImporterJobForm } from '../ImporterJobForm'
 import { ImporterHelpContent } from '../ImporterHelpContent'
 import { SideBar, Modal } from '../../Shared'
-import { DisabledFeatureAlert } from '../../DisabledFeatureAlert'
 
 import {
   ImportersListingContainer,
@@ -33,9 +30,6 @@ export const ImportersListingUI = (props) => {
     handleSuccessUpdateImporter
   } = props
   const [, t] = useLanguage()
-  const [{ configs }] = useConfig()
-  const [{ user }] = useSession()
-  const featureName = 'massive_importer'
   const [openNewImporter, setOpenNewImporter] = useState(false)
   const [openImporterHelp, setOpenImporterHelp] = useState(false)
   const [openImportCsv, setOpenImportCsv] = useState(false)
@@ -43,7 +37,6 @@ export const ImportersListingUI = (props) => {
   const [selectedImporterJob, setSelectedImporterJob] = useState({})
   const [importJobFormMoveDistance, setImportJobFormMoveDistance] = useState(0)
   const [openMappingDetails, setOpenMappingDetails] = useState(false)
-  const [isDisabledFeature, setIsDisabledFeature] = useState(false)
 
   const addNewImporter = () => {
     setSelectedImporter({})
@@ -70,14 +63,6 @@ export const ImportersListingUI = (props) => {
     setExtraOpen && setExtraOpen(openNewImporter)
   }, [openNewImporter])
 
-  useEffect(() => {
-    if (configs && Object.keys(configs).length > 0 && user) {
-      if (!Object.keys(configs).includes(featureName) && user?.level === 0) {
-        setIsDisabledFeature(true)
-      }
-    }
-  }, [configs])
-
   return (
     <>
       <ImportersListingContainer>
@@ -87,7 +72,6 @@ export const ImportersListingUI = (props) => {
             <IconButton
               color='primary'
               onClick={() => setOpenImporterHelp(true)}
-              disabled={isDisabledFeature}
             >
               <InfoCircle />
             </IconButton>
@@ -97,7 +81,6 @@ export const ImportersListingUI = (props) => {
               color='lightPrimary'
               borderRadius='5px'
               onClick={() => addNewImporter()}
-              disabled={isDisabledFeature}
             >
               {t('ADD_IMPORTER', 'Add importer')}
             </Button>
@@ -112,9 +95,7 @@ export const ImportersListingUI = (props) => {
           selectedImporter={selectedImporter}
           setSelectedImporter={setSelectedImporter}
           handleEditImporter={handleEditImporter}
-          isDisabledFeature={isDisabledFeature}
         />
-        {isDisabledFeature && (<DisabledFeatureAlert />)}
         {openNewImporter && (
           <SideBar
             isBorderShow={!openMappingDetails}

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

@@ -9,7 +9,6 @@ import { useTheme } from 'styled-components'
 import { ThreeDots, XLg } from 'react-bootstrap-icons'
 import { Dropdown, DropdownButton } from 'react-bootstrap'
 import { Confirm } from '../../Shared'
-import { DisabledFeatureAlert } from '../../DisabledFeatureAlert'
 
 import {
   Container,
@@ -32,8 +31,7 @@ export const PaymentOption = (props) => {
     actionState,
     handleSaveClick,
     businessPaymethod,
-    handleDeletePaymethod,
-    isDisabledFeature
+    handleDeletePaymethod
   } = props
 
   const theme = useTheme()
@@ -153,8 +151,7 @@ export const PaymentOption = (props) => {
           sitesState?.sites.map(site => (
             <TabOption
               key={site.id}
-              onClick={() => !isDisabledFeature && setPaymethodInfo({ key: 'sites', value: site.id })}
-              isDisabledFeature={isDisabledFeature}
+              onClick={() => setPaymethodInfo({ key: 'sites', value: site.id })}
             >
               {(changesState?.sites ?? businessPaymethod?.sites?.map(s => s.id))?.includes(site.id) ? (
                 <RiCheckboxFill className='fill' />
@@ -170,8 +167,7 @@ export const PaymentOption = (props) => {
           orderTypes.map(type => (
             <TabOption
               key={type.value}
-              onClick={() => !isDisabledFeature && setPaymethodInfo({ key: 'allowed_order_types', value: type.value })}
-              isDisabledFeature={isDisabledFeature}
+              onClick={() => setPaymethodInfo({ key: 'allowed_order_types', value: type.value })}
             >
               {(changesState?.allowed_order_types ?? businessPaymethod?.allowed_order_types)?.includes(type.value) ? (
                 <RiCheckboxFill className='fill' />
@@ -186,13 +182,12 @@ export const PaymentOption = (props) => {
         <Button
           borderRadius='5px'
           color='primary'
-          disabled={isDisabledFeature || actionState.loading || Object.keys(changesState).length === 0}
+          disabled={actionState.loading || Object.keys(changesState).length === 0}
           onClick={() => handleSaveClick(businessPaymethod.id)}
         >
           {actionState.loading ? t('LOADING', 'Loading') : t('SAVE', 'Save')}
         </Button>
       </Container>
-      {isDisabledFeature && (<DisabledFeatureAlert />)}
       <Confirm
         width='700px'
         title={t('WEB_APPNAME', 'Ordering')}

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

@@ -8,7 +8,6 @@ import { useTheme } from 'styled-components'
 import { ThreeDots, XLg } from 'react-bootstrap-icons'
 import { Dropdown, DropdownButton } from 'react-bootstrap'
 import { Confirm } from '../../Shared'
-import { DisabledFeatureAlert } from '../../DisabledFeatureAlert'
 
 import {
   Container,
@@ -38,8 +37,7 @@ export const PaymentOptionMethods = (props) => {
     businessPaymethod,
     handleDeletePaymethod,
     id,
-    title,
-    isDisabledFeature
+    title
   } = props
 
   const theme = useTheme()
@@ -225,8 +223,7 @@ export const PaymentOptionMethods = (props) => {
           sitesState?.sites.map(site => (
             <TabOption
               key={site.id}
-              isDisabledFeature={isDisabledFeature}
-              onClick={() => !isDisabledFeature && setPaymethodInfo({ key: 'sites', value: site.id })}
+              onClick={() => setPaymethodInfo({ key: 'sites', value: site.id })}
             >
               {(changesState?.sites ?? businessPaymethod?.sites?.map(s => s.id))?.includes(site.id) ? (
                 <RiCheckboxFill className='fill' />
@@ -242,8 +239,7 @@ export const PaymentOptionMethods = (props) => {
           orderTypes.map(type => (
             <TabOption
               key={type.value}
-              isDisabledFeature={isDisabledFeature}
-              onClick={() => !isDisabledFeature && setPaymethodInfo({ key: 'allowed_order_types', value: type.value })}
+              onClick={() => setPaymethodInfo({ key: 'allowed_order_types', value: type.value })}
             >
               {(changesState?.allowed_order_types ?? businessPaymethod?.allowed_order_types)?.includes(type.value) ? (
                 <RiCheckboxFill className='fill' />
@@ -264,7 +260,6 @@ export const PaymentOptionMethods = (props) => {
           {actionState.loading ? t('LOADING', 'Loading') : t('SAVE', 'Save')}
         </Button>
       </Container>
-      {(isDisabledFeature && (paymentTabs === 1 || paymentTabs === 2)) && (<DisabledFeatureAlert />)}
       <Confirm
         width='700px'
         title={t('WEB_APPNAME', 'Ordering')}

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

@@ -8,7 +8,6 @@ import { useTheme } from 'styled-components'
 import { ThreeDots, XLg } from 'react-bootstrap-icons'
 import { Dropdown, DropdownButton } from 'react-bootstrap'
 import { Confirm } from '../../Shared'
-import { DisabledFeatureAlert } from '../../DisabledFeatureAlert'
 
 import {
   Container,
@@ -36,8 +35,7 @@ export const PaymentOptionPaypal = (props) => {
     handleSaveClick,
     businessPaymethod,
     handleChangeBusinessPaymentState,
-    handleDeletePaymethod,
-    isDisabledFeature
+    handleDeletePaymethod
   } = props
 
   const theme = useTheme()
@@ -225,8 +223,7 @@ export const PaymentOptionPaypal = (props) => {
           sitesState?.sites.map(site => (
             <TabOption
               key={site.id}
-              isDisabledFeature={isDisabledFeature}
-              onClick={() => !isDisabledFeature && setPaymethodInfo({ key: 'sites', value: site.id })}
+              onClick={() => setPaymethodInfo({ key: 'sites', value: site.id })}
             >
               {(changesState?.sites ?? businessPaymethod?.sites?.map(s => s.id))?.includes(site.id) ? (
                 <RiCheckboxFill className='fill' />
@@ -242,8 +239,7 @@ export const PaymentOptionPaypal = (props) => {
           orderTypes.map(type => (
             <TabOption
               key={type.value}
-              isDisabledFeature={isDisabledFeature}
-              onClick={() => !isDisabledFeature && setPaymethodInfo({ key: 'allowed_order_types', value: type.value })}
+              onClick={() => setPaymethodInfo({ key: 'allowed_order_types', value: type.value })}
             >
               {(changesState?.allowed_order_types ?? businessPaymethod?.allowed_order_types)?.includes(type.value) ? (
                 <RiCheckboxFill className='fill' />
@@ -264,7 +260,6 @@ export const PaymentOptionPaypal = (props) => {
           {actionState.loading ? t('LOADING', 'Loading') : t('SAVE', 'Save')}
         </Button>
       </Container>
-      {(isDisabledFeature && (paymentTabs === 1 || paymentTabs === 2)) && (<DisabledFeatureAlert />)}
       <Confirm
         width='700px'
         title={t('WEB_APPNAME', 'Ordering')}

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

@@ -11,7 +11,6 @@ import { TabOption, TabOptionName } from '../PaymentOptionStripeDirect/styles'
 import RiCheckboxBlankLine from '@meronex/icons/ri/RiCheckboxBlankLine'
 import RiCheckboxFill from '@meronex/icons/ri/RiCheckboxFill'
 import SiSquare from '@meronex/icons/si/SiSquare'
-import { DisabledFeatureAlert } from '../../DisabledFeatureAlert'
 
 import {
   Container,
@@ -41,8 +40,7 @@ const PaymentOptionSquareUI = (props) => {
     handleSavePaymethod,
     handleChangeDataInput,
     handleChangeSanboxDataInput,
-    handleChangeSandbox,
-    isDisabledFeature
+    handleChangeSandbox
   } = props
 
   const theme = useTheme()
@@ -249,8 +247,7 @@ const PaymentOptionSquareUI = (props) => {
           sitesState?.sites.map(site => (
             <TabOption
               key={site.id}
-              isDisabledFeature={isDisabledFeature}
-              onClick={() => !isDisabledFeature && setPaymethodInfo({ key: 'sites', value: site.id })}
+              onClick={() => setPaymethodInfo({ key: 'sites', value: site.id })}
             >
               {(changesState?.sites ?? businessPaymethod?.sites?.map(s => s.id))?.includes(site.id) ? (
                 <RiCheckboxFill className='fill' />
@@ -265,8 +262,7 @@ const PaymentOptionSquareUI = (props) => {
           orderTypes.map(type => (
             <TabOption
               key={type.value}
-              isDisabledFeature={isDisabledFeature}
-              onClick={() => !isDisabledFeature && setPaymethodInfo({ key: 'allowed_order_types', value: type.value })}
+              onClick={() => setPaymethodInfo({ key: 'allowed_order_types', value: type.value })}
             >
               {(changesState?.allowed_order_types ?? businessPaymethod?.allowed_order_types)?.includes(type.value) ? (
                 <RiCheckboxFill className='fill' />
@@ -299,7 +295,6 @@ const PaymentOptionSquareUI = (props) => {
           closeOnBackdrop={false}
         />
       </Container>
-      {(isDisabledFeature && (paymentTabs === 1 || paymentTabs === 2)) && (<DisabledFeatureAlert />)}
     </>
   )
 }

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

@@ -8,7 +8,6 @@ import { useTheme } from 'styled-components'
 import { ThreeDots, XLg } from 'react-bootstrap-icons'
 import { Dropdown, DropdownButton } from 'react-bootstrap'
 import { Confirm } from '../../Shared'
-import { DisabledFeatureAlert } from '../../DisabledFeatureAlert'
 
 import {
   Container,
@@ -36,8 +35,7 @@ export const PaymentOptionStripeDirect = (props) => {
     handleChangeInput,
     handleSaveClick,
     businessPaymethod,
-    handleDeletePaymethod,
-    isDisabledFeature
+    handleDeletePaymethod
   } = props
 
   const theme = useTheme()
@@ -223,8 +221,7 @@ export const PaymentOptionStripeDirect = (props) => {
           sitesState?.sites.map(site => (
             <TabOption
               key={site.id}
-              onClick={() => !isDisabledFeature && setPaymethodInfo({ key: 'sites', value: site.id })}
-              isDisabledFeature={isDisabledFeature}
+              onClick={() => setPaymethodInfo({ key: 'sites', value: site.id })}
             >
               {(changesState?.sites ?? businessPaymethod?.sites?.map(s => s.id))?.includes(site.id) ? (
                 <RiCheckboxFill className='fill' />
@@ -240,8 +237,7 @@ export const PaymentOptionStripeDirect = (props) => {
           orderTypes.map(type => (
             <TabOption
               key={type.value}
-              isDisabledFeature={isDisabledFeature}
-              onClick={() => !isDisabledFeature && setPaymethodInfo({ key: 'allowed_order_types', value: type.value })}
+              onClick={() => setPaymethodInfo({ key: 'allowed_order_types', value: type.value })}
             >
               {(changesState?.allowed_order_types ?? businessPaymethod?.allowed_order_types)?.includes(type.value) ? (
                 <RiCheckboxFill className='fill' />
@@ -262,7 +258,6 @@ export const PaymentOptionStripeDirect = (props) => {
           {actionState.loading ? t('LOADING', 'Loading') : t('SAVE', 'Save')}
         </Button>
       </Container>
-      {(isDisabledFeature && (paymentTabs === 1 || paymentTabs === 2)) && (<DisabledFeatureAlert />)}
       <Confirm
         width='700px'
         title={t('WEB_APPNAME', 'Ordering')}

package/src/components/Stores/PaymentOptionStripeDirect/styles.js

@@ -89,14 +89,6 @@ export const TabOption = styled.div`
       color: ${props => props.theme.colors.primary};
     }
   }
-
-  ${({ isDisabledFeature }) => isDisabledFeature && css`
-      cursor: not-allowed;
-      opacity: 0.4;
-      &:hover {
-        background-color: ${props => props.theme.colors.white};
-      }
-  `}
 `
 
 export const TabOptionName = styled.span`

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

@@ -8,7 +8,6 @@ import { useTheme } from 'styled-components'
 import { ThreeDots, XLg } from 'react-bootstrap-icons'
 import { Dropdown, DropdownButton } from 'react-bootstrap'
 import { Confirm } from '../../Shared'
-import { DisabledFeatureAlert } from '../../DisabledFeatureAlert'
 
 import {
   Container,
@@ -36,8 +35,7 @@ export const PaymethodOptionPaypalExpress = (props) => {
     businessPaymethod,
     orderTypes,
     handleChangeBusinessPaymentState,
-    handleDeletePaymethod,
-    isDisabledFeature
+    handleDeletePaymethod
   } = props
 
   const theme = useTheme()
@@ -205,8 +203,7 @@ export const PaymethodOptionPaypalExpress = (props) => {
           sitesState?.sites.map(site => (
             <TabOption
               key={site.id}
-              isDisabledFeature={isDisabledFeature}
-              onClick={() => !isDisabledFeature && setPaymethodInfo({ key: 'sites', value: site.id })}
+              onClick={() => setPaymethodInfo({ key: 'sites', value: site.id })}
             >
               {(changesState?.sites ?? businessPaymethod?.sites?.map(s => s.id))?.includes(site.id) ? (
                 <RiCheckboxFill className='fill' />
@@ -222,8 +219,7 @@ export const PaymethodOptionPaypalExpress = (props) => {
           orderTypes.map(type => (
             <TabOption
               key={type.value}
-              isDisabledFeature={isDisabledFeature}
-              onClick={() => !isDisabledFeature && setPaymethodInfo({ key: 'allowed_order_types', value: type.value })}
+              onClick={() => setPaymethodInfo({ key: 'allowed_order_types', value: type.value })}
             >
               {(changesState?.allowed_order_types ?? businessPaymethod?.allowed_order_types)?.includes(type.value) ? (
                 <RiCheckboxFill className='fill' />
@@ -244,7 +240,6 @@ export const PaymethodOptionPaypalExpress = (props) => {
           {actionState.loading ? t('LOADING', 'Loading') : t('SAVE', 'Save')}
         </Button>
       </Container>
-      {(isDisabledFeature && (paymentTabs === 1 || paymentTabs === 2)) && (<DisabledFeatureAlert />)}
       <Confirm
         width='700px'
         title={t('WEB_APPNAME', 'Ordering')}

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

@@ -9,7 +9,6 @@ import { useTheme } from 'styled-components'
 import { ThreeDots, XLg } from 'react-bootstrap-icons'
 import { Dropdown, DropdownButton } from 'react-bootstrap'
 import { Confirm } from '../../Shared'
-import { DisabledFeatureAlert } from '../../DisabledFeatureAlert'
 
 import {
   Container,
@@ -39,8 +38,7 @@ export const PaymethodOptionStripeConnect = (props) => {
     businessPaymethod,
     orderTypes,
     handleChangeBusinessPaymentState,
-    handleDeletePaymethod,
-    isDisabledFeature
+    handleDeletePaymethod
   } = props
 
   const theme = useTheme()
@@ -249,8 +247,7 @@ export const PaymethodOptionStripeConnect = (props) => {
           sitesState?.sites.map(site => (
             <TabOption
               key={site.id}
-              isDisabledFeature={isDisabledFeature}
-              onClick={() => !isDisabledFeature && setPaymethodInfo({ key: 'sites', value: site.id })}
+              onClick={() => setPaymethodInfo({ key: 'sites', value: site.id })}
             >
               {(changesState?.sites ?? businessPaymethod?.sites?.map(s => s.id))?.includes(site.id) ? (
                 <RiCheckboxFill className='fill' />
@@ -266,8 +263,7 @@ export const PaymethodOptionStripeConnect = (props) => {
           orderTypes.map(type => (
             <TabOption
               key={type.value}
-              isDisabledFeature={isDisabledFeature}
-              onClick={() => !isDisabledFeature && setPaymethodInfo({ key: 'allowed_order_types', value: type.value })}
+              onClick={() => setPaymethodInfo({ key: 'allowed_order_types', value: type.value })}
             >
               {(changesState?.allowed_order_types ?? businessPaymethod?.allowed_order_types)?.includes(type.value) ? (
                 <RiCheckboxFill className='fill' />
@@ -288,7 +284,6 @@ export const PaymethodOptionStripeConnect = (props) => {
           {actionState.loading ? t('LOADING', 'Loading') : t('SAVE', 'Save')}
         </Button>
       </Container>
-      {(isDisabledFeature && (paymentTabs === 1 || paymentTabs === 2)) && (<DisabledFeatureAlert />)}
       <Confirm
         width='700px'
         title={t('WEB_APPNAME', 'Ordering')}

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

@@ -8,7 +8,6 @@ import { useTheme } from 'styled-components'
 import { ThreeDots, XLg } from 'react-bootstrap-icons'
 import { Dropdown, DropdownButton } from 'react-bootstrap'
 import { Confirm } from '../../Shared'
-import { DisabledFeatureAlert } from '../../DisabledFeatureAlert'
 
 import {
   Container,
@@ -36,8 +35,7 @@ export const PaymethodOptionStripeRedirect = (props) => {
     businessPaymethod,
     orderTypes,
     handleChangeBusinessPaymentState,
-    handleDeletePaymethod,
-    isDisabledFeature
+    handleDeletePaymethod
   } = props
 
   const theme = useTheme()
@@ -223,8 +221,7 @@ export const PaymethodOptionStripeRedirect = (props) => {
           sitesState?.sites.map(site => (
             <TabOption
               key={site.id}
-              isDisabledFeature={isDisabledFeature}
-              onClick={() => !isDisabledFeature && setPaymethodInfo({ key: 'sites', value: site.id })}
+              onClick={() => setPaymethodInfo({ key: 'sites', value: site.id })}
             >
               {(changesState?.sites ?? businessPaymethod?.sites?.map(s => s.id))?.includes(site.id) ? (
                 <RiCheckboxFill className='fill' />
@@ -240,8 +237,7 @@ export const PaymethodOptionStripeRedirect = (props) => {
           orderTypes.map(type => (
             <TabOption
               key={type.value}
-              isDisabledFeature={isDisabledFeature}
-              onClick={() => !isDisabledFeature && setPaymethodInfo({ key: 'allowed_order_types', value: type.value })}
+              onClick={() => setPaymethodInfo({ key: 'allowed_order_types', value: type.value })}
             >
               {(changesState?.allowed_order_types ?? businessPaymethod?.allowed_order_types)?.includes(type.value) ? (
                 <RiCheckboxFill className='fill' />
@@ -262,7 +258,6 @@ export const PaymethodOptionStripeRedirect = (props) => {
           {actionState.loading ? t('LOADING', 'Loading') : t('SAVE', 'Save')}
         </Button>
       </Container>
-      {(isDisabledFeature && (paymentTabs === 1 || paymentTabs === 2)) && (<DisabledFeatureAlert />)}
       <Confirm
         width='700px'
         title={t('WEB_APPNAME', 'Ordering')}