ordering-ui-react-native 0.12.20 → 0.12.24

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

@@ -136,6 +136,10 @@ const LoginFormUI = (props: LoginParams) => {
       fontWeight: 'normal',
       fontSize: 16,
     },
+    linkTxt: {
+      flexDirection: 'row',
+      justifyContent: 'center',
+    }
 	});
 
 	const inputRef = useRef<any>({});
@@ -425,6 +429,15 @@ const LoginFormUI = (props: LoginParams) => {
 							}}
 							defaultValue=""
 						/>
+
+            {onNavigationRedirect && forgotButtonText && (
+              <Pressable onPress={() => onNavigationRedirect('Forgot')}>
+                <OText size={14} mBottom={18}>
+                  {forgotButtonText}
+                </OText>
+              </Pressable>
+            )}
+
 						<OButton
 							onClick={handleSubmit(onSubmit)}
 							text={loginButtonText}
@@ -438,13 +451,18 @@ const LoginFormUI = (props: LoginParams) => {
 					</FormInput>
 				)}
 
-				{onNavigationRedirect && forgotButtonText && (
-					<Pressable onPress={() => onNavigationRedirect('Forgot')}>
-						<OText size={16} mBottom={18}>
-							{forgotButtonText}
-						</OText>
-					</Pressable>
-				)}
+        {onNavigationRedirect && registerButtonText && (
+          <View style={loginStyle.linkTxt}>
+            <OText size={14} space>
+              {t('NEW_ON_PLATFORM', 'New on Ordering?')}
+            </OText>
+            <Pressable onPress={() => onNavigationRedirect('Signup')}>
+              <OText size={14} color={theme.colors.primary}>
+                {registerButtonText}
+              </OText>
+            </Pressable>
+          </View>
+        )}
 
 				{useLoginByCellphone &&
 					loginTab === 'cellphone' &&
@@ -453,13 +471,24 @@ const LoginFormUI = (props: LoginParams) => {
 					(configs?.twilio_service_enabled?.value === 'true' ||
 						configs?.twilio_service_enabled?.value === '1') && (
 						<>
-							<OrSeparator>
-								<LineSeparator />
-								<OText size={18} mRight={20} mLeft={20}>
-									{t('OR', 'Or')}
-								</OText>
-								<LineSeparator />
-							</OrSeparator>
+              <View
+                style={{
+                  flexDirection: 'row',
+                  width: '100%',
+                  justifyContent: 'space-between',
+                  alignItems: 'center',
+                  marginVertical: 30
+                }}>
+                <View style={loginStyle.line} />
+                <OText
+                  size={14}
+                  mBottom={10}
+                  style={{ paddingHorizontal: 19 }}
+                  color={theme.colors.disabled}>
+                  {t('OR', 'or')}
+                </OText>
+                <View style={loginStyle.line} />
+              </View>
 
 							<ButtonsWrapper mBottom={20}>
 								<OButton
@@ -533,18 +562,6 @@ const LoginFormUI = (props: LoginParams) => {
 						</Placeholder>
 					</SkeletonWrapper>
 				)}
-
-				{/* {onNavigationRedirect && registerButtonText && (
-          <ButtonsWrapper>
-            <OButton
-              onClick={() => onNavigationRedirect('Signup')}
-              text={registerButtonText}
-              style={loginStyle.btnOutline}
-              borderColor={theme.colors.primary}
-              imgRightSrc={null}
-            />
-          </ButtonsWrapper>
-        )} */}
 			</FormSide>
 			<OModal open={isModalVisible} onClose={() => setIsModalVisible(false)}>
 				<VerifyPhone

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

@@ -82,7 +82,6 @@ const SignupFormUI = (props: SignupParams) => {
 			display: 'flex',
 			flexDirection: 'row',
 			justifyContent: 'space-between',
-			marginBottom: 30,
 		},
 		line: {
 			height: 1,
@@ -539,6 +538,21 @@ const SignupFormUI = (props: SignupParams) => {
 					)}
 				</FormInput>
 
+        {
+          onNavigationRedirect && loginButtonText && (
+            <View style={style.wrappText}>
+              <OText size={14} style={{ marginRight: 5 }}>
+                {t('MOBILE_FRONT_ALREADY_HAVE_AN_ACCOUNT', 'Already have an account?')}
+              </OText>
+              <Pressable onPress={() => onNavigationRedirect('Login')}>
+                <OText size={14} color={theme.colors.primary}>
+                  {loginButtonText}
+                </OText>
+              </Pressable>
+            </View>
+          )
+        }
+
 				<View
 					style={{
 						flexDirection: 'row',
@@ -578,21 +592,6 @@ const SignupFormUI = (props: SignupParams) => {
 					</SocialButtons>
 				</ButtonsWrapper>
 
-				{/* {
-          onNavigationRedirect && loginButtonText && (
-            <View style={style.wrappText}>
-              <OText size={18} style={{ marginRight: 5 }}>
-                {t('MOBILE_FRONT_ALREADY_HAVE_AN_ACCOUNT', 'Already have an account?')}
-              </OText>
-              <Pressable onPress={() => onNavigationRedirect('Login')}>
-                <OText size={18} color={theme.colors.primary}>
-                  {loginButtonText}
-                </OText>
-              </Pressable>
-            </View>
-          )
-        } */}
-
 				{/* {
           configs && Object.keys(configs).length > 0 && (
             (configs?.facebook_login?.value === 'true' ||

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

@@ -154,10 +154,10 @@ const ProfileListUI = (props: ProfileParams) => {
 						<OIcon src={theme.images.general.help} width={16} color={theme.colors.textNormal} style={{ marginEnd: 14 }} />
 						<OText size={14} lineHeight={24} weight={'400'} color={theme.colors.textNormal}>{t('HELP', 'Help')}</OText>
 					</ListItem>
-					<ListItem onPress={() => navigation.navigate('Notifications', {})} activeOpacity={0.7}>
+					{/* <ListItem onPress={() => navigation.navigate('Notifications', {})} activeOpacity={0.7}>
 						<OIcon src={theme.images.general.bell} width={16} color={theme.colors.textNormal} style={{ marginEnd: 14 }} />
 						<OText size={14} lineHeight={24} weight={'400'} color={theme.colors.textNormal}>{t('NOTIFICATIONS', ' Notifications')}</OText>
-					</ListItem>
+					</ListItem> */}
 				</Actions>
 
 				<Actions>

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

@@ -162,6 +162,7 @@ export interface BusinessProductsListingParams {
 	errorQuantityProducts?: boolean;
 	header?: any;
 	logo?: any;
+	getNextProducts?: any;
 	productModal?: any;
 	handleChangeCategory: (value: any) => {};
 	setProductLogin?: () => {};
@@ -183,6 +184,12 @@ export interface BusinessProductsCategoriesParams {
 	categorySelected: any;
 	featured: boolean;
 	loading?: any;
+	scrollViewRef?: any;
+	productListLayout?: any;
+	categoriesLayout?: any;
+	selectedCategoryId?: any;
+	setSelectedCategoryId?: any;
+	lazyLoadProductsRecommended?: any;
 }
 export interface BusinessProductsListParams {
 	errors?: any;
@@ -198,6 +205,8 @@ export interface BusinessProductsListParams {
 	isBusinessLoading?: any,
 	errorQuantityProducts?: boolean,
 	handleCancelSearch?: () => void
+	categoriesLayout?: any
+	setCategoriesLayout?: any
 }
 export interface SingleProductCardParams {
 	businessId: any,

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

@@ -5,9 +5,9 @@ import { useTheme } from 'styled-components/native';
 import { GiftedChat, Actions, InputToolbar, Composer, Send, Bubble, MessageImage } from 'react-native-gifted-chat'
 import { USER_TYPE } from '../../config/constants'
 import MaterialCommunityIcon from 'react-native-vector-icons/MaterialCommunityIcons'
-import { OIcon, OIconButton, OText } from '../shared'
+import { OIcon, OIconButton, OText, OButton } from '../shared'
 import { TouchableOpacity, ActivityIndicator, StyleSheet, View, Platform, Keyboard,I18nManager } from 'react-native'
-import { Header, TitleHeader, Wrapper } from './styles'
+import { Header, TitleHeader, Wrapper, QuickMessageContainer } from './styles'
 import { MessagesParams } from '../../types'
 
 const ImageDummy = require('../../assets/images/image.png')
@@ -63,6 +63,17 @@ const MessagesUI = (props: MessagesParams) => {
   const previousStatus = [1, 2, 5, 6, 10, 11, 12, 16, 17]
   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') },
+    { key: 'customer_message_3', text: t('CUSTOMER_MESSAGE_3', 'customer_message_3') },
+    { key: 'customer_message_4', text: t('CUSTOMER_MESSAGE_4', 'customer_message_4') }
+  ]
+
+  const handleClickQuickMessage = (text: string) => {
+    setMessage && setMessage(`${message}${text}`)
+  }
+
   const onChangeMessage = (val: string) => {
     setMessage && setMessage(val)
   }
@@ -185,13 +196,48 @@ const MessagesUI = (props: MessagesParams) => {
     )
   }
 
+  const renderAccessory = () => {
+    return (
+      <QuickMessageContainer
+        style={{
+          marginLeft: 10,
+          marginBottom: 10
+        }}
+        contentContainerStyle={{
+          alignItems: 'center',
+        }}
+        horizontal
+        showsHorizontalScrollIndicator={false}
+      >
+        {quickMessageList.map((quickMessage, i) => (
+          <OButton
+            key={i}
+            text={quickMessage.text}
+            bgColor='#E9ECEF'
+            borderColor='#E9ECEF'
+            imgRightSrc={null}
+            textStyle={{
+              fontSize: 11,
+              lineHeight: 16,
+              color: '#414954'
+            }}
+            style={{ ...styles.editButton }}
+            onClick={() => handleClickQuickMessage(quickMessage.text)}
+          />
+        ))}
+      </QuickMessageContainer>
+    )
+  }
+
   const renderInputToolbar = (props : any) => (
     <InputToolbar
       {...props}
       containerStyle={{
-        padding: Platform.OS === 'ios' && isKeyboardShow ? 0 : 10
+        padding: Platform.OS === 'ios' && isKeyboardShow ? 0 : 10,
+        flexDirection: 'column-reverse'
       }}
       primaryStyle={{ alignItems: 'center', justifyContent: 'flex-start' }}
+      renderAccessory={() => renderAccessory()}
     />
   )
 
@@ -328,7 +374,7 @@ const MessagesUI = (props: MessagesParams) => {
           renderMessageImage={renderMessageImage}
           scrollToBottomComponent={() => renderScrollToBottomComponent()}
           messagesContainerStyle={{
-            paddingBottom: 20
+            paddingBottom: 55
           }}
           isLoadingEarlier={messages.loading}
           renderLoading={() => <ActivityIndicator size="small" color="#000" />}
@@ -354,6 +400,15 @@ const styles = StyleSheet.create({
     alignItems: 'center',
     justifyContent: 'center',
     marginHorizontal: 4
+  },
+  editButton : {
+    borderRadius: 50,
+    backgroundColor: '#E9ECEF',
+    marginRight: 10,
+    height: 24,
+    borderWidth: 1,
+    paddingLeft: 0,
+    paddingRight: 0
   }
 })
 

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

@@ -19,3 +19,5 @@ export const TitleHeader = styled.View`
   align-items: flex-start;
   max-width: 85%;
 `
+
+export const QuickMessageContainer = styled.ScrollView``