ordering-ui-react-native 0.18.14 → 0.18.16

package/package.json

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

package/themes/business/src/components/GoogleMap/index.tsx

@@ -80,9 +80,9 @@ export const GoogleMap = (props: GoogleMapsParams) => {
     locations.map((location: { lat: number; lng: number; level: number }) => {
       return location.level === 4 && driverLocation?.lat
         ? {
-            latitude: driverLocation?.lat,
-            longitude: driverLocation?.lng,
-          }
+          latitude: driverLocation?.lat,
+          longitude: driverLocation?.lng,
+        }
         : { latitude: location.lat, longitude: location.lng };
     });
 
@@ -107,7 +107,7 @@ export const GoogleMap = (props: GoogleMapsParams) => {
           }
           let data = null;
           const details = {
-            geometry: { location: { lat: pos.latitude, lng: pos.longitude } },
+            geometry: { location: { lat: pos?.latitude, lng: pos?.longitude } },
           };
           if (isSetInputs) {
             data = {
@@ -165,8 +165,8 @@ export const GoogleMap = (props: GoogleMapsParams) => {
     const lat1 = pointA.lat;
     const lon1 = pointA.lng;
 
-    const lat2 = pointB.latitude;
-    const lon2 = pointB.longitude;
+    const lat2 = pointB?.latitude;
+    const lon2 = pointB?.longitude;
 
     const R = 6371e3;
     const φ1 = lat1 * (Math.PI / 180);
@@ -201,11 +201,11 @@ export const GoogleMap = (props: GoogleMapsParams) => {
       content: !(errKey === 'ERROR_MAX_LIMIT_LOCATION_TO')
         ? [t(errKey, mapErrors[errKey])]
         : [
-            `${t(errKey, mapErrors[errKey])} ${maxLimitLocation} ${t(
-              'METTERS',
-              'meters',
-            )}`,
-          ],
+          `${t(errKey, mapErrors[errKey])} ${maxLimitLocation} ${t(
+            'METTERS',
+            'meters',
+          )}`,
+        ],
       key: errKey,
     });
   };
@@ -237,9 +237,9 @@ export const GoogleMap = (props: GoogleMapsParams) => {
     MARKERS = locations.map((location: { lat: number; lng: number; level: number }) => {
       return location.level === 4 && driverLocation?.lat
         ? {
-            latitude: driverLocation?.lat,
-            longitude: driverLocation?.lng,
-          }
+          latitude: driverLocation?.lat,
+          longitude: driverLocation?.lng,
+        }
         : { latitude: location.lat, longitude: location.lng };
     })
     fitAllMarkers();
@@ -284,7 +284,7 @@ export const GoogleMap = (props: GoogleMapsParams) => {
           onRegionChangeComplete={
             !readOnly
               ? coordinates => handleChangeRegion(coordinates)
-              : () => {}
+              : () => { }
           }
           zoomTapEnabled
           zoomEnabled
@@ -302,12 +302,13 @@ export const GoogleMap = (props: GoogleMapsParams) => {
                     i: number,
                   ) => (
                     <React.Fragment key={i}>
-                      <Marker 
-                        coordinate={location} 
-                        onPress={() => { 
+                      <Marker
+                        coordinate={location}
+                        onPress={() => {
                           mapRef.current?.animateCamera({
-                          center: { latitude: location.latitude, longitude:location.longitude },
-                        })}}
+                            center: { latitude: location?.latitude, longitude: location?.longitude },
+                          })
+                        }}
                       >
                         <Icon
                           name="map-marker"
