ordering-ui-react-native 0.17.66 → 0.17.68

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

@@ -11,7 +11,8 @@ import {
   ActionContainer,
   SkipButton,
   RatingBarContainer,
-  RatingTextContainer
+  RatingTextContainer,
+  MultiLogosContainer
 } from './styles'
 import { OButton, OIcon, OInput, OText } from '../shared'
 import { TouchableOpacity, StyleSheet, View, I18nManager } from 'react-native';
@@ -215,14 +216,30 @@ export const ReviewOrderUI = (props: ReviewOrderParams) => {
           titleWrapStyle={{ paddingHorizontal: 0 }}
           titleStyle={{ marginRight: 0, marginLeft: 0 }}
         />
-        <BusinessLogo>
-          <View style={styles.logoWrapper}>
-            <OIcon
-              url={order?.logo}
-              width={80}
-              height={80}
-            />
-          </View>
+        <BusinessLogo isMulti={order?.business?.length > 1}>
+          {typeof order?.logo === 'string' || !order?.logo ? (
+            <View style={styles.logoWrapper}>
+              <OIcon
+                url={order?.logo}
+                width={80}
+                height={80}
+              />
+            </View>
+          ) : (
+            <MultiLogosContainer>
+              {order?.logo?.map((logo : string, i : number) => (
+                <React.Fragment key={logo}>
+                  <View style={styles.logoWrapper}>
+                    <OIcon
+                      url={logo}
+                      width={80}
+                      height={80}
+                    />
+                  </View>
+                </React.Fragment>
+              ))}
+            </MultiLogosContainer>
+          )}
         </BusinessLogo>
         {order?.review ? (
           <View style={styles.reviewedStyle}>

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

@@ -42,3 +42,10 @@ export const RatingTextContainer = styled.View`
   justify-content: space-between;
   margin-top: 10px;
 `
+
+export const MultiLogosContainer = styled.View`
+  display: flex;
+  justify-content: space-around;
+  flex-direction: row;
+  width: 100%;
+`

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

@@ -8,7 +8,8 @@ import {
   FormReviews,
   ActionContainer,
   RatingStarContainer,
-  PlacedDate
+  PlacedDate,
+  MultiLogosContainer
 } from './styles'
 import { OButton, OIcon, OText } from '../shared'
 import { StyleSheet, View, I18nManager } from 'react-native';
@@ -79,13 +80,30 @@ export const ReviewTrigger = (props: any) => {
     <>
       <ReviewOrderContainer>
         <BusinessLogo>
-          <View style={styles.logoWrapper}>
-            <OIcon
-              url={order?.logo}
-              width={80}
-              height={80}
-            />
-          </View>
+          {typeof order?.logo === 'string' || !order?.logo ? (
+            <View style={styles.logoWrapper}>
+              <OIcon
+                url={order?.logo}
+                width={80}
+                height={80}
+              />
+            </View>
+          ) : (
+            <MultiLogosContainer>
+              {order?.logo?.map((logo : string, i : number) => (
+                <React.Fragment key={logo}>
+                  <View style={styles.logoWrapper}>
+                    <OIcon
+                      url={logo}
+                      width={80}
+                      height={80}
+                    />
+                  </View>
+                </React.Fragment>
+              ))}
+            </MultiLogosContainer>
+
+          )}
         </BusinessLogo>
         {!!order?.business_name && <OText style={{ textAlign: 'center', marginTop: 15 }} color={theme.colors.textNormal}>{order?.business_name}</OText>}
         <View style={{ flex: 1, justifyContent: 'flex-end' }}>
@@ -115,4 +133,4 @@ export const ReviewTrigger = (props: any) => {
       </FloatingBottomContainer>
     </>
   )
-}
+}

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

@@ -31,4 +31,11 @@ export const RatingStarContainer = styled.View`
 `
 export const PlacedDate = styled.View`
   margin-top: 30px;
-`
+`
+
+export const MultiLogosContainer = styled.View`
+  display: flex;
+  justify-content: space-around;
+  flex-direction: row;
+  width: 100%;
+`

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

@@ -0,0 +1,68 @@
+import React, { useState } from 'react'
+import { Platform, View } from 'react-native'
+import { useLanguage } from 'ordering-components/native';
+import { useTheme } from 'styled-components/native';
+
+import {
+	Accordion,
+	AccordionSection,
+	DropdownWrapper,
+} from './styles'
+import { OIcon, OText } from '../shared';
+
+export const ScheduleAccordion = (props: any) => {
+
+	const {
+		scheduleFormatted,
+		schedule,
+		weekIndex
+	} = props
+
+	const [isActive, setActiveState] = useState(false)
+	const [, t] = useLanguage()
+	const theme = useTheme();
+
+	const daysOfWeek = [
+		t('DAY7', 'Sunday'),
+		t('DAY1', 'Monday'),
+		t('DAY2', 'Tuesday'),
+		t('DAY3', 'Wednesday'),
+		t('DAY4', 'Thursday'),
+		t('DAY5', 'Friday'),
+		t('DAY6', 'Saturday'),
+	];
+
+	return (
+		<AccordionSection>
+			<Accordion
+				onPress={() => setActiveState(!isActive)}
+				activeOpacity={1}
+			>
+				<DropdownWrapper>
+					<OText
+						mBottom={16}
+						mRight={8}
+						lineHeight={21}
+						size={14}
+						weight={Platform.OS === 'android' ? 'bold' : '600'}
+					>{daysOfWeek[weekIndex]}</OText>
+					<OIcon src={theme.images.general.arrow_down} color={theme.colors.textNormal} width={8} />
+				</DropdownWrapper>
+				<View style={{ display: isActive ? 'flex' : 'none', paddingStart: 20 }}>
+					{schedule?.lapses?.map((lapse: any) => (
+						schedule?.enabled ?
+							<OText mBottom={16}>
+								{scheduleFormatted(lapse.open) +
+									' - ' +
+									scheduleFormatted(lapse.close)}
+							</OText>
+							:
+							<OText color={theme.colors.red} mBottom={16}>
+								{t('CLOSED', 'Closed')}
+							</OText>
+					))}
+				</View>
+			</Accordion>
+		</AccordionSection>
+	)
+}

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

@@ -0,0 +1,14 @@
+import styled from 'styled-components/native'
+
+export const AccordionSection = styled.View`
+  background: #FFF;
+`
+
+export const Accordion = styled.TouchableOpacity`
+  flex-direction: column;
+  justify-content: space-between;
+`
+
+export const DropdownWrapper = styled.View`
+  flex-direction: row;
+`

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

@@ -19,7 +19,8 @@ import {
   ButtonWrapper,
   ContentFooter,
   UnreadMessageCounter,
-  Price
+  Price,
+  MultiLogosContainer
 } from './styles';
 import { LottieAnimation } from '../LottieAnimation';
 import { CardAnimation } from '../shared/CardAnimation';
@@ -61,6 +62,11 @@ const SingleOrderCardUI = (props: SingleOrderCardParams) => {
       width: 64,
       height: 64
     },
+    minilogo: {
+      borderRadius: 8,
+      width: 40,
+      height: 40
+    },
     logoWrapper: {
       overflow: 'hidden',
       backgroundColor: 'white',
@@ -141,11 +147,12 @@ const SingleOrderCardUI = (props: SingleOrderCardParams) => {
           order: {
             id: order?.id,
             business_id: order?.business_id,
-            logo: order?.business?.logo,
+            logo: order?.business?.length > 1 ? order?.business?.map?.((business : any) => business?.logo): order?.business?.logo,
             driver: order?.driver,
             products: order?.products,
             review: order?.review,
-            user_review: order?.user_review
+            user_review: order?.user_review,
+            business: order?.business
           },
         });
       return
@@ -158,13 +165,16 @@ const SingleOrderCardUI = (props: SingleOrderCardParams) => {
       onNavigationRedirect('OrderDetails', { orderId: order?.uuid });
   };
 
-  const handleClickViewOrder = (uuid: string) => {
+  const handleClickViewOrder = (order: any) => {
     if (isMessageView) {
       handleClickOrder(order?.uuid)
       return
     }
-    onNavigationRedirect &&
-      onNavigationRedirect('OrderDetails', { orderId: uuid });
+    if (order?.cart_group_id){
+      onNavigationRedirect?.('MultiOrdersDetails', { orderId: order?.cart_group_id });
+    } else {
+      onNavigationRedirect?.('OrderDetails', { orderId: order?.uuid });
+    }
   };
 
   const handleChangeFavorite = () => {
@@ -180,24 +190,49 @@ const SingleOrderCardUI = (props: SingleOrderCardParams) => {
   return (
     <>
       <CardAnimation
-        onClick={() => handleClickViewOrder(order?.uuid)}
+        onClick={() => handleClickViewOrder(order)}
         style={[styles.container]}
       >
         <InnerContainer>
           {(!!order.business?.logo || theme?.images?.dummies?.businessLogo) && (
-            <Logo style={styles.logoWrapper}>
-              <OIcon
-                url={optimizeImage(order.business?.logo, 'h_300,c_limit')}
-                src={optimizeImage(!order.business?.logo && theme?.images?.dummies?.businessLogo, 'h_300,c_limit')}
-                style={styles.logo}
-              />
-            </Logo>
+            <>
+              {order?.business?.length > 1 ? (
+                <MultiLogosContainer>
+                  {order?.business?.map((business: any, i: number) => (
+                    <View key={business?.id}>
+                      {i > 1 ? (
+                        <>
+                          {console.log(order?.business?.length - 2)}
+                        <OText mRight={3}> + {order?.business?.length - 2}</OText>
+                        </>
+                      ) : (
+                        <Logo style={styles.logoWrapper} isMulti>
+                          <OIcon
+                            url={optimizeImage(business?.logo, 'h_300,c_limit')}
+                            src={optimizeImage(!business?.logo && theme?.images?.dummies?.businessLogo, 'h_300,c_limit')}
+                            style={styles.minilogo}
+                          />
+                        </Logo>
+                      )}
+                    </View>
+                  ))}
+                </MultiLogosContainer>
+              ) : (
+                <Logo style={styles.logoWrapper}>
+                  <OIcon
+                    url={optimizeImage(order.business?.logo, 'h_300,c_limit')}
+                    src={optimizeImage(!order.business?.logo && theme?.images?.dummies?.businessLogo, 'h_300,c_limit')}
+                    style={styles.logo}
+                  />
+                </Logo>
+              )}
+            </>
           )}
           <CardInfoWrapper>
             <ContentHeader>
               <View style={{ flex: 1 }}>
                 <OText size={12} lineHeight={18} weight={'600'} numberOfLines={1} ellipsizeMode={'tail'}>
-                  {order.business?.name}
+                  {order?.business?.length > 1 ? `${t('GROUP_ORDER', 'Group Order')} ${t('No', 'No')}. ${order?.cart_group_id}` : order.business?.name}
                 </OText>
               </View>
               {!!!pastOrders && (
@@ -253,7 +288,7 @@ const SingleOrderCardUI = (props: SingleOrderCardParams) => {
             <ContentFooter>
               <View style={{ flex: 1 }}>
                 <View style={styles.infoText}>
-                  {!!!pastOrders && (
+                  {(!!!pastOrders || order?.business?.length > 1) && (
                     <>
                       <OText
                         size={10}
@@ -263,7 +298,7 @@ const SingleOrderCardUI = (props: SingleOrderCardParams) => {
                         lineHeight={15}
                         numberOfLines={1}
                       >
-                        {t('ORDER_NO', 'Order No') + '.'}
+                        {order?.business?.length > 1 ? order?.business?.length : (t('ORDER_NO', 'Order No') + '.')}
                       </OText>
                       <OText
                         size={10}
@@ -272,7 +307,7 @@ const SingleOrderCardUI = (props: SingleOrderCardParams) => {
                         lineHeight={15}
                         numberOfLines={1}
                       >
-                        {order.id + ` \u2022 `}
+                        {order?.business?.length > 1 ? t('ORDERS', 'orders') + ' \u2022 ' : order.id + ` \u2022 `}
                       </OText>
                     </>
                   )}
@@ -297,7 +332,7 @@ const SingleOrderCardUI = (props: SingleOrderCardParams) => {
                   {getOrderStatus(order.status)?.value}
                 </OText>
               </View>
-              {!isMessageView && (
+              {!isMessageView && !order?.business?.length && (
                 <LottieAnimation
                   type='favorite'
                   onClick={handleChangeFavorite}

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

@@ -1,4 +1,4 @@
-import styled from 'styled-components/native'
+import styled, { css } from 'styled-components/native'
 
 export const InnerContainer = styled.View`
   flex-direction: row;
@@ -8,6 +8,9 @@ export const InnerContainer = styled.View`
 export const Logo = styled.View`
 	border-radius: 7.6px;
   margin-right: 12px;
+  ${({ isMulti } : any) => isMulti && css`
+      margin-right: 5px;
+    `}
 `
 
 export const CardInfoWrapper = styled.View`
@@ -45,3 +48,9 @@ export const Price = styled.View`
   margin-left: 10px;
   width: 30%;
 `
+
+export const MultiLogosContainer = styled.View`
+  display: flex;
+  align-items: center;
+  flex-direction: row;
+`

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

@@ -222,6 +222,7 @@ export interface BusinessControllerParams {
 	handleUpdateBusinessList?: any;
 	enableIntersection?: boolean;
 	isCustomLayout?: boolean;
+	getBusinessOffer?: any;
 	handleCustomUpdate?: (businessId: number, changes: any) => {};
 }
 export interface BusinessProductsListingParams {
@@ -529,6 +530,7 @@ export interface FloatingButtonParams {
 	handleClick?: any;
 	handleEmpty?: any;
 	iosBottom?: number
+	hideButton?: boolean
 }
 export interface MomentOptionParams {
 	navigation: any;