ordering-ui-react-native 0.18.93 → 0.18.95

package/package.json

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

package/themes/kiosk/src/components/Intro/index.tsx

@@ -1,5 +1,5 @@
 import React, { useState } from 'react';
-import { StyleSheet, View, RefreshControl, ScrollView, Pressable } from 'react-native';
+import { StyleSheet, View, Pressable, TouchableOpacity } from 'react-native';
 import { useLanguage } from 'ordering-components/native';
 import { useTheme } from 'styled-components/native';
 
@@ -9,6 +9,7 @@ import OButton from '../../components/shared/OButton';
 import { LanguageSelector } from '../../components/LanguageSelector';
 import { LogoutPopup } from '../../components/LogoutPopup';
 import { PORTRAIT, LANDSCAPE, useDeviceOrientation } from "../../../../../src/hooks/DeviceOrientation";
+import { OIcon } from '../../components/shared';
 
 const Intro = (props: any): React.ReactElement => {
   const { navigation } = props;
@@ -41,6 +42,19 @@ const Intro = (props: any): React.ReactElement => {
     //     />
     //   }
     // >
+    <>
+      <View style={{ position: 'absolute', top: 25, right: 20, zIndex: 1000 }}>
+        <TouchableOpacity
+          onPress={() => setShowLogoutPopup(true)}
+        >
+          <OIcon
+            src={theme.images.general.menulogout}
+            width={24}
+            height={24}
+            color={theme.colors.disabledContrast}
+          />
+        </TouchableOpacity>
+      </View>
       <Pressable onPress={goBusiness}>
         <View style={{ height: orientationState?.dimensions?.height }}>
           {orientationState.orientation === PORTRAIT ? (
@@ -134,6 +148,7 @@ const Intro = (props: any): React.ReactElement => {
           />
         </View>
       </Pressable>
+    </>
     // </ScrollView>
   );
 };

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

@@ -146,7 +146,7 @@ export const BusinessBasicInformation = (
 	}
 
 	const getBusinessType = () => {
-		if (Object.keys(business).length <= 0) return t('GENERAL', 'General');
+		if (Object.keys(business || {}).length <= 0) return t('GENERAL', 'General');
 		const _types: any = [];
 		types.forEach(
 			(type) =>

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

@@ -229,7 +229,10 @@ export const BusinessControllerUI = (props: BusinessControllerParams) => {
 						)}
 						{(!isCustomLayout) && !hideBusinessOffer && (
 							getBusinessOffer((business?.offers)) &&
-							<OfferBox isClosed={!isBusinessOpen && (configState?.configs?.preorder_status_enabled?.value === '1')}>
+							<OfferBox
+								isClosed={!isBusinessOpen && (configState?.configs?.preorder_status_enabled?.value === '1')}
+								isRibbon={business?.ribbon?.enabled && !!business?.ribbon?.text}
+							>
 								<OText
 									size={10}
 									weight={'400'}
@@ -240,7 +243,7 @@ export const BusinessControllerUI = (props: BusinessControllerParams) => {
 								>{getBusinessOffer((business?.offers)) || parsePrice(0)}</OText>
 							</OfferBox>
 						)}
-						<BusinessState>
+						<BusinessState isRibbon={business?.ribbon?.enabled && !!business?.ribbon?.text}>
 							{!isBusinessOpen && (configState?.configs?.preorder_status_enabled?.value === '1') && (
 								<View style={styles.businessStateView}>
 									<OText

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

@@ -34,7 +34,7 @@ export const Metadata = styled.View`
 
 export const BusinessState = styled.View`
   position: absolute;
-	top: 15px;
+  top: ${(props: any) => props.isRibbon ? '32px' : '15px'};
 	right: 15px;
 `
 
@@ -86,7 +86,7 @@ export const OfferBox = styled.View`
   position: absolute;
   z-index: 1;
   border-radius: 50px;
-  top: 15px;
+  top: ${(props: any) => props.isRibbon ? '32px' : '15px'};
   right: ${(props: any) => props.isClosed ? '110px' : '15px'};
   background: ${(props: any) => props.theme.colors.inputBorderColor};
   padding: 3px 8px;

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

@@ -1,4 +1,5 @@
 import React, { useState, useEffect } from 'react'
+import { useFocusEffect } from '@react-navigation/native'
 import { TouchableOpacity, StyleSheet, View, Dimensions, Platform } from 'react-native'
 import { useLanguage, useUtils, useConfig, useOrder, MomentOption } from 'ordering-components/native'
 import { OButton, OIcon, OText } from '../shared'
@@ -310,9 +311,11 @@ const BusinessPreorderUI = (props: BusinessPreorderParams) => {
     }
   }, [dateSelected])
 
-  useEffect(() => {
-    handleAsap && handleAsap()
-  }, [])
+  useFocusEffect(
+    React.useCallback(() => {
+      handleAsap && handleAsap()
+    }, [])
+  )
 
   return (
     <>

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

@@ -691,8 +691,8 @@ const BusinessProductsListingUI = (props: BusinessProductsListingParams) => {
         <ServiceForm
           navigation={navigation}
           product={currentProduct}
-          businessSlug={business.slug}
-          businessId={business.id}
+          businessSlug={business?.slug}
+          businessId={business?.id}
           professionalList={business?.professionals}
           professionalSelected={professionalSelected}
           handleChangeProfessional={handleChangeProfessionalSelected}

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

@@ -108,14 +108,14 @@ export const ProductItemAccordion = (props: ProductItemAccordionParams) => {
 	/* const toggleAccordion = () => {
 		if ((!product?.valid_menu && isCartProduct)) return
 		if (isActive) {
-		  Animated.timing(setHeight.height, {
+			Animated.timing(setHeight.height, {
 			 toValue: 100,
 			 duration: 500,
 			 easing: Easing.linear,
 			 useNativeDriver: false,
-		  }).start()
+			}).start()
 		} else {
-		  setHeightState({height: new Animated.Value(0)})
+			setHeightState({height: new Animated.Value(0)})
 		}
 	 }*/
 
@@ -136,7 +136,7 @@ export const ProductItemAccordion = (props: ProductItemAccordionParams) => {
 	}
 
 	/*useEffect(() => {
-	  toggleAccordion()
+		toggleAccordion()
 	}, [isActive])*/
 
 	const productOptions = getProductMax && [...Array(getProductMax(product) + 1),].map((_: any, opt: number) => {
@@ -289,7 +289,7 @@ export const ProductItemAccordion = (props: ProductItemAccordionParams) => {
 							)}
 							{productInfo().options.length > 0 && (
 								<ProductOptionsList>
-									{productInfo().options.map((option: any, i: number) => (
+									{productInfo().options.sort((a: any, b: any) => a.rank - b.rank).map((option: any, i: number) => (
 										<ProductOption key={option.id + i}>
 											<OText size={10} color={theme.colors.textSecondary}>{option.name}</OText>
 											{option.suboptions.map((suboption: any) => (