ordering-ui-react-native 0.16.49 → 0.16.52

package/themes/original/src/components/Reviews/ReviewOrder/styles.tsx

@@ -0,0 +1,53 @@
+import styled from 'styled-components/native'
+
+export const ReviewOrderContainer = styled.ScrollView`
+  padding: 20px 40px;
+  margin-bottom: 100px;
+`
+
+export const BusinessLogo = styled.View`
+  margin-vertical: 5px;
+  align-items: center;
+`
+
+export const FormReviews = styled.View`
+  flex: 1;
+  height: 100%;
+  margin-top: 30px;
+`
+
+export const CommentsButtonGroup = styled.View`
+  flex-direction: row;
+  flex-wrap: wrap;
+`
+
+export const ActionContainer = styled.View`
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  padding: 3px 30px;
+`
+
+export const SkipButton = styled.TouchableOpacity`
+`
+
+export const RatingBarContainer = styled.View`
+  margin-top: 10px;
+  margin-bottom: 25px;
+`
+
+export const RatingTextContainer = styled.View`
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  margin-top: 10px;
+`
+export const RatingStarContainer = styled.View`
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  margin-top: 10px;
+`
+export const PlacedDate = styled.View`
+  margin-top: 30px;
+`

package/themes/original/src/components/Reviews/ReviewProducts/index.tsx

@@ -0,0 +1,101 @@
+import React, { useState, useEffect } from 'react'
+import { useLanguage, useToast, ToastType, ReviewProduct as ReviewProductController } from 'ordering-components/native'
+import { OText, OButton } from '../../shared'
+import { ReviewProductParams } from '../../../types'
+import { FloatingBottomContainer } from '../../../layouts/FloatingBottomContainer'
+import { useTheme } from 'styled-components/native'
+import { SingleProductReview } from '../../SingleProductReview'
+
+import {
+  ReviewProductsContainer,
+  ActionContainer,
+  SkipButton
+} from './styles'
+
+const ReviewProductsUI = (props: ReviewProductParams) => {
+  const {
+    navigation,
+    order,
+    formState,
+    handleChangeFormState,
+    handleSendProductReview,
+    closeReviewProduct
+  } = props
+
+  const [, t] = useLanguage()
+  const theme = useTheme()
+  const [, { showToast }] = useToast()
+
+  const [isProductReviewed, setIsProductReviewed] = useState(false)
+  const [alertState, setAlertState] = useState<{ open: boolean, content: Array<any>, success?: boolean }>({ open: false, content: [], success: false })
+
+  const handleContinueClick = () => {
+    setAlertState({ ...alertState, success: true })
+    handleSendProductReview()
+  }
+  useEffect(() => {
+    if (alertState.open) {
+      alertState.content && showToast(
+        ToastType.Error,
+        alertState.content
+      )
+    }
+  }, [alertState.content])
+
+  useEffect(() => {
+    if (!formState.loading && formState.result?.error) {
+      setAlertState({
+        open: true,
+        success: false,
+        content: formState.result?.result || [t('ERROR', 'Error')]
+      })
+    }
+    if (!formState.loading && !formState.result?.error && alertState.success) {
+      setIsProductReviewed && setIsProductReviewed(true)
+      closeReviewProduct && closeReviewProduct()
+    }
+  }, [formState])
+
+  return (
+    <>
+      <ReviewProductsContainer>
+        {order?.products?.map((product: any) => (
+          <SingleProductReview
+            key={product.id}
+            product={product}
+            formState={formState}
+            handleChangeFormState={handleChangeFormState}
+          />
+        ))}
+      </ReviewProductsContainer>
+
+      <FloatingBottomContainer>
+        <ActionContainer>
+          <SkipButton
+            onPress={() => closeReviewProduct && closeReviewProduct()}
+          >
+            <OText weight={700} size={18} color={theme.colors.textNormal}>{t('FRONT_VISUALS_SKIP', 'Skip')}</OText>
+          </SkipButton>
+          <OButton
+            textStyle={{ color: theme.colors.white, paddingRight: 10 }}
+            text={order?.driver && !order?.user_review ? t('CONTINUE', 'Continue') : t('SEND_REVIEW', 'Send Review')}
+            style={{ borderRadius: 8 }}
+            imgRightSrc={theme.images.general.arrow_right}
+            imgRightStyle={{ tintColor: theme.colors.white, right: 5, margin: 5 }}
+            isDisabled={formState.loading || formState?.changes?.length === 0}
+            onClick={() => handleContinueClick()}
+          />
+        </ActionContainer>
+      </FloatingBottomContainer>
+    </>
+  )
+}
+
+export const ReviewProducts = (props: any) => {
+  const reviewProductProps = {
+    ...props,
+    UIComponent: ReviewProductsUI,
+    isToast: true
+  }
+  return <ReviewProductController {...reviewProductProps} />
+}

