ordering-ui-react-native 0.21.57 → 0.21.58

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ordering-ui-react-native",
-  "version": "0.21.57",
+  "version": "0.21.58",
   "description": "Reusable components made in react native",
   "main": "src/index.tsx",
   "author": "ordering.inc",

package/themes/original/src/components/BusinessPreorder/index.tsx

@@ -323,7 +323,6 @@ const BusinessPreorderUI = (props: BusinessPreorderParams) => {
         <TouchableOpacity onPress={() => goToBack && goToBack()} style={{ marginBottom: 12 }}>
           <IconAntDesign
             name='close'
-            color={theme.colors.textThird}
             size={24}
             style={{ marginLeft: -4 }}
           />

package/themes/original/src/components/BusinessProductsListing/index.tsx

@@ -148,7 +148,7 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
   const openCarts = (Object.values(orderState?.carts)?.filter((cart: any) => cart?.products && cart?.products?.length && cart?.status !== 2 && cart?.valid_schedule && cart?.valid_products && cart?.valid_address && cart?.valid_maximum && cart?.valid_minimum && !cart?.wallets) || null) || []
   const currentCart: any = Object.values(orderState.carts).find((cart: any) => cart?.business?.slug === business?.slug) ?? {}
   const isOpenFiltProducts = isOpenSearchBar && !!searchValue
-  const filtProductsHeight = Platform.OS === 'ios' ? 165 : 100
+  const filtProductsHeight = Platform.OS === 'ios' ? 65 : 30
   const viewOrderButtonVisible = !loading && auth && currentCart?.products?.length > 0 && categoryState.products.length !== 0
 
   const onRedirect = (route: string, params?: any) => {

package/themes/original/src/components/Checkout/index.tsx

@@ -1,5 +1,5 @@
-import React, { useState, useEffect, useCallback } from 'react';
-import { View, StyleSheet, TouchableOpacity, Platform, I18nManager, ScrollView, SafeAreaView } from 'react-native';
+import React, { useState, useEffect, useCallback, useRef } from 'react';
+import { View, StyleSheet, TouchableOpacity, Platform, I18nManager, ScrollView, Keyboard } from 'react-native';
 import { initStripe, useConfirmPayment } from '@stripe/stripe-react-native';
 import NativeStripeSdk from '@stripe/stripe-react-native/src/NativeStripeSdk'
 import Picker from 'react-native-country-picker-modal';
@@ -170,6 +170,7 @@ const CheckoutUI = (props: any) => {
 	const [paymethodClicked, setPaymethodClicked] = useState<any>(null)
 	const [showTitle, setShowTitle] = useState(false)
 	const [cardList, setCardList] = useState<any>({ cards: [], loading: false, error: null })
+	const containerRef = useRef<any>()
 	const cardsMethods = ['credomatic']
 	const stripePaymethods: any = ['stripe', 'stripe_direct', 'stripe_connect', 'stripe_redirect']
 	const placeSpotTypes = [3, 4, 5]
@@ -411,6 +412,15 @@ const CheckoutUI = (props: any) => {
 		}
 	}, [cartState?.error, cartState?.cart, cartState?.loading])
 
+	useEffect(() => {
+		const keyboardDidShowListener = Keyboard.addListener('keyboardDidShow', () => {
+			containerRef?.current?.scrollToEnd && containerRef.current.scrollToEnd({ animated: true })
+		})
+		return () => {
+			keyboardDidShowListener.remove()
+		}
+	}, [])
+
 	return (
 		<>
 			<View style={styles.wrapperNavbar}>
@@ -436,7 +446,7 @@ const CheckoutUI = (props: any) => {
 					</>
 				</TopHeader>
 			</View>
-			<Container noPadding onScroll={handleScroll}>
+			<Container forwardRef={containerRef} noPadding onScroll={handleScroll}>
 				<View style={styles.wrapperNavbar}>
 					<NavBar
 						hideArrowLeft

package/themes/original/src/components/Wallets/index.tsx

@@ -129,7 +129,7 @@ const WalletsUI = (props: any) => {
               flexDirection: !hideWalletsTheme ? 'column' : 'row',
               justifyContent: !hideWalletsTheme ? 'flex-start' : 'space-between',
               alignItems: !hideWalletsTheme ? 'flex-start' : 'center',
-              marginTop: !hideWalletsTheme ? 0 : 10,
+              marginTop: !hideWalletsTheme ? 30 : 10,
             },
           }}>
             <NavBar

package/themes/original/src/components/Wallets/styles.tsx

@@ -3,7 +3,7 @@ import styled from 'styled-components/native'
 export const Container = styled.View`
   padding-horizontal: 20px;
   padding-bottom: 20px;
-  padding-top: ${(props: any) => props.pdng};
+  padding-top: ${(props: any) => props.pdng || 0};
 `
 export const Header = styled.View`
   flex-direction: row;

package/themes/original/src/layouts/Container.tsx

@@ -4,7 +4,9 @@ import styled, { css, useTheme } from 'styled-components/native';
 import { Platform, View } from 'react-native';
 
 const ContainerStyled = styled.ScrollView`
-  flex: 1;
+  ${(props: any) => !props.disableFlex && css`
+    flex: 1
+  `}
   ${(props: any) => !props.noPadding && css`
     padding: ${Platform.OS === 'ios' ? '0px 20px' : '20px 20px'};
   `}
@@ -17,7 +19,7 @@ export const Container = (props: any) => {
   return (
     <View
       style={{
-        flex: 1,
+        flex: props.disableFlex ? undefined : 1,
         paddingTop: props.pt ?? insets.top,
         backgroundColor: theme.colors.backgroundPage
       }}