ordering-ui-react-native 0.21.49-test → 0.21.49-test-v2

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

@@ -92,7 +92,7 @@ export const BusinessListingSearchUI = (props: BusinessSearchParams) => {
     },
     filterContainer: {
       maxHeight: screenHeight - 150,
-      paddingHorizontal: 40,
+      paddingHorizontal: 20,
       width: '100%'
     },
     searchInput: {
@@ -259,7 +259,6 @@ export const BusinessListingSearchUI = (props: BusinessSearchParams) => {
         display: 'flex',
         flexDirection: 'row',
         alignItems: 'center',
-        paddingHorizontal: hideBrowse && !isChewLayout ? 40 : 20,
       }}>
         {hideBrowse && !isChewLayout && (
           <OButton
@@ -288,7 +287,7 @@ export const BusinessListingSearchUI = (props: BusinessSearchParams) => {
         <AntDesignIcon name='filter' size={18} style={{ marginLeft: 'auto', marginTop: 55, paddingHorizontal: 20 }} onPress={() => handleOpenfilters()} />
       </View>
       <BContainer
-        style={{ paddingHorizontal: isChewLayout ? 20 : 40 }}
+        style={{ paddingHorizontal: 20 }}
       >
         <SearchWrapper>
           <SearchBar

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

@@ -1,7 +1,7 @@
 import styled, { css } from 'styled-components/native'
 
 export const BContainer = styled.View`
-  padding: 20px 40px;
+  padding: 20px;
 `
 
 export const SearchWrapper = styled.View`

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

@@ -64,7 +64,7 @@ const BusinessPreorderUI = (props: BusinessPreorderParams) => {
     container: {
       height: windowHeight,
       paddingVertical: 30,
-      paddingHorizontal: 40
+      paddingHorizontal: 20
     },
     businessLogo: {
       backgroundColor: 'white',
@@ -319,7 +319,7 @@ const BusinessPreorderUI = (props: BusinessPreorderParams) => {
 
   return (
     <>
-      <PreOrderContainer contentContainerStyle={{ paddingVertical: 32, paddingHorizontal: 40 }}>
+      <PreOrderContainer contentContainerStyle={{ paddingVertical: 32, paddingHorizontal: 20 }}>
         <TouchableOpacity onPress={() => goToBack && goToBack()} style={{ marginBottom: 12 }}>
           <IconAntDesign
             name='close'

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

@@ -92,7 +92,7 @@ const BusinessProductsCategoriesUI = (props: any) => {
 			ref={tabsRef}
 			horizontal
 			style={{ ...styles.container, borderBottomWidth: loading ? 0 : 1 }}
-			contentContainerStyle={{ paddingHorizontal: 40 }}
+			contentContainerStyle={{ paddingHorizontal: 20 }}
 			showsHorizontalScrollIndicator={false}
 			onScroll={(e: any) => setScrollOffsetX(e.nativeEvent.contentOffset.x)}
 			scrollEventThrottle={16}

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

@@ -106,7 +106,7 @@ const BusinessProductsListUI = (props: BusinessProductsListParams) => {
             <SingleProductCard
               key={'prod_' + product.id + `_${i}`}
               isSoldOut={product.inventoried && !product.quantity}
-              enableIntersection={!isFiltMode}
+              // enableIntersection={!isFiltMode}
               product={product}
               businessId={businessId}
               categoryState={categoryState}
@@ -135,7 +135,7 @@ const BusinessProductsListUI = (props: BusinessProductsListParams) => {
                       key={'feat_' + product.id + `_${i}`}
                       isSoldOut={product.inventoried && !product.quantity}
                       product={product}
-                      enableIntersection={!isFiltMode}
+                      // enableIntersection={!isFiltMode}
                       businessId={businessId}
                       categoryState={categoryState}
                       onProductClick={onProductClick}

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

@@ -114,7 +114,7 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
     },
     searchIcon: {
       borderWidth: 0,
-      padding: 15,
+      padding: 10,
       justifyContent: 'center',
       shadowColor: theme.colors.clear,
     },
@@ -194,7 +194,8 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
         product: product,
         businessSlug: business.slug,
         businessId: business.id || product?.category?.business_id,
-        productAddedToCartLength
+        productAddedToCartLength,
+        isRedirect: false
       })
     }
     events.emit('product_clicked', product)
@@ -529,9 +530,6 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
             </View>
           </FiltProductsContainer>
         )}
-        {isOpenFiltProducts && (
-          <BackgroundGray isIos={Platform.OS === 'ios'} />
-        )}
         <IOScrollView
           stickyHeaderIndices={[business?.professionals?.length > 0 ? 4 : 3]}
           style={{
@@ -570,7 +568,9 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
               />
             </ProfessionalFilterWrapper>
           )}
-          <PageBanner position='app_business_page' navigation={navigation} />
+          {businessState?.business?.id && (
+            <PageBanner position='app_business_page' businessId={businessState?.business?.id} navigation={navigation} />
+          )}
           <View
             style={{
               height: 8,
@@ -598,7 +598,7 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
             <>
               <WrapContent
                 onLayout={(event: any) => setProductListLayout(event.nativeEvent.layout)}
-                style={{ paddingHorizontal: isChewLayout ? 20 : 40 }}
+                style={{ paddingHorizontal: 20 }}
               >
                 <BusinessProductsList
                   categories={[
@@ -655,6 +655,9 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
               </WrapContent>
             </>
           )}
+          {isOpenFiltProducts && (
+            <BackgroundGray isIos={Platform.OS === 'ios'} />
+          )}
         </IOScrollView>
         {viewOrderButtonVisible && (
           <View style={{ marginBottom: 0 }}>
@@ -712,7 +715,6 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
           professionalList={business?.professionals}
           professionalSelected={professionalSelected}
           handleChangeProfessional={handleChangeProfessionalSelected}
-          handleChangeProfessional={handleChangeProfessionalSelected}
           handleUpdateProfessionals={handleUpdateProfessionals}
           onSave={() => setOpenService(false)}
           onClose={() => setOpenService(false)}
@@ -726,6 +728,8 @@ export const BusinessProductsListing = (props: BusinessProductsListingParams) =>
   const businessProductslistingProps = {
     ...props,
     isForceSearch: Platform.OS === 'ios',
+    isApp: true,
+    isFetchAllProducts: true,
     UIComponent: BusinessProductsListingUI
   }
   return (

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

@@ -50,7 +50,7 @@ export const BackgroundGray = styled.View`
 `
 
 export const ProfessionalFilterWrapper = styled.View`
-  padding-left: 40px;
+  padding-left: 20px;
   margin-bottom: 35px;
 `
 
@@ -63,6 +63,6 @@ export const NearBusiness = styled.View`
 export const TopActions = styled.TouchableOpacity`
 	height: 60px;
 	justify-content: center;
-  padding-horizontal: 30px;
+  padding-horizontal: 20px;
   width: 100px;
 `;

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

@@ -109,7 +109,7 @@ const BusinessReviewsUI = (props: BusinessReviewsParams) => {
 	return (
 		<BusinessReviewsContainer>
 			<BusinessReviewContent
-				contentContainerStyle={{ paddingHorizontal: 40, paddingVertical: 27 }}>
+				contentContainerStyle={{ paddingHorizontal: 20, paddingVertical: 27 }}>
 				{reviewsList.error ? (
 					<OText size={16}>{t('ERROR_UNKNOWN', 'An error has ocurred')}</OText>
 				) : (

package/themes/original/src/components/BusinessesListing/Layout/Appointment/index.tsx

@@ -415,7 +415,7 @@ const BusinessesListingUI = (props: BusinessesListingParams) => {
 						<ScrollView
 							showsHorizontalScrollIndicator={false}
 							nestedScrollEnabled
-							horizontal contentContainerStyle={{ paddingHorizontal: 40 }}>
+							horizontal contentContainerStyle={{ paddingHorizontal: 20 }}>
 							{featuredBusiness.map((bAry: any, idx) => (
 								<View key={'f-listing_' + idx}>
 									<BusinessFeaturedController

package/themes/original/src/components/BusinessesListing/Layout/Appointment/styles.tsx

@@ -54,13 +54,13 @@ export const WrapMomentOption = styled.TouchableOpacity`
 export const HeaderWrapper = styled.ImageBackground`
 	width: 100%;
 	height: 370px;
-	padding: 20px 40px;
+	padding: 20px;
 	background-color: transparent;
 `;
 
 export const ListWrapper = styled.View`
 	background-color: ${(props: any) => props.theme.colors.backgroundLight};
-	padding-horizontal: 40px;
+	padding-horizontal: 20px;
 `;
 
 export const FeaturedWrapper = styled.View`
@@ -72,7 +72,7 @@ export const FeaturedWrapper = styled.View`
 export const OrderProgressWrapper = styled.View`
   margin-top: 37px;
   margin-bottom: 20px;
-	padding-horizontal: 40px;
+	padding-horizontal: 20px;
 `
 
 export const FarAwayMessage = styled.View`
@@ -98,10 +98,10 @@ export const FilterWrapper = styled.View`
 `
 
 export const ServiceWrapper = styled.View`
-  padding-horizontal: 40px;
+  padding-horizontal: 20px;
 `
 
 export const PriceWrapper = styled.View`
-  padding-horizontal: 40px;
+  padding-horizontal: 20px;
   margin-top: 30px;
 `

package/themes/original/src/components/BusinessesListing/Layout/Original/FlatListBusinessListFooter.tsx

@@ -0,0 +1,69 @@
+import React from 'react'
+import { ListWrapper } from './styles'
+import { Fade, Placeholder, PlaceholderLine } from 'rn-placeholder'
+import { View } from 'react-native'
+
+export const FlatListBusinessListFooter = (props : any) => {
+    const {
+        businessesList,
+        paginationProps,
+        isChewLayout
+    } = props
+    return (
+        <>
+            <ListWrapper style={{ paddingHorizontal: 20 }}>
+                {(businessesList.loading || !businessesList?.fetched) && (
+                    <>
+                        {[
+                            ...Array(
+                                paginationProps.nextPageItems
+                                    ? paginationProps.nextPageItems
+                                    : 8,
+                            ).keys(),
+                        ].map((item, i) => (
+                            <Placeholder
+                                Animation={Fade}
+                                key={i}
+                                style={{ marginBottom: 20 }}>
+                                <View style={{ width: '100%' }}>
+                                    <PlaceholderLine
+                                        height={200}
+                                        style={{ marginBottom: 20, borderRadius: 25 }}
+                                    />
+                                    <View style={{ paddingHorizontal: 10 }}>
+                                        <View
+                                            style={{
+                                                flexDirection: 'row',
+                                                justifyContent: 'space-between',
+                                            }}>
+                                            <PlaceholderLine
+                                                height={25}
+                                                width={40}
+                                                style={{ marginBottom: 10 }}
+                                            />
+                                            <PlaceholderLine
+                                                height={25}
+                                                width={20}
+                                                style={{ marginBottom: 10 }}
+                                            />
+                                        </View>
+                                        <PlaceholderLine
+                                            height={20}
+                                            width={30}
+                                            style={{ marginBottom: 10 }}
+                                        />
+                                        <PlaceholderLine
+                                            height={20}
+                                            width={80}
+                                            style={{ marginBottom: 10 }}
+                                        />
+                                    </View>
+                                </View>
+                            </Placeholder>
+                        ))}
+                    </>
+                )}
+            </ListWrapper>
+        </>
+    )
+}