package/themes/original/src/components/Reviews/ReviewProducts/styles.tsx

@@ -0,0 +1,17 @@
+import styled from 'styled-components/native'
+
+export const ReviewProductsContainer = styled.ScrollView`
+  padding: 20px 40px;
+  margin-bottom: 100px;
+  max-height: 400px;
+`
+
+export const ActionContainer = styled.View`
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  padding: 3px 30px;
+`
+
+export const SkipButton = styled.TouchableOpacity`
+`

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

@@ -0,0 +1,9 @@
+import { ReviewOrder as ReviewOrderModal } from './ReviewOrder';
+import { ReviewProducts as ReviewProductsModal } from './ReviewProducts';
+import { ReviewDriver as ReviewDriverModal } from './ReviewDriver';
+
+export {
+    ReviewOrderModal,
+    ReviewProductsModal,
+    ReviewDriverModal
+}

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

@@ -65,8 +65,8 @@ const ServiceFormUI = (props: ServiceFormParams) => {
 
   const styles = StyleSheet.create({
     photoStyle: {
-      width: 42,
-			height: 42,
+      width: 45,
+			height: 45,
 			borderRadius: 7.6
     },
     buttonStyle: {
@@ -313,12 +313,14 @@ const ServiceFormUI = (props: ServiceFormParams) => {
                   <OText
                     size={14}
                     weight={'400'}
+                    lineHeight={22}
                   >
                     {currentProfessional?.name} {currentProfessional?.lastname}
                   </OText>
                   <OText
                     size={12}
                     weight={'400'}
+                    lineHeight={17}
                     color={isBusyTime(currentProfessional) ? theme.colors.danger5 : theme.colors.success500}
                   >
                     {isBusyTime(currentProfessional)
@@ -459,9 +461,7 @@ const ServiceFormUI = (props: ServiceFormParams) => {
             size={14}
             weight={Platform.OS === 'ios' ? '600' : 'bold'}
           >
-            {dateSelected
-              ? moment(dateSelected).format('hh:mm A')
-              : t('ASAP_ABBREVIATION', 'ASAP')}
+            {dateSelected && moment(dateSelected).format('hh:mm A')}
           </OText>
           {((productCart &&
             auth &&
@@ -517,6 +517,14 @@ const ServiceFormUI = (props: ServiceFormParams) => {
 				entireModal
 			>
 				<ScrollView contentContainerStyle={styles.professionalList}>
+          <View style={{ padding: 11 }}>
+            <OText
+              size={14}
+              weight={'400'}
+            >
+              {t('ANY_OROFESSIONAL_MEMBER', 'Any professional member')}
+            </OText>
+          </View>
           {professionalList?.map((professional: any) => professional?.products?.includes(product?.id) && (
             <TouchableOpacity
               key={professional?.id}
@@ -536,12 +544,14 @@ const ServiceFormUI = (props: ServiceFormParams) => {
                   <OText
                     size={14}
                     weight={'400'}
+                    lineHeight={22}
                   >
                     {professional?.name} {professional?.lastname}
                   </OText>
                   <OText
                     size={12}
                     weight={'400'}
+                    lineHeight={17}
                     color={isBusyTime(professional) ? theme.colors.danger5 : theme.colors.success500}
                   >
                     {isBusyTime(professional)

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

@@ -443,36 +443,38 @@ const SignupFormUI = (props: SignupParams) => {
 				titleStyle={{ marginLeft: 0, marginRight: 0 }}
 			/>
 			<FormSide>
-				{(useSignUpFullDetails) && (
+				{((Number(useSignUpFullDetails) + Number(useSignUpOtpEmail) + Number(useSignUpOtpCellphone)) > 1) && (
 					<SignupWith>
 						<OTabs
 							horizontal
 							showsHorizontalScrollIndicator={false}
 							ref={tabsRef}
 						>
-							<TabBtn
-								onPress={() => handleSignUpTab('default')}
-								onLayout={(event: any) => handleOnLayout(event, 'default')}
-							>
-								<OTab
-									style={{
-										borderBottomColor:
-											signUpTab === 'default'
-												? theme.colors.textNormal
-												: theme.colors.border,
-									}}>
-									<OText
-										size={14}
-										color={
-											signUpTab === 'default'
-												? theme.colors.textNormal
-												: theme.colors.disabled
-										}
-										weight={signUpTab === 'default' ? 'bold' : 'normal'}>
-										{t('DEFAULT', 'Default')}
-									</OText>
-								</OTab>
-							</TabBtn>
+							{useSignUpFullDetails && (
+								<TabBtn
+									onPress={() => handleSignUpTab('default')}
+									onLayout={(event: any) => handleOnLayout(event, 'default')}
+								>
+									<OTab
+										style={{
+											borderBottomColor:
+												signUpTab === 'default'
+													? theme.colors.textNormal
+													: theme.colors.border,
+										}}>
+										<OText
+											size={14}
+											color={
+												signUpTab === 'default'
+													? theme.colors.textNormal
+													: theme.colors.disabled
+											}
+											weight={signUpTab === 'default' ? 'bold' : 'normal'}>
+											{t('DEFAULT', 'Default')}
+										</OText>
+									</OTab>
+								</TabBtn>
+							)}
 							{useSignUpOtpEmail && (
 								<TabBtn
 									onPress={() => handleSignUpTab('otpEmail')}

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

@@ -31,7 +31,8 @@ const SinguleProductCardUI = React.memo((props: SingleProductCardParams) => {
 		onProductClick,
 		productAddedToCartLength,
 		style,
-		handleFavoriteProduct
+		handleFavoriteProduct,
+		enableIntersection
 	} = props;
 
 	const theme = useTheme();
@@ -89,7 +90,7 @@ const SinguleProductCardUI = React.memo((props: SingleProductCardParams) => {
 	const [stateConfig] = useConfig();
 	const [{ parsePrice, optimizeImage }] = useUtils();
 	const [orderState] = useOrder();
-	const [isIntersectionObserver, setIsIntersectionObserver] = useState(false)
+	const [isIntersectionObserver, setIsIntersectionObserver] = useState(!enableIntersection)
 	const editMode = typeof product?.code !== 'undefined';
 
 	const removeToBalance = editMode ? product?.quantity : 0;

package/themes/original/src/components/shared/OBottomPopup.tsx

@@ -1,6 +1,7 @@
 import React from 'react'
-import { Modal, TouchableWithoutFeedback, Dimensions, StyleSheet, View, Text, Platform, StatusBar } from 'react-native'
+import { Modal, TouchableWithoutFeedback, TouchableOpacity, Dimensions, StyleSheet, View, Text, Platform, StatusBar } from 'react-native'
 import { useSafeAreaInsets } from 'react-native-safe-area-context'
+import { OIcon } from '.';
 const deviceHeight = Dimensions.get('window').height
 
 interface Props {
@@ -9,6 +10,9 @@ interface Props {
 	children?: any;
 	onClose?: any;
 	isStatusBar?: boolean;
+	bottomContainerStyle?: any;
+	titleStyle?: any;
+	closeIcon?: any;
 }
 const OBottomPopup = (props: Props) => {
 	const {
@@ -16,7 +20,10 @@ const OBottomPopup = (props: Props) => {
 		title,
 		onClose,
 		children,
-		isStatusBar
+		isStatusBar,
+		titleStyle,
+		bottomContainerStyle,
+		closeIcon
 	} = props
 	const { top, bottom } = useSafeAreaInsets();
 	return (
@@ -27,7 +34,7 @@ const OBottomPopup = (props: Props) => {
 			onRequestClose={() => onClose()}
 			presentationStyle={'fullScreen'}
 		>
-		  {isStatusBar && <StatusBar translucent={false} />}
+			{isStatusBar && <StatusBar translucent={false} />}
 			<View style={styles.container}>
 				<TouchableWithoutFeedback
 					style={styles.touchableOutsideStyle}
@@ -35,10 +42,18 @@ const OBottomPopup = (props: Props) => {
 				>
 					<View style={styles.touchableOutsideStyle} />
 				</TouchableWithoutFeedback>
-				<View style={styles.bottomContainer}>
+				<View style={{ ...styles.bottomContainer, ...bottomContainerStyle }}>
 					<View style={{ paddingTop: top, paddingBottom: bottom }}>
-						{title != '' && (
-							<Text style={styles.titleStyle}>
+						{closeIcon && (
+							<TouchableOpacity onPress={onClose} style={styles.closeIconStyle}>
+								<OIcon
+									src={closeIcon}
+									width={30}
+								/>
+							</TouchableOpacity>
+						)}
+						{!!title && (
+							<Text style={{ ...styles.titleStyle, ...titleStyle }}>
 								{title}
 							</Text>
 						)}
@@ -69,7 +84,11 @@ const styles = StyleSheet.create({
 	titleStyle: {
 		fontSize: 20,
 		fontWeight: 'bold',
-		marginVertical: 15
+		marginVertical: 10
+	},
+	closeIconStyle: {
+		paddingTop: 20,
+		paddingLeft: 20
 	}
 })
 

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

@@ -213,6 +213,7 @@ export interface BusinessControllerParams {
 	handleFavoriteBusiness?: any,
 	setFavoriteIds?: any;
 	handleUpdateBusinessList?: any;
+	enableIntersection?: boolean;
 }
 export interface BusinessProductsListingParams {
 	navigation?: any;
@@ -289,15 +290,16 @@ export interface BusinessProductsListParams {
 	handleUpdateProducts?: any
 }
 export interface SingleProductCardParams {
-	businessId: any,
+	businessId: any;
 	product: any;
 	isSoldOut: boolean;
 	onProductClick: any;
 	productAddedToCartLength: number;
-	style?: ViewStyle,
-	categoryState?: any,
-	handleFavoriteProduct?: any,
-	handleUpdateProducts?: any
+	style?: ViewStyle;
+	categoryState?: any;
+	handleFavoriteProduct?: any;
+	handleUpdateProducts?: any;
+	enableIntersection?: boolean;
 }
 export interface BusinessInformationParams {
 	navigation?: any,
@@ -415,25 +417,28 @@ export interface ProductItemAccordionParams {
 	isFromCheckout?: any
 }
 export interface ReviewOrderParams {
-	order?: { id: number, businessId: number, business_name?: string, delivery_datetime?: string, logo: string, driver: any, products: Array<any>, review: any, user_review: any },
-	stars?: any,
-	handleChangeInput?: any,
-	handleChangeRating?: any,
-	handleSendReview?: any,
-	formState?: any,
-	navigation?: any,
-	setIsReviewed?: (isReviewed: boolean) => {},
-	handleReviewState?: any,
-	setStars?: any,
-	onNavigationRedirect?: any
+	order?: { id: number, business_id: number, business_name?: string, delivery_datetime?: string, logo: string, driver: any, products: Array<any>, review: any, user_review: any };
+	stars?: any;
+	handleChangeInput?: any;
+	handleChangeRating?: any;
+	handleSendReview?: any;
+	formState?: any;
+	navigation?: any;
+	setIsReviewed?: (isReviewed: boolean) => void;
+	handleReviewState?: any;
+	setStars?: any;
+	onNavigationRedirect?: any;
+	closeReviewOrder?: () => void;
+	skipReview?: () => void;
 }
 export interface ReviewProductParams {
 	navigation?: any,
 	onNavigationRedirect?: any,
-	order?: { orderId: number, businessId: number, logo: string, driver: any, products: Array<any>, review: any, user_review: any },
+	order?: { orderId: number, business_id: number, logo: string, driver: any, products: Array<any>, review: any, user_review: any },
 	formState?: any,
 	handleChangeFormState?: any,
-	handleSendProductReview?: any
+	handleSendProductReview?: any;
+	closeReviewProduct?: () => void;
 }
 export interface SingleProductReviewParams {
 	product: any,
@@ -443,12 +448,13 @@ export interface SingleProductReviewParams {
 export interface ReviewDriverParams {
 	navigation?: any,
 	onNavigationRedirect?: any,
-	order?: { orderId: number, businessId: number, logo: string, driver: any, products: Array<any>, review: any, user_review: any },
+	order?: { orderId: number, business_id: number, logo: string, driver: any, products: Array<any>, review: any, user_review: any },
 	formState?: any,
 	setIsDriverReviewed?: (isReviewed: boolean) => {},
 	dirverReviews?: any,
 	setDriverReviews?: any,
-	handleSendDriverReview?: any
+	handleSendDriverReview?: any;
+	closeReviewDriver?: () => void;
 }
 export interface MessagesParams {
 	type?: string,