ordering-ui-react-native 0.17.15 → 0.17.17

package/package.json

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

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

@@ -488,8 +488,7 @@ export const DriverMap = (props: GoogleMapsParams) => {
                 size={13}
                 numberOfLines={2}
                 adjustsFontSizeToFit>
-                {`${travelTime.toFixed(2)} - ${isMin ? t('MINNUTES', 'mins') : t('HOURS', 'hours')
-                  } ${distancesFromTwoPlacesKm.toFixed(2)} km`}
+                {`${travelTime.toFixed(2)} - ${isMin ? t('MINNUTES', 'mins') : t('HOURS', 'hours')}`}
               </OText>
             </View>
           </View>

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

@@ -1,6 +1,7 @@
 import React, { useCallback, useEffect, useRef, useState } from 'react'
 import { View, TouchableOpacity, StyleSheet, SafeAreaView, Dimensions, Platform, KeyboardAvoidingViewBase, KeyboardAvoidingView } from 'react-native'
 import { IOScrollView } from 'react-native-intersection-observer'
+import { useSafeAreaInsets } from 'react-native-safe-area-context'
 import { useTheme } from 'styled-components/native';
 import {
 	BusinessAndProductList,
@@ -68,6 +69,7 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
 		onBusinessClick
 	} = props
 
+	const insets = useSafeAreaInsets()
 	const theme = useTheme();
 	const [, t] = useLanguage()
 	const [{ auth }] = useSession()
@@ -245,12 +247,13 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
 
 	return (
 		<>
-			<ContainerSafeAreaView
-				style={{ flex: 1 }}
-				isOpenFiltProducts={isOpenFiltProducts}
-			>
+			<View style={{ flex: 1 }}>
 				<Animated.View style={{ position: 'relative' }}>
-					<TopHeader isIos={Platform.OS === 'ios'}>
+					<TopHeader
+						style={{
+							marginTop: Platform.OS === 'ios' ? insets.top : '40px'
+						}}
+					>
 						{!isOpenSearchBar && (
 							<>
 								<TopActions onPress={() => handleBackNavigation()}>
@@ -512,7 +515,7 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
 					onAccept={() => setAlertState({ open: false, content: [] })}
 					onClose={() => setAlertState({ open: false, content: [] })}
 				/>
-			</ContainerSafeAreaView>
+			</View>
 			<OModal
 				open={openService}
 				onClose={() => setOpenService(false)}

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

@@ -1,8 +1,5 @@
 import styled, { css } from 'styled-components/native'
 
-export const ContainerSafeAreaView = styled.SafeAreaView`
-`
-
 export const WrapHeader = styled.View`
   position: relative;
 `
@@ -14,7 +11,6 @@ export const TopHeader = styled.View`
   z-index: 1;
   height: 60px;
   min-height: 60px;
-  margin-top: ${(props : any) => props.isIos ? '0' : '40px'};
 `
 export const AddressInput = styled.TouchableOpacity`
   flex: 1;

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

@@ -35,8 +35,8 @@ const DriverTipsUI = (props: any) => {
 	const theme = useTheme();
 
 	const style = StyleSheet.create({
-		circle: {
-			borderRadius: 30
+		semicircle: {
+			borderRadius: 8
 		},
 		inputStyle: {
 			flex: 1,
@@ -75,10 +75,10 @@ const DriverTipsUI = (props: any) => {
 						onPress={() => handlerChangeOption(option)}
 					>
 						<DTCard
-							style={style.circle}
+							style={style.semicircle}
 							isActive={option === optionSelected}
 						>
-							<OText size={12} numberOfLines={1} color={option === optionSelected ? '#FFF' : theme.colors.textSecondary}>
+							<OText size={12} numberOfLines={2} color={option === optionSelected ? '#FFF' : theme.colors.textSecondary}>
 								{`${isFixedPrice ? parsePrice(option) : `${option}%`}`}
 							</OText>
 						</DTCard>

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

@@ -26,11 +26,12 @@ export const DTCard = styled.View`
   text-transform: capitalize;
   min-height: 55px;
   min-width: 55px;
-  max-width: 55px;
+  max-width: 80px;
   max-height: 55px;
   margin-right: 10px;
   margin-left: 10px;
   margin-top: 10px;
+  padding-horizontal: 10px;
 
   ${(props: any) => props.isActive && css`
     background-color: ${(props: any) => props.theme.colors.primary};

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

@@ -1,9 +1,10 @@
 import React, { useState, useEffect } from 'react'
 import { useLanguage } from 'ordering-components/native';
-import { View, StyleSheet, RefreshControl } from 'react-native';
+import { View, StyleSheet, RefreshControl, Platform } from 'react-native';
+import AntDesignIcon from 'react-native-vector-icons/AntDesign'
 
 import { OrdersOption } from '../OrdersOption'
-import { HeaderTitle, OText } from '../shared'
+import { HeaderTitle, OButton, OText } from '../shared'
 import { ScrollView } from 'react-native-gesture-handler';
 import { Tab } from './styles'
 import { useTheme } from 'styled-components/native';
@@ -11,6 +12,7 @@ import { Container } from '../../layouts/Container';
 
 export const MyOrders = (props: any) => {
   const {
+    navigation,
     hideOrders,
     businessesSearchList
   } = props
@@ -33,6 +35,9 @@ export const MyOrders = (props: any) => {
     { key: 'business', value: t('BUSINESS', 'Business') },
     { key: 'products', value: t('PRODUCTS', 'Products') }
   ]
+  const isChewLayout = theme?.business_view?.components?.header?.components?.layout?.type === 'chew'
+
+  const goToBack = () => navigation?.canGoBack() && navigation.goBack()
 
   const handleOnRefresh = () => {
     setRefreshOrders(true);
@@ -67,7 +72,47 @@ export const MyOrders = (props: any) => {
         onRefresh={() => handleOnRefresh()}
       />
     }>
-      {!hideOrders && (
+      {isChewLayout && (
+        <View style={{
+          width: '100%',
+          display: 'flex',
+          flexDirection: 'row',
+          alignItems: 'center',
+          paddingHorizontal: 40
+        }}>
+          <OText
+              size={24}
+              style={{
+                marginTop: Platform.OS === 'android' ? 50 : 30,
+                paddingHorizontal: 20,
+                textTransform: 'capitalize'
+              }}
+            >
+              <OButton
+                imgLeftStyle={{ width: 18 }}
+                imgRightSrc={null}
+                style={{
+                  borderWidth: 0,
+                  width: 26,
+                  height: 26,
+                  backgroundColor: '#FFF',
+                  borderColor: '#FFF',
+                  shadowColor: '#FFF',
+                  paddingLeft: 0,
+                  paddingRight: 0,
+                }}
+                onClick={goToBack}
+                icon={AntDesignIcon}
+                iconProps={{
+                  name: 'arrowleft',
+                  size: 26
+                }}
+              />
+              {t('MY_ORDERS', 'My Orders')}
+            </OText>
+        </View>
+      )}
+      {!hideOrders && !isChewLayout && (
         <HeaderTitle text={t('MY_ORDERS', 'My Orders')} />
       )}
       {!allEmpty && (

package/themes/original/src/components/OrdersOption/PreviousBusinessOrdered/index.tsx

@@ -12,7 +12,7 @@ import {
 } from 'react-native';
 import { PreviousBusinessOrderedParams } from '../../../types';
 
-const BusinessControllerList = ({ businesses, onBusinessClick, navigation, orderState, style }: any) => {
+const BusinessControllerList = ({ businesses, onBusinessClick, navigation, orderState, handleCustomUpdate, style }: any) => {
   return (
     <>
       {businesses?.result?.map((business: any, i: number) => (
@@ -31,6 +31,7 @@ const BusinessControllerList = ({ businesses, onBusinessClick, navigation, order
           businessDeliveryTime={business?.delivery_time}
           businessPickupTime={business?.pickup_time}
           businessDistance={business?.distance}
+          handleCustomUpdate={handleCustomUpdate}
           style={style}
         />
       ))}
@@ -92,6 +93,7 @@ export const PreviousBusinessOrdered = (props: PreviousBusinessOrderedParams) =>
     businesses,
     onNavigationRedirect,
     isBusinessesSearchList,
+    handleUpdateBusinesses,
   } = props
 
   const [orderState] = useOrder()
@@ -117,6 +119,7 @@ export const PreviousBusinessOrdered = (props: PreviousBusinessOrderedParams) =>
               orderState={orderState}
               navigation={navigation}
               businesses={businesses}
+              handleCustomUpdate={handleUpdateBusinesses}
             />
           )}
         </>
@@ -130,6 +133,7 @@ export const PreviousBusinessOrdered = (props: PreviousBusinessOrderedParams) =>
               orderState={orderState}
               navigation={navigation}
               businesses={businesses}
+              handleCustomUpdate={handleUpdateBusinesses}
             />
           )}
         </ListWrapper>

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

@@ -49,7 +49,8 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
 		BusinessControllerSkeletons,
 		businesses,
 		businessPaginationProps,
-		handleUpdateProducts
+		handleUpdateProducts,
+		handleUpdateBusinesses
 	} = props
 
 	const theme = useTheme();
@@ -228,6 +229,7 @@ const OrdersOptionUI = (props: OrdersOptionParams) => {
 					onNavigationRedirect={onNavigationRedirect}
 					isBusinessesSearchList={!!businessesSearchList}
 					businesses={businesses}
+					handleUpdateBusinesses={handleUpdateBusinesses}
 				/>
 			)}
 

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

@@ -141,7 +141,7 @@ const ServiceFormUI = (props: ServiceFormParams) => {
 
   const handleSaveService = () => {
     const updated = {
-      serviceTime: dateSelected,
+      serviceTime: moment(dateSelected).utc().format('YYYY-MM-DD HH:mm:00'),
       professional: currentProfessional
     }
     handleSave && handleSave(updated)

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

@@ -17,7 +17,7 @@ import { LanguageSelector } from '../LanguageSelector'
 import MessageCircle from 'react-native-vector-icons/AntDesign'
 import Ionicons from 'react-native-vector-icons/Ionicons'
 import MaterialIcons from 'react-native-vector-icons/MaterialIcons'
-import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityIcons'
+import FontAwesome from 'react-native-vector-icons/FontAwesome'
 import FastImage from 'react-native-fast-image'
 import { OAlert } from '../../../../../src/components/shared'
 
@@ -111,6 +111,7 @@ const ProfileListUI = (props: ProfileParams) => {
 
   const isWalletEnabled = configs?.cash_wallet?.value && configs?.wallet_enabled?.value === '1' && (configs?.wallet_cash_enabled?.value === '1' || configs?.wallet_credit_point_enabled?.value === '1')
 	const IsPromotionsEnabled = configs?.advanced_offers_module?.value === '1' || configs?.advanced_offers_module?.value === true
+	const isChewLayout = theme?.business_view?.components?.header?.components?.layout?.type === 'chew'
 	const onRedirect = (route: string, params?: any) => {
 		navigation.navigate(route, params)
 	}
@@ -199,6 +200,12 @@ const ProfileListUI = (props: ProfileParams) => {
 						<MessageCircle name='message1' style={styles.messageIconStyle} color={theme.colors.textNormal} />
 						<OText size={14} lineHeight={24} weight={'400'} color={theme.colors.textNormal}>{t('MESSAGES', 'Messages')}</OText>
 					</ListItem>
+					{isChewLayout && (
+						<ListItem onPress={() => onRedirect('MyOrders', { isFromProfile: true, isGoBack: true })} activeOpacity={0.7}>
+							<FontAwesome name='list-alt' style={styles.messageIconStyle} color={theme.colors.textNormal} />
+							<OText size={14} lineHeight={24} weight={'400'} color={theme.colors.textNormal}>{t('MY_ORDERS', 'My Orders')}</OText>
+						</ListItem>
+					)}
 					{isWalletEnabled && (
 						<ListItem onPress={() => onRedirect('Wallets', { isFromProfile: true, isGoBack: true })} activeOpacity={0.7}>
 							<Ionicons name='wallet-outline' style={styles.messageIconStyle} color={theme.colors.textNormal} />

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

@@ -216,6 +216,7 @@ export interface BusinessControllerParams {
 	setFavoriteIds?: any;
 	handleUpdateBusinessList?: any;
 	enableIntersection?: boolean;
+	handleCustomUpdate?: (businessId: number, changes: any) => {};
 }
 export interface BusinessProductsListingParams {
 	navigation?: any;
@@ -362,6 +363,7 @@ export interface OrdersOptionParams {
 	setRefreshOrders?: (value: boolean) => void,
 	handleUpdateOrderList?: (orderId: number, changes: any) => {},
 	handleUpdateProducts?: (productId: number, changes: any) => {},
+	handleUpdateBusinesses?: (businessId: number, changes: any) => {},
 	isBusiness?: boolean,
 	isProducts?: boolean,
 	businessOrderIds?: any,
@@ -726,6 +728,7 @@ export interface PreviousBusinessOrderedParams {
 	isBusinessesSearchList?: any,
 	businessLoading?: boolean,
 	businesses?: any
+  handleUpdateBusinesses?: (businessId: number, changes: any) => {},
 }
 
 export interface ServiceFormParams {