@@ -328,46 +329,46 @@ export const GoogleMap = (props: GoogleMapsParams) => {
                         <Callout
                           onPress={() => {
                             showLocation({
-                                      latitude: location.latitude,
-                                      longitude: location.longitude,
-                                      sourceLatitude: userLocation.latitude,
-                                      sourceLongitude: userLocation.longitude,
-                                      naverCallerName: 'com.businessapp',
-                                      dialogTitle: t('SHOW_IN_OTHER_MAPS', 'Show in other maps'),
-                                      dialogMessage: t('WHAT_APP_WOULD_YOU_USE', 'What app would you like to use?'),
-                                      cancelText: t('CANCEL', 'Cancel'),
+                              latitude: location?.latitude,
+                              longitude: location?.longitude,
+                              sourceLatitude: userLocation?.latitude,
+                              sourceLongitude: userLocation.longitude,
+                              naverCallerName: 'com.businessapp',
+                              dialogTitle: t('SHOW_IN_OTHER_MAPS', 'Show in other maps'),
+                              dialogMessage: t('WHAT_APP_WOULD_YOU_USE', 'What app would you like to use?'),
+                              cancelText: t('CANCEL', 'Cancel'),
                             })
                           }}
                         >
-                          <View style={{flex: 1,width: 250, paddingRight: 10, paddingLeft: 10, justifyContent:'space-between' }}>
-                              <View style={{flex: 1, marginBottom: 20}}>
-                                <OText size={16} weight={'bold'} style={{paddingTop: 10, marginBottom: 10}}>{locations[i]?.title}</OText>
-                                { locations[i]?.address && (
-                                  <>
-                                    <OText size={16} >{locations[i]?.address.addressName}</OText>
-                                    <OText size={16} >{locations[i]?.address.zipcode}</OText>
-                                  </>
-                                )}
-                              </View>
-                              <OButton
-                                text={t('GO_TO_THIS_LOCATION', 'Go to this location')}
-                                imgRightSrc={null}
-                                textStyle={{
-                                  color: theme.colors.white,
-                                  fontFamily: 'Poppins',
-                                  fontStyle: 'normal',
-                                  fontWeight: 'normal',
-                                  fontSize: 16
-                                }}
-                                style={{
-                                  alignContent:'center',
-                                  borderRadius: 10,
-                                  height: 35,
-                                  bottom:10
-                                }}
-                                bgColor={theme.colors.primary}
-                                borderColor={theme.colors.primary}
-                              />   
+                          <View style={{ flex: 1, width: 250, paddingRight: 10, paddingLeft: 10, justifyContent: 'space-between' }}>
+                            <View style={{ flex: 1, marginBottom: 20 }}>
+                              <OText size={16} weight={'bold'} style={{ paddingTop: 10, marginBottom: 10 }}>{locations[i]?.title}</OText>
+                              {locations[i]?.address && (
+                                <>
+                                  <OText size={16} >{locations[i]?.address.addressName}</OText>
+                                  <OText size={16} >{locations[i]?.address.zipcode}</OText>
+                                </>
+                              )}
+                            </View>
+                            <OButton
+                              text={t('GO_TO_THIS_LOCATION', 'Go to this location')}
+                              imgRightSrc={null}
+                              textStyle={{
+                                color: theme.colors.white,
+                                fontFamily: 'Poppins',
+                                fontStyle: 'normal',
+                                fontWeight: 'normal',
+                                fontSize: 16
+                              }}
+                              style={{
+                                alignContent: 'center',
+                                borderRadius: 10,
+                                height: 35,
+                                bottom: 10
+                              }}
+                              bgColor={theme.colors.primary}
+                              borderColor={theme.colors.primary}
+                            />
                           </View>
                         </Callout>
                       </Marker>

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

@@ -476,6 +476,8 @@ const LoginFormUI = (props: LoginParams) => {
       borderRadius: 7.6,
       borderColor: theme.colors.inputSignup,
       backgroundColor: theme.colors.transparent,
+      minHeight: 50,
+      maxHeight : 50
     },
     btn: {
       borderRadius: 7.6,
@@ -941,3 +943,4 @@ export const LoginForm = (props: any) => {
 
   return <LoginFormController {...loginProps} />;
 };
+

package/themes/business/src/components/MapView/index.tsx

@@ -42,7 +42,7 @@ const MapViewComponent = (props: MapViewParams) => {
     followUserLocation
   } = useLocation();
 
-  const location = { lat: userLocation.latitude, lng: userLocation.longitude }
+  const location = { lat: userLocation?.latitude, lng: userLocation?.longitude }
   const haveOrders = Object.values(markerGroups)?.length > 0 && Object.values(customerMarkerGroups)?.length > 0
   const closeAlert = () => {
     setAlertState({
@@ -57,8 +57,8 @@ const MapViewComponent = (props: MapViewParams) => {
         [
           { latitude: location.latitude, longitude: location.longitude },
           {
-            latitude: userLocation.latitude,
-            longitude: userLocation.longitude,
+            latitude: userLocation?.latitude,
+            longitude: userLocation?.longitude,
           },
         ],
         {
@@ -213,10 +213,10 @@ const MapViewComponent = (props: MapViewParams) => {
   }
 
   useEffect(() => {
-    if (userLocation.latitude !== 0 && userLocation.longitude !== 0) {
+    if (userLocation?.latitude !== 0 && userLocation?.longitude !== 0) {
       const location = {
-        lat: userLocation.latitude,
-        lng: userLocation.longitude
+        lat: userLocation?.latitude,
+        lng: userLocation?.longitude
       }
       setDriverLocation({ location })
     }
@@ -231,8 +231,8 @@ const MapViewComponent = (props: MapViewParams) => {
               ref={mapRef}
               provider={PROVIDER_GOOGLE}
               initialRegion={{
-                latitude: initialPosition.latitude,
-                longitude: initialPosition.longitude,
+                latitude: initialPosition?.latitude,
+                longitude: initialPosition?.longitude,
                 latitudeDelta: haveOrders ? 0.01 : 0.1,
                 longitudeDelta: haveOrders ? 0.01 * ASPECT_RATIO : 0.1 * ASPECT_RATIO,
               }}

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

@@ -557,7 +557,7 @@ export const BusinessPreorder = (props: any) => {
     : null
 
 const splitCateringValue = (configName : string) =>
-  Object.values(a || props?.business?.configs || {})
+  Object.values(props?.business?.configs || {})
     ?.find(config => config?.key === configName)
     ?.value?.split('|')
     ?.find(val => val.includes(cateringTypeString || ''))?.split(',')[1]

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

@@ -45,6 +45,7 @@ const CartUI = (props: any) => {
     isMultiCheckout,
     hideDeliveryFee,
     hideDriverTip,
+    hideCouponInput,
     preorderSlotInterval,
     preorderLeadTime,
     preorderTimeRange,
@@ -406,7 +407,7 @@ const CartUI = (props: any) => {
                 <OText size={12}>-{parsePrice(event.amount, { isTruncable: true })}</OText>
               </OSTable>
             ))}
-            {isCouponEnabled && !isCartPending && (
+            {isCouponEnabled && !isCartPending && !hideCouponInput && (
               <OSTable>
                 <OSCoupon>
                   <CouponControl

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

@@ -23,7 +23,9 @@ import { MultiCartsPaymethodsAndWallets } from '../MultiCartsPaymethodsAndWallet
 import { Cart } from '../Cart'
 import { FloatingButton } from '../FloatingButton'
 import { DriverTips } from '../DriverTips'
+import { CouponControl } from '../CouponControl';
 import { DriverTipsContainer } from '../Cart/styles'
+import { OSTable, OSCoupon } from '../OrderSummary/styles';
 
 import {
   ChContainer,
@@ -263,6 +265,29 @@ const MultiCheckoutUI = (props: any) => {
             </ChSection>
           )}
 
+          {
+            validationFields?.fields?.checkout?.coupon?.enabled &&
+            openCarts.every((cart: any) => cart.business_id && cart.status !== 2) &&
+            configs?.multi_business_checkout_coupon_input_style?.value === 'group' &&
+          (
+            <ChSection>
+              <OText size={14} lineHeight={20} color={theme.colors.textNormal}>
+                {t('DISCOUNT_COUPON', 'Discount coupon')}
+              </OText>
+              <OSTable>
+                <OSCoupon>
+                  <CouponControl
+                    isMulti
+                    carts={openCarts}
+                    businessIds={openCarts.map((cart: any) => cart.business_id)}
+                    price={openCarts.reduce((total: any, cart: any) => total + cart.total, 0)}
+                  />
+                </OSCoupon>
+              </OSTable>
+              <View style={{ height: 8, backgroundColor: theme.colors.backgroundGray100, marginTop: 13, marginHorizontal: -40 }} />
+            </ChSection>
+          )}
+
           <ChSection>
             <ChCarts>
               <CartsHeader>
@@ -276,6 +301,7 @@ const MultiCheckoutUI = (props: any) => {
                     cart={cart}
                     cartuuid={cart.uuid}
                     isMultiCheckout
+                    hideCouponInput={configs?.multi_business_checkout_coupon_input_style?.value === 'group'}
                     hideDeliveryFee={configs?.multi_business_checkout_show_combined_delivery_fee?.value === '1'}
                     hideDriverTip={configs?.multi_business_checkout_show_combined_driver_tip?.value === '1'}
                     onNavigationRedirect={(route: string, params: any) => props.navigation.navigate(route, params)}

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

@@ -117,11 +117,11 @@ const OrderProgressUI = (props: any) => {
               <View style={styles.logoWrapper}>
                 <FastImage
                   style={{ width: 50, height: 50 }}
-                  source={{
+                  source={orderList?.orders.length === 1 ? {
                     uri: optimizeImage(lastOrder?.business?.logo, 'h_50,c_limit'),
                     priority: FastImage.priority.normal,
-                  }}
-                  resizeMode={FastImage.resizeMode.cover}
+                  } : theme.images.logos.logotype}
+                  resizeMode={FastImage.resizeMode.contain}
                 />
               </View>
               <View style={{
@@ -190,7 +190,7 @@ export const OrderProgress = (props: any) => {
     useDefualtSessionManager: true,
     paginationSettings: {
       initialPage: 1,
-      pageSize: 1,
+      pageSize: 10,
       controlType: 'infinity'
     }
   }

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

@@ -75,7 +75,7 @@ const PaymentOptionsUI = (props: any) => {
 			case 'paypal':
 				return theme.images.general.paypal
 			case 'stripe':
-				return theme.images.general.stripe
+				return theme.images.general.creditCard
 			case 'stripe_direct':
 				return theme.images.general.stripecc
 			case 'stripe_connect':
@@ -292,6 +292,7 @@ const PaymentOptionsUI = (props: any) => {
 						onSelectCard={handlePaymethodDataChange}
 						onNavigationRedirect={onNavigationRedirect}
 						onCancel={() => handlePaymethodClick(null)}
+						setAddCardOpen={() => setAddCardOpen({ ...addCardOpen, stripe: true })}
 					/>
 				</View>
 			)}

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

@@ -113,7 +113,7 @@ export const PhoneInputNumber = (props: PhoneInputParams) => {
 					!isNaN(defaultCode)
 						? transformCountryCode(defaultCode)
 						: defaultCode
-					: configs?.default_country_code?.value}
+					: configs?.default_country_code?.value?.toUpperCase()}
 				onChangeFormattedText={(text: string) => handleChangeNumber(text)}
 				withDarkTheme
 				onChangeCountry={(country) => changeCountry?.(country)}

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

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useEffect } from 'react';
 import { View, StyleSheet, ScrollView } from 'react-native';
 import {
 	PaymentOptionStripe,
@@ -25,6 +25,7 @@ const StripeCardsListUI = (props: any) => {
 		cardSelected,
 		cardsList,
 		handleCardClick,
+		setAddCardOpen
 	} = props;
 
 	const theme = useTheme();
@@ -37,6 +38,12 @@ const StripeCardsListUI = (props: any) => {
 		onSelectCard(card);
 	}
 
+	useEffect(() => {
+		if (!cardsList?.loading && cardsList?.cards?.length === 0) {
+			setAddCardOpen(true)
+		}
+	}, [cardsList?.loading])
+
 	return (
 		<>
 			{token && !cardsList.loading && cardsList.cards && cardsList.cards.length === 0 && (