ordering-ui-react-native 0.12.31 → 0.12.35

package/themes/single-business/src/components/BusinessesListing/styles.tsx

@@ -19,22 +19,19 @@ export const Search = styled.View`
 
 export const AddressInput = styled.TouchableOpacity`
   flex-direction: row;
-  background-color: ${(props: any) => props.theme.colors.white};
-  border-radius: 22px;
-  padding-horizontal: 20px;
   align-items: center;
-  width: 100%;
+  justify-content: flex-start;
+  background-color: white;
+  padding-horizontal: 15px;
+  border-radius: 24px;
   height: 44px;
-  max-height: 44px;
+  min-height: 44px;
 `
 
 export const OrderControlContainer = styled.View`
   width: 100%;
-  flex-direction: column;
-  align-items: center;
-  justify-content: space-between;
   z-index: 10;
-  padding-bottom: 20px;
+  padding-top: 20px;
   flex: 1;
 `
 
@@ -53,8 +50,8 @@ export const WrapMomentOption = styled.TouchableOpacity`
 
 export const HeaderWrapper = styled.ImageBackground`
 	width: 100%;
-	height: 370px;
-	padding: 20px 40px;
+	height: 200px;
+	padding: 0px 40px 20px;
 	background-color: transparent;
 `;
 
@@ -65,6 +62,36 @@ export const ListWrapper = styled.View`
 
 export const FeaturedWrapper = styled.View`
 	background-color: ${(props: any) => props.theme.colors.backgroundLight};
-	height: 220px;
-	paddingVertical: 30px;
-`;
+	max-height: 220px;
+	paddingVertical: 20px;
+`;
+
+export const TopHeader = styled.View`
+  position: absolute;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  z-index: 1;
+  height: 34px;
+  min-height: 34px;
+`
+
+export const DropOptionButton = styled.TouchableOpacity`
+  background-color: ${(props: any) => props.theme.colors.backgroundGray100};
+  border-radius: 7.6px;
+  font-size: 12px;
+  max-width: 240px;
+  height: 26px;
+  align-items: center;
+  justify-content: center;
+  padding-horizontal: 8px;
+  flex-direction: row;
+  margin-end: 12px;
+`
+
+export const WrapSearchBar = styled.View`
+  padding: 10px 30px;
+  margin-bottom: 10px;
+  background-color: ${(props: any) => props.theme.colors.white};
+  flex: 1;
+`

package/themes/single-business/src/components/HelpAccountAndPayment/index.tsx

@@ -8,6 +8,7 @@ import { StyleSheet } from 'react-native'
 import {
   Content
 } from './styles'
