ordering-ui-react-native 0.15.54 → 0.15.57

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

@@ -23,6 +23,7 @@ import {
   Table,
   OrderBill,
   Total,
+  OSRow,
 } from './styles'
 import { OrderDetailsParams, Product } from '../../types'
 import { Container } from '../../layouts/Container';
@@ -178,6 +179,20 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
     setIsLoading(false)
   }
 
+  const getIncludedTaxes = () => {
+    if (order?.taxes?.length === 0) {
+      return order.tax_type === 1 ? order?.summary?.tax ?? 0 : 0
+    } else {
+      return order?.taxes.reduce((taxIncluded: number, tax: any) => {
+        return taxIncluded + (tax.type === 1 ? tax.summary?.tax : 0)
+      }, 0)
+    }
+  }
+
+  const getIncludedTaxesDiscounts = () => {
+    return order?.taxes?.filter((tax: any) => tax?.type === 1)?.reduce((carry: number, tax: any) => carry + (tax?.summary?.tax_after_discount ?? tax?.summary?.tax), 0)
+  }
+
   useEffect(() => {
     const backAction = () => {
       Alert.alert(`${t('HOLD_ON', 'Hold on')}!`, `${t('ARE_YOU_SURE_YOU_WANT_TO_GO_BACK', 'Are you sure you want to go back')}?`, [
@@ -209,7 +224,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
     const getCustomerName = async () => {
       try {
         const { customerName: name } = await _retrieveStoreData('customer_name')
-          setCustomerName(name)
+        setCustomerName(name)
       } catch (e) {
         if (e) {
           setCustomerName(null)
@@ -217,8 +232,8 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
       }
     }
     getCustomerName()
-    const redirectHome = setTimeout(() =>{
-      _setStoreData('customer_name', {customerName: ''});
+    const redirectHome = setTimeout(() => {
+      _setStoreData('customer_name', { customerName: '' });
       navigation.reset({
         routes: [{ name: 'Intro' }],
       });
@@ -345,7 +360,7 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
       <OButton
         text={`${t('YOU_ARE_DONE', 'You are done! Click to close')}!`}
         onClick={() => {
-          _setStoreData('customer_name', {customerName: ''});
+          _setStoreData('customer_name', { customerName: '' });
           navigation.reset({
             routes: [{ name: 'Intro' }],
           });
@@ -419,46 +434,135 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
         <Table>
           <OText>{t('SUBTOTAL', 'Subtotal')}</OText>
           <OText>
-            {parsePrice(isTaxIncluded
-              ? (order?.summary?.subtotal + order?.summary?.tax) ?? 0
-              : order?.summary?.subtotal ?? 0
-            )}
+            {parsePrice(((order?.summary?.subtotal ?? order?.subtotal) + getIncludedTaxes()))}
           </OText>
         </Table>
-        {order?.summary?.discount > 0 && (
+        {(order?.summary?.discount > 0 ?? order?.discount > 0) && order?.offers?.length === 0 && (
           <Table>
             {order?.offer_type === 1 ? (
               <OText>
                 {t('DISCOUNT', 'Discount')}
-                <OText>{`(${verifyDecimals(order?.offer_rate, parsePrice)}%)`}</OText>
+                <OText>{`(${verifyDecimals(
+                  order?.offer_rate,
+                  parsePrice,
+                )}%)`}</OText>
               </OText>
             ) : (
               <OText>{t('DISCOUNT', 'Discount')}</OText>
             )}
-            <OText>- {parsePrice(order?.summary?.discount)}</OText>
+            <OText>
+              - {parsePrice(order?.summary?.discount || order?.discount)}
+            </OText>
           </Table>
         )}
+        {
+          order?.offers?.length > 0 && order?.offers?.filter((offer: any) => offer?.target === 1)?.map((offer: any) => (
+            <Table key={offer.id}>
+              <OSRow>
+                <OText>
+                  {offer.name}
+                  {offer.rate_type === 1 && (
+                    <OText>{`(${verifyDecimals(offer?.rate, parsePrice)}%)`}</OText>
+                  )}
+                </OText>
+              </OSRow>
+              <OText>- {parsePrice(offer?.summary?.discount)}</OText>
+            </Table>
+          ))
+        }
         {order?.summary?.subtotal_with_discount > 0 && order?.summary?.discount > 0 && order?.summary?.total >= 0 && (
           <Table>
             <OText>{t('SUBTOTAL_WITH_DISCOUNT', 'Subtotal with discount')}</OText>
-            <OText>{parsePrice(order?.summary?.subtotal_with_discount ?? 0)}</OText>
-          </Table>
-        )}
-        {order?.tax_type !== 1 && (
-          <Table>
-            <OText>
-              {t('TAX', 'Tax')}
-              {`(${verifyDecimals(order?.summary?.tax_rate, parseNumber)}%)`}
-            </OText>
-            <OText>{parsePrice(order?.summary?.tax)}</OText>
+            {order?.tax_type === 1 ? (
+              <OText>{parsePrice((order?.summary?.subtotal_with_discount + getIncludedTaxesDiscounts() ?? 0))}</OText>
+            ) : (
+              <OText>{parsePrice(order?.summary?.subtotal_with_discount ?? 0)}</OText>
+            )}
           </Table>
         )}
+        {
+          order?.taxes?.length === 0 && order?.tax_type === 2 && (
+            <Table>
+              <OText>
+                {t('TAX', 'Tax')} {`(${verifyDecimals(order?.tax, parseNumber)}%)`}
+              </OText>
+              <OText>{parsePrice(order?.summary?.tax || 0)}</OText>
+            </Table>
+          )
+        }
+        {
+          order?.fees?.length === 0 && (
+            <Table>
+              <OText>
+                {t('SERVICE_FEE', 'Service fee')}
+                {`(${verifyDecimals(order?.service_fee, parseNumber)}%)`}
+              </OText>
+              <OText>{parsePrice(order?.summary?.service_fee || 0)}</OText>
+            </Table>
+          )
+        }
+        {
+          order?.taxes?.length > 0 && order?.taxes?.filter((tax: any) => tax?.type === 2 && tax?.rate !== 0).map((tax: any) => (
+            <Table key={tax.id}>
+              <OSRow>
+                <OText>
+                  {tax.name || t('INHERIT_FROM_BUSINESS', 'Inherit from business')}
+                  {`(${verifyDecimals(tax?.rate, parseNumber)}%)`}{' '}
+                </OText>
+              </OSRow>
+              <OText>{parsePrice(tax?.summary?.tax_after_discount ?? tax?.summary?.tax ?? 0)}</OText>
+            </Table>
+          ))
+        }
+        {
+          order?.fees?.length > 0 && order?.fees?.filter((fee: any) => !(fee.fixed === 0 && fee.percentage === 0))?.map((fee: any) => (
+            <Table key={fee.id}>
+              <OSRow>
+                <OText>
+                  {fee.name || t('INHERIT_FROM_BUSINESS', 'Inherit from business')}
+                  ({fee?.fixed > 0 && `${parsePrice(fee?.fixed)} + `}{fee.percentage}%){' '}
+                </OText>
+              </OSRow>
+              <OText>{parsePrice(fee?.summary?.fixed + (fee?.summary?.percentage_after_discount ?? fee?.summary?.percentage) ?? 0)}</OText>
+            </Table>
+          ))
+        }
+        {
+          order?.offers?.length > 0 && order?.offers?.filter((offer: any) => offer?.target === 3)?.map((offer: any) => (
+            <Table key={offer.id}>
+              <OSRow>
+                <OText>
+                  {offer.name}
+                  {offer.rate_type === 1 && (
+                    <OText>{`(${verifyDecimals(offer?.rate, parsePrice)}%)`}</OText>
+                  )}
+                </OText>
+              </OSRow>
+              <OText>- {parsePrice(offer?.summary?.discount)}</OText>
+            </Table>
+          ))
+        }
         {order?.summary?.delivery_price > 0 && (
           <Table>
             <OText>{t('DELIVERY_FEE', 'Delivery Fee')}</OText>
             <OText>{parsePrice(order?.summary?.delivery_price)}</OText>
           </Table>
         )}
+        {
+          order?.offers?.length > 0 && order?.offers?.filter((offer: any) => offer?.target === 2)?.map((offer: any) => (
+            <Table key={offer.id}>
+              <OSRow>
+                <OText>
+                  {offer.name}
+                  {offer.rate_type === 1 && (
+                    <OText>{`(${verifyDecimals(offer?.rate, parsePrice)}%)`}</OText>
+                  )}
+                </OText>
+              </OSRow>
+              <OText>- {parsePrice(offer?.summary?.discount)}</OText>
+            </Table>
+          ))
+        }
         {order?.summary?.driver_tip > 0 && (
           <Table>
             <OText>
@@ -470,23 +574,14 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
                   `(${verifyDecimals(order?.summary?.driver_tip, parseNumber)}%)`
                 )}
             </OText>
-            <OText>{parsePrice(order?.summary?.driver_tip ?? 0)}</OText>
-          </Table>
-        )}
-        {order?.summary?.service_fee > 0 && (
-          <Table>
-            <OText>
-              {t('SERVICE_FEE', 'Service Fee')}
-              {`(${verifyDecimals(order?.summary?.service_fee, parseNumber)}%)`}
-            </OText>
-            <OText>{parsePrice(order?.summary?.service_fee)}</OText>
+            <OText>{parsePrice(order?.summary?.driver_tip ?? order?.totalDriverTip)}</OText>
           </Table>
         )}
         <Total>
           <Table>
             <OText style={styles.textBold}>{t('TOTAL', 'Total')}</OText>
             <OText style={styles.textBold} color={theme.colors.primary}>
-              {parsePrice(order?.summary?.total ?? 0)}
+              {parsePrice(order?.summary?.total ?? order?.total)}
             </OText>
           </Table>
         </Total>
@@ -508,14 +603,14 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
                 <OIconButton
                   bgColor="transparent"
                   borderColor="transparent"
-                  RenderIcon={() => 
-                      <EvilIcons
-                        name={'close'}
-                        size={40}
-                        color={theme.colors.primary}
-                      />
+                  RenderIcon={() =>
+                    <EvilIcons
+                      name={'close'}
+                      size={40}
+                      color={theme.colors.primary}
+                    />
                   }
-                  style={{ flex:1, justifyContent: 'flex-end', left: 30 }}
+                  style={{ flex: 1, justifyContent: 'flex-end', left: 30 }}
                   onClick={() => {
                     navigation.reset({
                       routes: [{ name: 'Intro' }],

package/themes/kiosk/src/components/OrderDetails/styles.tsx

@@ -51,3 +51,8 @@ export const Total = styled.View`
   padding-vertical: 10px;
 `
 
+export const OSRow = styled.View`
+  flex-direction: row;
+  overflow: hidden;
+  width: 80%;
+`

package/themes/kiosk/src/types/index.d.ts

@@ -472,6 +472,8 @@ export interface Cart {
   delivery_price_with_discount: number;
   total: number;
   clearInactivityTimeout: any;
+  taxes: Array<any>;
+  fees: Array<any>;
 }
 
 export interface NoNetworkParams {

package/themes/original/index.tsx

@@ -50,6 +50,74 @@ import { BusinessTypeFilter } from './src/components/BusinessTypeFilter';
 import { BusinessController } from './src/components/BusinessController';
 import { BusinessFeaturedController } from './src/components/BusinessFeaturedController';
 import { HighestRatedBusinesses } from './src/components/HighestRatedBusinesses';
+import { PaymentOptions } from './src/components/PaymentOptions';
+import { DriverTips } from './src/components/DriverTips';
+import { UserDetails } from './src/components/UserDetails';
+import { OrderSummary } from './src/components/OrderSummary';
+import { CartStoresListing } from './src/components/CartStoresListing';
+import { PaymentOptionsWebView } from '../../src/components/PaymentOptionsWebView';
+import { GoogleMap } from './src/components/GoogleMap';
+import { SingleProductCard } from './src/components/SingleProductCard';
+import { UpsellingRedirect } from './src/components/BusinessProductsListing/UpsellingRedirect';
+import { ProductItemAccordion } from './src/components/ProductItemAccordion';
+import { BusinessItemAccordion } from './src/components/BusinessItemAccordion';
+import { CouponControl } from './src/components/CouponControl';
+import { TaxInformation } from './src/components/TaxInformation';
+import { PlaceSpot } from './src/components/PlaceSpot';
+import { Cart } from './src/components/Cart';
+import { LanguageSelector } from './src/components/LanguageSelector';
+import { PhoneInputNumber } from './src/components/PhoneInputNumber'
+import { FacebookLogin } from './src/components/FacebookLogin';
+import { VerifyPhone } from './src/components/VerifyPhone';
+import { GoogleLogin } from './src/components/GoogleLogin';
+import { PreviousOrders } from './src/components/PreviousOrders';
+import { PaymentOptionCash } from './src/components/PaymentOptionCash';
+import { StripeElementsForm } from './src/components/StripeElementsForm';
+import { StripeCardsList } from './src/components/StripeCardsList';
+import { ProductIngredient } from './src/components/ProductIngredient';
+import { ProductOption } from './src/components/ProductOption';
+import { ProductOptionSubOption } from './src/components/ProductOptionSubOption';
+import { SingleProductReview } from './src/components/SingleProductReview';
+import { LogoutButton } from './src/components/LogoutButton';
+import { UserFormDetailsUI } from './src/components/UserFormDetails';
+import { WalletTransactionItem } from './src/components/WalletTransactionItem';
+
+import { USER_TYPE, ORDER_TYPES } from './src/config/constants'
+
+import { OSBill, OSTable, OSCoupon, OSTotal, OSRow } from './src/components/OrderSummary/styles';
+
+import { FormInput, FormSide, ButtonsWrapper, LoginWith, OTab, OTabs } from './src/components/LoginForm/styles';
+import { OSItem, OSItemContent, OSItemActions} from './src/components/PaymentOptionStripe/styles';
+
+import Alert from './src/providers/AlertProvider'
+
+import { 
+	LoginParams,
+	ProfileParams,
+	AddressListParams,
+	AddressFormParams,
+	SignupParams,
+	PhoneInputParams,
+	LanguageSelectorParams,
+	BusinessesListingParams,
+	HighestRatedBusinessesParams,
+	BusinessTypeFilterParams,
+	BusinessControllerParams,
+	BusinessProductsListingParams,
+	BusinessBasicInformationParams,
+	BusinessProductsCategoriesParams,
+	BusinessProductsListParams,
+	SingleProductCardParams,
+	BusinessInformationParams,
+	BusinessReviewsParams,
+	SearchBarParams,
+	NotFoundSourceParams,
+	OrdersOptionParams,
+	ActiveOrdersParams,
+	PreviousOrdersParams,
+	OrderDetailsParams,
+	ReviewDriverParams
+} from './src/types';
 
 import { Toast } from './src/components/shared/OToast';
 import {
@@ -71,6 +139,8 @@ import {
 
 import { Container } from './src/layouts/Container';
 import { SafeAreaContainer } from './src/layouts/SafeAreaContainer';
+import { FloatingBottomContainer } from './src/layouts/FloatingBottomContainer';
+
 import {
 	_retrieveStoreData,
 	_setStoreData,
@@ -130,6 +200,86 @@ export {
 	BusinessController,
 	BusinessFeaturedController,
 	HighestRatedBusinesses,
+	PaymentOptions,
+	DriverTips,
+	UserDetails,
+	OrderSummary,
+	CartStoresListing,
+	PaymentOptionsWebView,
+	GoogleMap,
+	SingleProductCard,
+	UpsellingRedirect,
+	ProductItemAccordion,
+	BusinessItemAccordion,
+	CouponControl,
+	TaxInformation,
+	PlaceSpot,
+	Cart,
+	LanguageSelector,
+	PhoneInputNumber,
+	FacebookLogin,
+	VerifyPhone,
+	GoogleLogin,
+	PreviousOrders,
+	PaymentOptionCash,
+	StripeElementsForm,
+	StripeCardsList,
+	ProductIngredient,
+	ProductOption,
+	ProductOptionSubOption,
+	SingleProductReview,
+	LogoutButton,
+	UserFormDetailsUI,
+	WalletTransactionItem,
+
+	ORDER_TYPES,
+	USER_TYPE,
+
+	OSBill,
+	OSTable,
+	OSCoupon,
+	OSTotal,
+	OSRow,
+
+	FormInput,
+	FormSide,
+	ButtonsWrapper,
+	LoginWith,
+	OTab,
+	OTabs,
+
+	OSItem,
+	OSItemContent,
+	OSItemActions,
+
+	Alert,
+
+	//Types
+	LoginParams,
+	ProfileParams,
+	AddressListParams,
+	AddressFormParams,
+	SignupParams,
+	PhoneInputParams,
+	LanguageSelectorParams,
+	BusinessesListingParams,
+	HighestRatedBusinessesParams,
+	BusinessTypeFilterParams,
+	BusinessControllerParams,
+	BusinessProductsListingParams,
+	BusinessBasicInformationParams,
+	BusinessProductsCategoriesParams,
+	BusinessProductsListParams,
+	SingleProductCardParams,
+	BusinessInformationParams,
+	BusinessReviewsParams,
+	SearchBarParams,
+	NotFoundSourceParams,
+	OrdersOptionParams,
+	ActiveOrdersParams,
+	PreviousOrdersParams,
+	OrderDetailsParams,
+	ReviewDriverParams,
 
 	// OComponents
 	Toast,
@@ -151,6 +301,7 @@ export {
 	// layout
 	Container,
 	SafeAreaContainer,
+	FloatingBottomContainer,
 	NavBar,
 
 	// utils

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

@@ -140,7 +140,7 @@ const AddressListUI = (props: AddressListParams) => {
 				<AddressListContainer>
 					{isProfile && (
 						<NavBar
-							title={t('MY_SAVED_PLACES', 'My saved places')}
+							title={t('SAVED_PLACES', 'My saved places')}
 							titleAlign={'center'}
 							onActionLeft={() => goToBack()}
 							showCall={false}

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

@@ -1,6 +1,6 @@
-import React, { useEffect } from 'react';
+import React, { useEffect, useState } from 'react';
 import { Platform, Text, StyleSheet } from 'react-native';
-import { useApi, useSession, useLanguage, useConfig } from 'ordering-components/native';
+import { useApi, useSession, useLanguage, useConfig, useToast, ToastType } from 'ordering-components/native';
 import { appleAuthAndroid, appleAuth } from '@invertase/react-native-apple-authentication';
 import uuid from 'react-native-uuid';
 import Icon from 'react-native-vector-icons/FontAwesome5';
@@ -18,7 +18,12 @@ export const AppleLogin = (props: any) => {
   const [ordering] = useApi();
   const [{ auth }] = useSession();
   const [, t] = useLanguage();
-  const [{ configs }] = useConfig()
+  const [{ configs }] = useConfig();
+  const [, {showToast}] = useToast()
+  const [credentialStateForUser, updateCredentialStateForUser] = useState<any>(-1);
+
+  let user : any= null
+
   const buttonText = auth
     ? t('CONTINUE_WITH_APPLE', 'Logout with Apple')
     : t('CONTINUE_WITH_FACEBOOK', 'Continue with Apple');
@@ -39,8 +44,8 @@ export const AppleLogin = (props: any) => {
           handleLoading && handleLoading(false)
         }
       } else {
+        showToast(ToastType.Error, `Error login on apple from api Code: ${code}`, 10000)
         handleLoading && handleLoading(false)
-        logoutFromApple()
       }
     } catch (err: any) {
       handleLoading && handleLoading(false)
@@ -48,33 +53,52 @@ export const AppleLogin = (props: any) => {
     }
   }
 
-  const logoutFromApple = () => {
-
+  const fetchAndUpdateCredentialState = async (updateCredentialStateForUser : any) => {
+    if (user === null) {
+      updateCredentialStateForUser('N/A');
+    } else {
+      const credentialState = await appleAuth.getCredentialStateForUser(user);
+      if (credentialState === appleAuth.State.AUTHORIZED) {
+        updateCredentialStateForUser('AUTHORIZED');
+      } else {
+        updateCredentialStateForUser(credentialState);
+      }
+    }
   }
 
-  const onIOSButtonPress = async () => {
+  const onIOSButtonPress = async (updateCredentialStateForUser : any) => {
     try {
       const appleAuthRequestResponse = await appleAuth.performRequest({
         requestedOperation: appleAuth.Operation.LOGIN,
         requestedScopes: [appleAuth.Scope.EMAIL, appleAuth.Scope.FULL_NAME],
       });
 
-      // get current authentication state for user
-      // /!\ This method must be tested on a real device. On the iOS simulator it always throws an error.
-      const credentialState = await appleAuth.getCredentialStateForUser(appleAuthRequestResponse.user);
-
-      // use credentialState response to ensure the user is authenticated
-      if (credentialState === appleAuth.State.AUTHORIZED) {
-        // user is authenticated
-        if (appleAuthRequestResponse.authorizationCode) {
-          performAppleLogin(appleAuthRequestResponse.authorizationCode)
-        }
+      const {
+        user: newUser,
+        email,
+        identityToken,
+        authorizationCode
+      } = appleAuthRequestResponse;
+  
+      user = newUser;
+
+      fetchAndUpdateCredentialState(updateCredentialStateForUser).catch(error =>
+        updateCredentialStateForUser(`Error: ${error.code}`),
+      );
+
+      if (identityToken && authorizationCode) {
+        showToast(ToastType.Success, `Apple Authentication Completed, ${email}`)
+        performAppleLogin(authorizationCode)
+      } else {
+        handleErrors && handleErrors('UNABLE_LOGIN_TOKEN', 'Unable to login, no token found')
       }
+
     } catch (err: any) {
       handleLoading && handleLoading(false)
       handleErrors && handleErrors(err.message)
     }
   }
+
   const onAndroidButtonPress = async () => {
     try {
       // Generate secure, random values for state and nonce
@@ -108,10 +132,20 @@ export const AppleLogin = (props: any) => {
   }
 
   useEffect(() => {
-    if (Platform.OS == 'android') return;
-    // onCredentialRevoked returns a function that will remove the event listener. useEffect will call this function when the component unmounts
+    if (!appleAuth.isSupported || Platform.OS === 'android') return;
+
+    fetchAndUpdateCredentialState(updateCredentialStateForUser).catch(error =>
+      updateCredentialStateForUser(`Error: ${error.code}`),
+    );
+  }, []);
+
+  useEffect(() => {
+    if (!appleAuth.isSupported || Platform.OS === 'android') return;
+
     return appleAuth.onCredentialRevoked(async () => {
-      console.warn('If this function executes, User Credentials have been Revoked');
+      fetchAndUpdateCredentialState(updateCredentialStateForUser).catch(error =>
+        updateCredentialStateForUser(`Error: ${error.code}`),
+      );
     });
   }, []);
 
@@ -123,9 +157,12 @@ export const AppleLogin = (props: any) => {
 
   return (
     <Container>
+      {credentialStateForUser !== -1 && (
+        <Text>{credentialStateForUser}</Text>
+      )}
       {canShowButton() &&
         <AppleButton
-          onPress={() => Platform.OS == 'android' ? onAndroidButtonPress() : onIOSButtonPress()}
+          onPress={() => Platform.OS == 'android' ? onAndroidButtonPress() : onIOSButtonPress(updateCredentialStateForUser)}
         >
           <Icon
             name="apple"