ordering-ui-external 2.2.2 → 2.3.0

package/src/themes/five/src/components/SignUpForm/index.js

@@ -117,6 +117,7 @@ const SignUpFormUI = (props) => {
   const [isValidPhoneNumber, setIsValidPhoneNumber] = useState(null)
   const [passwordSee, setPasswordSee] = useState(false)
   const [fieldNumber, setFieldNumber] = useState(1)
+  const [currentPhoneNumber, setCurrentPhoneNumber] = useState(null)
 
   const showInputPhoneNumber = (validationFields?.fields?.checkout?.cellphone?.enabled ?? false) || configs?.verification_phone_required?.value === '1'
 
@@ -205,7 +206,12 @@ const SignUpFormUI = (props) => {
       generateOtpCode()
       return
     }
-    handleButtonSignupClick && handleButtonSignupClick()
+    handleButtonSignupClick &&
+    handleButtonSignupClick({
+      ...signupData,
+      cellphone:
+        currentPhoneNumber?.split(' ')[1]?.replace(/-/g, '') ?? signupData?.cellphone
+    })
     if (!formState.loading && formState.result.result && !formState.result.error) {
       handleSuccessSignup(formState.result.result)
     }
@@ -481,8 +487,10 @@ const SignUpFormUI = (props) => {
                         )}
                         <InputPhoneNumber
                           value={userPhoneNumber}
+                          currentCountryCode={signupData?.country_phone_code}
                           setValue={handleChangePhoneNumber}
                           handleIsValid={setIsValidPhoneNumber}
+                          setCurrentPhoneNumber={setCurrentPhoneNumber}
                           isError={formMethods.errors?.cellphone && !userPhoneNumber}
                         />
                       </>

package/src/themes/five/src/styles/Buttons/index.js

@@ -262,6 +262,30 @@ export const Button = styled.button`
       }
     `}
   `}
+  ${({ color }) => color === 'black' && css`
+    background: ${props => props.theme.colors.black};;
+    color: ${props => props.theme.colors.backgroundPage};
+    border-color: ${props => props.theme.colors.black};
+    &:active {
+      background: ${props => darken(0.05, props.theme.colors.black)};
+    }
+    &:hover {
+      background: ${props => darken(0.07, props.theme.colors.black)};
+    }
+    ${({ outline }) => outline && css`
+      background: ${props => props.theme.colors.backgroundPage};
+      color: ${props => props.theme.colors.black};
+      border-color: ${props => props.theme.colors.black};
+      &:active {
+        color: ${props => props.theme.colors.backgroundPage};
+        background: ${props => props.theme.colors.black};
+      }
+      &:hover {
+        background: ${props => darken(0.07, props.theme.colors.black)};
+        color: ${props => props.theme.colors.backgroundPage};
+      }
+    `}
+  `}
 `
 
 export default Button

package/template/app.js

@@ -32,6 +32,7 @@ import { orderingThemeUpdated } from './components/OrderingThemeUpdated'
 
 import { SpinnerLoader } from '../src/components/SpinnerLoader'
 import { Input } from '../src/themes/five/src/styles/Inputs'
+import { QueryLoginSpoonity } from '../src/themes/five/src/components/QueryLoginSpoonity'
 
 const Header = loadable(() => import('../src/themes/five/src/components/Header'))
 const HeaderKiosk = loadable(() => import('../src/themes/five/src/components/Header/layouts/Kiosk'))
@@ -109,11 +110,21 @@ export const App = () => {
     reviewStatus: { trigger: false, order: false, product: false, driver: false },
     reviewed: { isOrderReviewed: false, isProductReviewed: false, isDriverReviewed: false }
   })
+  const unaddressedTypes = configs?.unaddressed_order_types_allowed?.value.split('|').map(value => Number(value)) || []
+  const isAllowUnaddressOrderType = unaddressedTypes.includes(orderStatus?.options?.type)
   const isShowReviewsPopupEnabled = configs?.show_reviews_popups_enabled?.value === '1'
   const hashKey = new URLSearchParams(useLocation()?.search)?.get('hash') || null
   const isKioskApp = settings?.use_kiosk
   const enabledPoweredByOrdering = configs?.powered_by_ordering_module?.value
 
+  let queryIntegrationToken
+  let queryIntegrationCode
+  if (location.search) {
+    const query = new URLSearchParams(location.search)
+    queryIntegrationCode = query.get('integration_code')
+    queryIntegrationToken = query.get('integration_token')
+  }
+
   const themeUpdated = {
     ...theme,
     ...orderingTheme?.theme,
@@ -478,10 +489,10 @@ export const App = () => {
                     ) : (
                       isKioskApp
                         ? <HomePage />
-                        : orderStatus.options?.address?.location
+                        : (orderStatus.options?.address?.location || isAllowUnaddressOrderType)
                           ? <Redirect to={singleBusinessConfig.isActive ? `/${singleBusinessConfig.businessSlug}` : '/search'} />
                           : singleBusinessConfig.isActive
-                            ? <Redirect to={singleBusinessConfig.isActive ? '' : '/search'} />
+                            ? <Redirect to={`/${singleBusinessConfig.businessSlug}`} />
                             : <HomePage />
                     )}
                   </Route>
@@ -491,9 +502,13 @@ export const App = () => {
                     ) : (
                       isKioskApp
                         ? <HomePage />
-                        : orderStatus.options?.address?.location
-                          ? <Redirect to={singleBusinessConfig.isActive ? `/${singleBusinessConfig.businessSlug}` : '/search'} />
-                          : <HomePage />
+                        : queryIntegrationToken && queryIntegrationCode === 'spoonity'
+                          ? <QueryLoginSpoonity token={queryIntegrationToken} />
+                          : (orderStatus.options?.address?.location || isAllowUnaddressOrderType)
+                            ? <Redirect to={singleBusinessConfig.isActive ? `/${singleBusinessConfig.businessSlug}` : '/search'} />
+                            : singleBusinessConfig.isActive
+                              ? <Redirect to={`/${singleBusinessConfig.businessSlug}`} />
+                              : <HomePage />
                     )}
                   </Route>
                   <Route exact path='/wallets'>
@@ -597,7 +612,7 @@ export const App = () => {
                             isUserVerifyRequired ? (
                               <Redirect to='/verify' />
                             ) : (
-                              orderStatus.options?.address?.location
+                              (orderStatus.options?.address?.location || isAllowUnaddressOrderType)
                                 ? <BusinessesList searchValueCustom={searchValue} />
                                 : <Redirect to={singleBusinessConfig.isActive ? `/${singleBusinessConfig.businessSlug}` : '/'} />
                             )
@@ -609,7 +624,7 @@ export const App = () => {
                     {isUserVerifyRequired ? (
                       <Redirect to='/verify' />
                     ) : (
-                      orderStatus.options?.address?.location && !isKioskApp ? (
+                      (orderStatus.options?.address?.location || isAllowUnaddressOrderType) && !isKioskApp ? (
                         <BusinessListingSearch />
                       ) : (
                         <Redirect to={singleBusinessConfig.isActive ? `/${singleBusinessConfig.businessSlug}` : '/'} />