+import NavBar from '../NavBar'
 
 export const HelpAccountAndPayment = (props: HelpParams) => {
   const {
@@ -37,11 +38,11 @@ export const HelpAccountAndPayment = (props: HelpParams) => {
 
   return (
     <>
-      <OButton
-        imgLeftSrc={theme.images.general.arrow_left}
-        imgRightSrc={null}
-        style={styles.btnBackArrow}
-        onClick={() => goToBack()}
+      <NavBar
+        style={{ paddingBottom: 0, marginLeft:-20, backgroundColor: 'transparent' }}
+        btnStyle={{ backgroundColor: 'transparent' }}
+        leftImageStyle={{ tintColor: theme.colors.textThird }}
+        onActionLeft={() => goToBack()}
       />
       <OText size={22} weight={600}>{t('ACCOUNT_PAYMENT_OPTIONS', 'Account and Payment Options')}</OText>
       <Content>
@@ -65,4 +66,4 @@ export const HelpAccountAndPayment = (props: HelpParams) => {
       </Content>
     </>
   )
-}
+}

package/themes/single-business/src/components/HelpGuide/index.tsx

@@ -7,6 +7,7 @@ import { StyleSheet } from 'react-native'
 import {
   Content
 } from './styles'
+import NavBar from '../NavBar'
 
 export const HelpGuide = (props: HelpParams) => {
   const {
@@ -36,11 +37,11 @@ export const HelpGuide = (props: HelpParams) => {
 
   return (
     <>
-      <OButton
-        imgLeftSrc={theme.images.general.arrow_left}
-        imgRightSrc={null}
-        style={styles.btnBackArrow}
-        onClick={() => goToBack()}
+      <NavBar
+        style={{ paddingBottom: 0, marginLeft:-20, backgroundColor: 'transparent' }}
+        btnStyle={{ backgroundColor: 'transparent' }}
+        leftImageStyle={{ tintColor: theme.colors.textThird }}
+        onActionLeft={() => goToBack()}
       />
       <OText size={22} weight={600}>{t('GUIDE_TO_ORDERING', 'Guide to Ordering')}</OText>
       <Content>
@@ -64,4 +65,4 @@ export const HelpGuide = (props: HelpParams) => {
       </Content>
     </>
   )
-}
+}

package/themes/single-business/src/components/HelpOrder/index.tsx

@@ -9,6 +9,7 @@ import { WebView } from 'react-native-webview'
 import {
   Content
 } from './styles'
+import NavBar from '../NavBar'
 
 export const HelpOrder = (props: HelpParams) => {
   const {
@@ -41,11 +42,11 @@ export const HelpOrder = (props: HelpParams) => {
 
   return (
     <>
-      <OButton
-        imgLeftSrc={theme.images.general.arrow_left}
-        imgRightSrc={null}
-        style={styles.btnBackArrow}
-        onClick={() => goToBack()}
+      <NavBar
+        style={{ paddingBottom: 0, marginLeft:-20, backgroundColor: 'transparent' }}
+        btnStyle={{ backgroundColor: 'transparent' }}
+        leftImageStyle={{ tintColor: theme.colors.textThird }}
+        onActionLeft={() => goToBack()}
       />
       <OText size={22} weight={600}>{t('HELP_WITH_ORDER', 'Help with an order')}</OText>
       <Content>
@@ -76,4 +77,4 @@ export const HelpOrder = (props: HelpParams) => {
       </Content>
     </>
   )
-}
+}

package/themes/single-business/src/components/LoginForm/index.tsx

@@ -534,7 +534,7 @@ const LoginFormUI = (props: LoginParams) => {
                     handleLoading={(val: boolean) => setIsFBLoading(val)}
                     handleSuccessFacebookLogin={handleSuccessFacebook}
                   />
-                  <GoogleLogin
+                  {/* <GoogleLogin
                     handleErrors={(err: any) => showToast(ToastType.Error, err)}
                     handleLoading={(val: boolean) => setIsFBLoading(val)}
                     handleSuccessFacebookLogin={handleSuccessFacebook}
@@ -543,7 +543,7 @@ const LoginFormUI = (props: LoginParams) => {
                     handleErrors={(err: any) => showToast(ToastType.Error, err)}
                     handleLoading={(val: boolean) => setIsFBLoading(val)}
                     handleSuccessFacebookLogin={handleSuccessFacebook}
-                  />
+                  /> */}
                 </SocialButtons>
               </ButtonsWrapper>
             </>

package/themes/single-business/src/components/OrderDetails/index.tsx

@@ -43,6 +43,7 @@ import { OrderDetailsParams } from '../../types';
 import { USER_TYPE } from '../../config/constants';
 import { GoogleMap } from '../GoogleMap';
 import { verifyDecimals } from '../../utils';
+import NavBar from '../NavBar';
 
 export const OrderDetailsUI = (props: OrderDetailsParams) => {
 	const {
@@ -375,13 +376,12 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
 			{order && Object.keys(order).length > 0 && (
 				<>
 					<Header>
-						<OButton
-							imgLeftSrc={theme.images.general.arrow_left}
-							imgRightSrc={null}
-							style={styles.btnBackArrow}
-							onClick={() => handleArrowBack()}
-							imgLeftStyle={{ tintColor: theme.colors.disabled, width: 20 }}
-						/>
+            <NavBar
+              style={{ paddingBottom: 0, marginLeft: -20, backgroundColor: 'transparent' }}
+              btnStyle={{ backgroundColor: 'transparent' }}
+              leftImageStyle={{ tintColor: theme.colors.textThird }}
+              onActionLeft={() => handleArrowBack()}
+            />
 						<OrderInfo>
 							<OrderData>
 								<OText

package/themes/single-business/src/components/shared/OIconButton.tsx

@@ -21,8 +21,8 @@ const DisabledWrapper = styled.View`
     justify-content: center;
 `
 const Icon = styled.Image`
-    width: 22px;
-    height: 22px;
+    width: 20px;
+    height: 20px;
 `
 const Title = styled.Text`
     font-size: 16px;

package/themes/single-business/src/types/index.tsx

@@ -160,6 +160,7 @@ export interface BusinessProductsListingParams {
 	categorySelected: any;
 	handleSearchRedirect: any;
 	errorQuantityProducts?: boolean;
+	isFranchiseApp?: boolean;
 	header?: any;
 	logo?: any;
 	getNextProducts?: any;
@@ -173,6 +174,7 @@ export interface BusinessBasicInformationParams {
 	businessState?: any;
 	openBusinessInformation?: any;
 	isBusinessInfoShow?: boolean;
+	isFranchiseApp?: boolean;
 	header?: any;
 	logo?: any;
 }

package/themes/uber-eats/src/components/AddressList/index.tsx

@@ -11,7 +11,6 @@ import { NotFoundSource } from '../NotFoundSource'
 import NavBar from '../NavBar'
 import { Fade, Placeholder, PlaceholderLine } from 'rn-placeholder'
 
-const addIcon = require('../../assets/icons/add-circular-outlined-button.png')
 
 const AddressListUI = (props: AddressListParams) => {
   const {
@@ -32,6 +31,7 @@ const AddressListUI = (props: AddressListParams) => {
   } = props
 
   const theme = useTheme()
+  const addIcon = theme.general?.images?.addCircularOutlined
 
   const styles = StyleSheet.create({
     address: {

package/themes/uber-eats/src/components/Messages/index.tsx

@@ -10,9 +10,6 @@ import { TouchableOpacity, ActivityIndicator, StyleSheet, View, Platform, Keyboa
 import { Header, TitleHeader, Wrapper, QuickMessageContainer } from './styles'
 import { MessagesParams } from '../../types'
 
-const ImageDummy = require('../../assets/images/image.png')
-const paperIcon = require('../../assets/images/paper-plane.png')
-
 const ORDER_STATUS: any = {
   0: 'ORDER_STATUS_PENDING',
   1: 'ORDERS_COMPLETED',
@@ -61,8 +58,11 @@ const MessagesUI = (props: MessagesParams) => {
   const [formattedMessages, setFormattedMessages] = useState<Array<any>>([])
   const [isKeyboardShow, setIsKeyboardShow] = useState(false)
   const previousStatus = [1, 2, 5, 6, 10, 11, 12, 16, 17]
-  const chatDisabled = previousStatus.includes(order?.status)
 
+  const ImageDummy = theme.images?.general?.ImageDummy
+  const paperIcon = theme?.images?.general?.paperIcon
+
+  const chatDisabled = previousStatus.includes(order?.status)
   const quickMessageList = [
     { key: 'customer_message_1', text: t('CUSTOMER_MESSAGE_1', 'customer_message_1') },
     { key: 'customer_message_2', text: t('CUSTOMER_MESSAGE_2', 'customer_message_2') },

package/themes/uber-eats/src/components/shared/OButton.tsx

@@ -128,7 +128,6 @@ OButton.defaultProps = {
   isDisabled: false,
   indicatorColor: 'white',
   activeOpacity: 0.5,
-  imgRightSrc: require('../../assets/icons/arrow_right.png')
 };
 
 export default OButton;

package/themes/uber-eats/src/components/shared/ODropDown.tsx

@@ -1,5 +1,5 @@
 import React, { useState, useEffect } from 'react'
-import styled, { css } from 'styled-components/native'
+import styled, { css, useTheme } from 'styled-components/native'
 import { ScrollView, TouchableOpacity  } from 'react-native-gesture-handler'
 import {
   ScrollView as CustomScrollView,
@@ -76,6 +76,7 @@ const ODropDown = (props: Props) => {
     isModal
   } = props
 
+  const theme = useTheme()
   const [isOpen, setIsOpen] = useState(false)
   const defaultOption = options?.find((option: any) => option.value === defaultValue)
   const [selectedOption, setSelectedOption] = useState<any>(defaultOption)
@@ -114,7 +115,7 @@ const ODropDown = (props: Props) => {
         <DropIcon
           textcolor={props.textcolor}
           secondary={secondary}
-          source={require('../../assets/icons/drop_down.png')}
+          source={theme.images.general.dropDown}
         />
       </Selected>
       {isOpen && options && (

package/themes/uber-eats/src/components/shared/OIcon.tsx

@@ -1,7 +1,7 @@
 
 import * as React from 'react'
 import { ImageStyle } from 'react-native'
-import styled from 'styled-components/native'
+import styled, { useTheme } from 'styled-components/native'
 
 const Wrapper = styled.View``
 
@@ -23,10 +23,11 @@ interface Props {
 }
 
 const OImage = (props: Props): React.ReactElement => {
+  const theme = useTheme()
   return (
     <Wrapper style={{ borderRadius: props.style?.borderRadius, overflow: 'hidden', marginHorizontal: props.style?.marginHorizontal }}>
       <SImage
-        source={props.src ? props.src : props.url ? { uri: props.url } : props.dummy ? props.dummy : require('../../assets/icons/lunch.png')}
+        source={props.src ? props.src : props.url ? { uri: props.url } : props.dummy ? props.dummy : theme.images.general.lunch}
         style={{
           tintColor: props.color,
           flex: props.isWrap ? 1 : 0,