ordering-ui-react-native 0.22.55 → 0.22.56-test

package/package.json

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

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

@@ -133,6 +133,7 @@ const AddressFormUI = (props: AddressFormParams) => {
 	const [configState] = useConfig();
 	const [orderState] = useOrder();
 	const { handleSubmit, errors, control, setValue } = useForm();
+	const [autoCompleteAddress, setAutoCompleteAddress] = useState(false)
 
 	const [toggleMap, setToggleMap] = useState(false);
 	const [alertState, setAlertState] = useState<{
@@ -572,6 +573,7 @@ const AddressFormUI = (props: AddressFormParams) => {
 											placeholder={t('ADD_ADDRESS', 'Add a address')}
 											onPress={(data, details: any) => {
 												handleChangeAddress(data, details);
+												setAutoCompleteAddress(true);
 											}}
 											query={{
 												key: googleMapsApiKey,
@@ -586,6 +588,7 @@ const AddressFormUI = (props: AddressFormParams) => {
 															target: { name: 'address', value: text },
 														});
 														setValue('address', text);
+														setAutoCompleteAddress(true)
 													}
 													setIsFirstTime(false);
 													setAddressEditing(text.length == 0);
@@ -673,6 +676,8 @@ const AddressFormUI = (props: AddressFormParams) => {
 											setSaveLocation={setSaveMapLocation}
 											handleToggleMap={handleToggleMap}
 											isIntGeoCoder
+											setAutoCompleteAddress={setAutoCompleteAddress}
+											autoCompleteAddress={autoCompleteAddress}
 										/>
 									</GoogleMapContainer>
 								</View>

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

@@ -21,7 +21,9 @@ export const GoogleMap = (props: GoogleMapsParams) => {
     locations,
     isIntGeoCoder,
     businessZones,
-    delta
+    delta,
+    autoCompleteAddress,
+    setAutoCompleteAddress
   } = props
 
   const [, t] = useLanguage()
@@ -59,7 +61,7 @@ export const GoogleMap = (props: GoogleMapsParams) => {
     strokeWidth: 2
   }
 
-  const geocodePosition = (pos: { latitude: number, longitude: number }, isMovingRegion ?: boolean) => {
+  const geocodePosition = (pos: { latitude: number, longitude: number }, isMovingRegion?: boolean) => {
     Geocoder.from({
       latitude: pos.latitude,
       longitude: pos.longitude
@@ -84,7 +86,7 @@ export const GoogleMap = (props: GoogleMapsParams) => {
         }
         handleChangeAddressMap && handleChangeAddressMap(address, details)
         setSaveLocation && setSaveLocation(false)
-        if(!isMovingRegion){ 
+        if (!isMovingRegion) {
           handleToggleMap && handleToggleMap()
         }
       } else {
@@ -95,7 +97,7 @@ export const GoogleMap = (props: GoogleMapsParams) => {
     })
   }
 
-  const validateResult = (curPos: { latitude: number, longitude: number }) => {
+  const validateResult = (curPos: any) => {
     const loc1 = center
     const loc2 = curPos
     const distance = calculateDistance(loc1, loc2)
@@ -103,25 +105,33 @@ export const GoogleMap = (props: GoogleMapsParams) => {
     if (!maxLimitLocation) {
       geocodePosition(curPos)
       setMarkerPosition(curPos)
-      setRegion({ ...region, longitude: curPos.longitude, latitude: curPos.latitude })
+      if (!autoCompleteAddress) {
+        setRegion({ longitude: curPos?.longitude || 0, latitude: curPos?.latitude || 0, latitudeDelta: curPos?.latitudeDelta || 0.0010, longitudeDelta: curPos?.longitudeDelta || (delta ?? 0.0010) * ASPECT_RATIO })
+      } else {
+        setRegion({ longitude: curPos?.longitude, latitude: curPos?.latitude, latitudeDelta: delta ?? 0.0010, longitudeDelta: (delta ?? 0.0010) * ASPECT_RATIO })
+      }
       return
     }
 
     const _maxLimitLocation = typeof maxLimitLocation === 'string' ? parseInt(maxLimitLocation, 10) : maxLimitLocation
 
     if (distance <= _maxLimitLocation) {
-      if (!aproxEqual(curPos.latitude, center.lat) || !aproxEqual(curPos.longitude, center.lng)){
+      if (!aproxEqual(curPos?.latitude, center.lat) || !aproxEqual(curPos?.longitude, center.lng)) {
         geocodePosition(curPos, true)
       }
       setMarkerPosition(curPos)
-      setRegion({ ...region, longitude: curPos.longitude, latitude: curPos.latitude })
+      if (!autoCompleteAddress) {
+        setRegion({ longitude: curPos?.longitude || 0, latitude: curPos?.latitude || 0, latitudeDelta: curPos?.latitudeDelta || 0.0010, longitudeDelta: curPos?.longitudeDelta || (delta ?? 0.0010) * ASPECT_RATIO })
+      } else {
+        setRegion({ longitude: curPos?.longitude, latitude: curPos?.latitude, latitudeDelta: delta ?? 0.0010, longitudeDelta: (delta ?? 0.0010) * ASPECT_RATIO })
+      }
     } else {
       setMapErrors && setMapErrors('ERROR_MAX_LIMIT_LOCATION')
       setMarkerPosition({ latitude: center.lat, longitude: center.lng })
     }
   }
 
-  const aproxEqual = (n1 : number, n2 : number, epsilon = 0.000001) => {
+  const aproxEqual = (n1: number, n2: number, epsilon = 0.000001) => {
     return Math.abs(n1 - n2) < epsilon
   }
 
@@ -182,11 +192,21 @@ export const GoogleMap = (props: GoogleMapsParams) => {
   }, [isIntGeoCoder])
 
   useEffect(() => {
-    mapRef.current.animateToRegion({
-      ...region,
+    const regionConfig = {
       latitude: location?.lat,
       longitude: location?.lng,
-    })
+      latitudeDelta: delta ?? 0.0010,
+      longitudeDelta: (delta ?? 0.0010) * ASPECT_RATIO
+    }
+
+    mapRef.current.animateToRegion(autoCompleteAddress
+      ? regionConfig
+      : { ...region, ...regionConfig }
+    )
+
+    if (autoCompleteAddress) {
+      setAutoCompleteAddress && setAutoCompleteAddress(false)
+    }
   }, [location])
 
   useEffect(() => {
@@ -213,7 +233,7 @@ export const GoogleMap = (props: GoogleMapsParams) => {
         provider={PROVIDER_GOOGLE}
         initialRegion={region}
         style={styles.map}
-        onRegionChangeComplete={!readOnly ? (coordinates) => handleChangeRegion(coordinates) : () => { }}
+        onRegionChangeComplete={!readOnly ? (coordinates) => { handleChangeRegion(coordinates) } : () => { }}
         zoomTapEnabled
         zoomEnabled
         zoomControlEnabled
@@ -249,7 +269,7 @@ export const GoogleMap = (props: GoogleMapsParams) => {
           <React.Fragment key={i}>
             {businessZone?.type === 2 && Array.isArray(businessZone?.data) && (
               <Polygon
-                coordinates={businessZone?.data.map((item: any) => ({ latitude: item.lat, longitude: item.lng}))}
+                coordinates={businessZone?.data.map((item: any) => ({ latitude: item.lat, longitude: item.lng }))}
                 fillColor={fillStyles.fillColor}
                 strokeColor={fillStyles.strokeColor}
                 strokeWidth={fillStyles.strokeWidth}
@@ -257,7 +277,7 @@ export const GoogleMap = (props: GoogleMapsParams) => {
             )}
             {(businessZone.type === 1 && businessZone?.data?.center && businessZone?.data?.radio) && (
               <Circle
-                center={{ latitude: businessZone?.data?.center.lat, longitude: businessZone?.data?.center.lng}}
+                center={{ latitude: businessZone?.data?.center.lat, longitude: businessZone?.data?.center.lng }}
                 radius={businessZone?.data.radio * 1000}
                 fillColor={fillStyles.fillColor}
                 strokeColor={fillStyles.strokeColor}
@@ -266,7 +286,7 @@ export const GoogleMap = (props: GoogleMapsParams) => {
             )}
             {(businessZone.type === 5 && businessZone?.data?.distance) && (
               <Circle
-                center={{ latitude: center.lat, longitude: center.lng}}
+                center={{ latitude: center.lat, longitude: center.lng }}
                 radius={businessZone?.data.distance * units[businessZone?.data?.unit]}
                 fillColor={fillStyles.fillColor}
                 strokeColor={fillStyles.strokeColor}
@@ -275,7 +295,7 @@ export const GoogleMap = (props: GoogleMapsParams) => {
             )}
           </React.Fragment>
         ))}
-      </MapView>
+      </MapView >
       <Alert
         open={alertState.open}
         onAccept={closeAlert}

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

@@ -29,7 +29,7 @@ import {
 	TimeItem
 } from './styles';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
-import { locale, monthsEnum } from '../../utils';
+import { locale, monthsEnum, setLocalMoment } from '../../utils';
 
 const MomentOptionUI = (props: MomentOptionParams) => {
 	const {
@@ -323,6 +323,10 @@ const MomentOptionUI = (props: MomentOptionParams) => {
 		}
 	}, [dateSelected, JSON.stringify(hoursList), JSON.stringify(datesWhitelist), cateringPreorder, JSON.stringify(business)])
 
+	useEffect(() => {
+		setLocalMoment(moment, t)
+	}, [])
+
 	return (
 		<>
 			<Container
@@ -394,7 +398,6 @@ const MomentOptionUI = (props: MomentOptionParams) => {
 								<View style={{ flex: 1 }}>
 									{selectDate && datesWhitelist[0]?.start !== null && (
 										<CalendarStrip
-											locale={locale}
 											scrollable
 											style={styles.calendar}
 											calendarHeaderContainerStyle={styles.calendarHeaderContainer}

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

@@ -35,7 +35,8 @@ export const ProductOptionSubOptionUI = (props: any) => {
 		disabled,
 		setIsScrollAvailable,
 		image,
-		enableIntersection
+		enableIntersection,
+		onChange
 	} = props
 
 	const disableIncrement = option?.limit_suboptions_by_max ? balance === option?.max || state.quantity === suboption?.max : state.quantity === suboption?.max || (!state.selected && balance === option?.max)
@@ -88,6 +89,12 @@ export const ProductOptionSubOptionUI = (props: any) => {
 		}
 	}, [balance])
 
+	useEffect(() => {
+		if (!suboption?.preselected || !option?.respect_to) return
+		const newState = { ...state, selected: suboption?.preselected, quantity: state.selected ? 0 : 1 }
+		onChange(newState, suboption, option)
+	}, [suboption, option])
+
 	return (
 		<InView onChange={(inView: boolean) => handleChangeInterSection(inView)} triggerOnce={true}>
 			{isIntersectionObserver ? (

package/themes/original/src/types/index.tsx

@@ -607,7 +607,7 @@ export interface UpsellingProductsParams {
 	business?: any;
 	businessId?: number;
 	cartProducts?: Array<any>;
-	handleUpsellingPage: (cart ?: any) => void;
+	handleUpsellingPage: (cart?: any) => void;
 	openUpselling: boolean;
 	canOpenUpselling?: boolean;
 	setCanOpenUpselling?: (value: any) => void;
@@ -637,6 +637,8 @@ export interface GoogleMapsParams {
 	isIntGeoCoder: boolean,
 	businessZones?: any
 	delta?: number
+	setAutoCompleteAddress?: (val: boolean) => void,
+	autoCompleteAddress?: boolean,
 }
 
 export interface HelpParams {