ordering-ui-react-native 0.24.8 → 0.24.10

package/package.json

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

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

@@ -1,18 +1,26 @@
-import React from 'react'
+import React, { useMemo } from 'react'
 import { Dimensions, Platform } from 'react-native'
 import { WebView } from 'react-native-webview'
 import { useLanguage } from 'ordering-components/native'
-
+import { useSafeAreaInsets } from 'react-native-safe-area-context'
 import { Container } from '../../layouts/Container'
 import { NotFoundSource } from '../NotFoundSource'
 import NavBar from '../NavBar'
 
-const HEIGHT_SCREEN = Dimensions.get('screen').height
-
 export const HelpOptions = (props: any) => {
   const { item, goToBack } = props
   const [, t] = useLanguage()
 
+  const insets = useSafeAreaInsets()
+
+  const containerHeight = useMemo(() => {
+    const windowHeight = Dimensions.get('window').height
+    const bottomPadding = Platform.OS === 'ios' ? insets.bottom : 0
+    const navigationBarHeight = Platform.OS === 'android' ? 48 : 0
+    const topPadding = (Platform.OS === 'ios' ? 20 : 10) + 48
+    return windowHeight - bottomPadding - navigationBarHeight - topPadding
+  }, [insets.bottom])
+
   return (
     <Container
       pt={Platform.OS === 'ios' ? 20 : 10}
@@ -30,7 +38,8 @@ export const HelpOptions = (props: any) => {
           originWhitelist={['*']}
           automaticallyAdjustContentInsets={false}
           source={{ html: item.body }}
-          style={{ flex: 1, height: HEIGHT_SCREEN }}
+          style={{ flex: 1, height: containerHeight }}
+          nestedScrollEnabled
         />
       )}
       {!item?.body && (

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

@@ -112,7 +112,7 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
 				orders.map((order: any) =>
 					<ItemWrap imageStyle={{ opacity: 0.7 }} source={order.business?.header ? { uri: order.business?.header } : theme.images.dummies.product} key={order.id}>
 						<OText color={theme.colors.white} size={12} lineHeight={18} weight={'600'}>{order?.business?.name}</OText>
-						<OText color={theme.colors.white} size={10} lineHeight={15}>{`${getOrderStatus(order.status)?.value} on ${formatDate(order?.created_at)}`}</OText>
+						<OText color={theme.colors.white} size={10} lineHeight={15}>{`${getOrderStatus(order.status, t)?.value} on ${formatDate(order?.created_at)}`}</OText>
 					</ItemWrap>)
 			)}
 		</>

package/themes/original/src/components/MultiOrdersDetails/SingleOrderCard.tsx

@@ -143,7 +143,7 @@ const SingleOrderCardUI = (props: any) => {
             <LinearGradient
               start={{ x: 0.0, y: 0.0 }}
               end={{
-                x: getOrderStatus(order?.status)?.percentage || 0,
+                x: getOrderStatus(order?.status, t)?.percentage || 0,
                 y: 0,
               }}
               locations={[0.9999, 0.9999]}
@@ -152,7 +152,7 @@ const SingleOrderCardUI = (props: any) => {
             />
           </StaturBar>
           <OText size={12} lineHeight={18} weight={'400'} color={theme.colors.textNormal}>
-            {getOrderStatus(order?.status)?.value}
+            {getOrderStatus(order?.status, t)?.value}
           </OText>
         </>
       )}

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

@@ -208,7 +208,7 @@ export const MultiOrdersDetailsUI = (props: any) => {
               <LinearGradient
                 start={{ x: 0.0, y: 0.0 }}
                 end={{
-                  x: getOrderStatus(orders[0]?.status)?.percentage || 0,
+                  x: getOrderStatus(orders[0]?.status, t)?.percentage || 0,
                   y: 0,
                 }}
                 locations={[0.9999, 0.9999]}
@@ -218,7 +218,7 @@ export const MultiOrdersDetailsUI = (props: any) => {
             </StaturBar>
           )}
           <OText size={14} lineHeight={18} weight={'400'} color={theme.colors.textNormal} mBottom={10}>
-            {getOrderStatus(orders[0]?.status)?.value}
+            {getOrderStatus(orders[0]?.status, t)?.value}
           </OText>
           {orders.map((order: any) => (
             <Row key={order.id}>

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

@@ -114,7 +114,7 @@ const OrderProgressUI = (props: any) => {
     setInitialLoaded(true)
   }, [orderList.loading, initialLoaded])
 
-  const progressBarObjt = (s: any) => lastOrder?.delivery_type && lastOrder?.delivery_type === 2 ? getOrderStatuPickUp(s, t) : getOrderStatus(s, t)
+  const progressBarObjt = (s: any) => lastOrder?.delivery_type && lastOrder?.delivery_type === 2 ? getOrderStatuPickUp(s) : getOrderStatus(s, t)
 
   return (
     <>

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

@@ -370,7 +370,7 @@ const SingleOrderCardUI = (props: SingleOrderCardParams) => {
                     size={10}
                     lineHeight={15}
                     numberOfLines={1}>
-                    {getOrderStatus(order.status)?.value}
+                    {getOrderStatus(order.status, t)?.value}
                   </OText>
                 )}
               </View>