ordering-ui-react-native 0.21.23 → 0.21.24-release

package/src/pages/Help.tsx

@@ -1,23 +0,0 @@
-import React from 'react'
-import { Container } from '../layouts/Container'
-import { Help as HelpController } from '../components/Help'
-
-
-interface Props {
-  navigation: any;
-  route: any;
-}
-
-const Help = (props: Props) => {
-  const helpProps = {
-    ...props
-  }
-
-  return (
-    <Container>
-      <HelpController {...helpProps} />
-    </Container>
-  )
-}
-
-export default Help

package/src/pages/HelpAccountAndPayment.tsx

@@ -1,23 +0,0 @@
-import React from 'react'
-import { Container } from '../layouts/Container'
-import { HelpAccountAndPayment as HelpAccountAndPaymentController } from '../components/HelpAccountAndPayment'
-
-
-interface Props {
-  navigation: any;
-  route: any;
-}
-
-const HelpAccountAndPayment = (props: Props) => {
-  const helpAccountAndPaymentProps = {
-    ...props
-  }
-
-  return (
-    <Container>
-      <HelpAccountAndPaymentController {...helpAccountAndPaymentProps} />
-    </Container>
-  )
-}
-
-export default HelpAccountAndPayment

package/src/pages/HelpGuide.tsx

@@ -1,23 +0,0 @@
-import React from 'react'
-import { Container } from '../layouts/Container'
-import { HelpGuide as HelpGuideController } from '../components/HelpGuide'
-
-
-interface Props {
-  navigation: any;
-  route: any;
-}
-
-const HelpGuide = (props: Props) => {
-  const helpGuideProps = {
-    ...props
-  }
-
-  return (
-    <Container>
-      <HelpGuideController {...helpGuideProps} />
-    </Container>
-  )
-}
-
-export default HelpGuide

package/src/pages/HelpOrder.tsx

@@ -1,23 +0,0 @@
-import React from 'react'
-import { Container } from '../layouts/Container'
-import { HelpOrder as HelpOrderController } from '../components/HelpOrder'
-
-
-interface Props {
-  navigation: any;
-  route: any;
-}
-
-const HelpOrder = (props: Props) => {
-  const helpOrderProps = {
-    ...props
-  }
-
-  return (
-    <Container>
-      <HelpOrderController {...helpOrderProps} />
-    </Container>
-  )
-}
-
-export default HelpOrder

package/src/pages/Home.tsx

@@ -1,36 +0,0 @@
-import React from 'react';
-import { StyleSheet, SafeAreaView } from 'react-native';
-import { Home as HomePage } from '../components/Home';
-import { useTheme } from 'styled-components/native';
-
-export const Home = (props: any) => {
-  const theme = useTheme();
-
-  const homeProps = {
-    ...props,
-    onNavigationRedirect: (page: string, params: any) => {
-      if (!page) return
-      props.navigation.navigate(page, params);
-    },
-  }
-
-  const styles = StyleSheet.create({
-    wrapper: {
-      flex: 1,
-      display: 'flex',
-      flexDirection: 'column',
-      justifyContent: 'center',
-      alignItems: 'center',
-      height: '100%',
-      backgroundColor: theme.colors.backgroundPage,
-    }
-  })
-
-  return (
-    <SafeAreaView style={styles.wrapper}>
-      <HomePage {...homeProps} />
-    </SafeAreaView>
-  );
-};
-
-export default Home;

package/src/pages/IntroductoryTutorial.tsx

@@ -1,170 +0,0 @@
-import React from 'react';
-import {View, Text, Image, StyleSheet, StatusBar} from 'react-native';
-import AppIntroSlider from 'react-native-app-intro-slider';
-import { _setStoreData } from '../providers/StoreUtil';
-import { useTheme } from 'styled-components/native';
-import { useLanguage } from 'ordering-components/native';
-
-
-const IntroductoryTutorial = ({ navigation, route }: any)  => {
-  const [, t] = useLanguage();
-  const theme = useTheme()
-  const setTutorial = route?.params?.setTutorial
-  const data = [
-    {
-      title: t('DELIVERY_BY_ADDRESS', 'Delivery by Address'),
-      text: t('DELIVERY_BY_ADDRESS_INST', 'DELIVERY_BY_ADDRESS_INST'),
-      image: theme.images.tutorials.slide1,
-      bg: theme.colors.primaryContrast
-    },
-    {
-      title: t('SELECT_A_BUSINESS', 'SELECT_A_BUSINESS'),
-      text: t('SELECT_A_BUSINESS_INST', 'SELECT_A_BUSINESS_INST'),
-      image: theme.images.tutorials.slide2,
-      bg: theme.colors.primaryContrast
-    },
-    {
-      title: t('BUSINESS_MENU', 'BUSINESS_MENU'),
-      text: t('BUSINESS_MENU_INST', 'BUSINESS_MENU_INST'),
-      image: theme.images.tutorials.slide3,
-      bg: theme.colors.primaryContrast
-    },
-    {
-      title: t('PRODUCT_LIST', 'PRODUCT_LIST'),
-      text: t('PRODUCT_LIST_INST', 'PRODUCT_LIST_INST'),
-      image: theme.images.tutorials.slide4,
-      bg: theme.colors.primaryContrast
-    },
-    {
-      title: t('CHECKOUT_SCREEN', 'CHECKOUT_SCREEN'),
-      text: t('CHECKOUT_SCREEN_INST', 'CHECKOUT_SCREEN_INST'),
-      image: theme.images.tutorials.slide5,
-      bg: theme.colors.primaryContrast
-    },
-    {
-      title: t('TUTORIAL_ORDER_COMPLETED', 'TUTORIAL_ORDER_COMPLETED'),
-      text: t('TUTORIAL_ORDER_COMPLETED_INST', 'TUTORIAL_ORDER_COMPLETED_INST'),
-      image: theme.images.tutorials.slide6,
-      bg: theme.colors.primaryContrast
-    },
-  ];
-  type Item = typeof data[0];
-  const styles = StyleSheet.create({
-    slide: {
-    flex: 1,
-    alignItems: 'center',
-    justifyContent: 'center',
-    paddingBottom: 80,
-    },
-    image: {
-      flex: 0,
-      top: 30,
-      width: '100%',
-      height: '75%',
-      resizeMode: 'contain',
-    },
-    text: {
-      color: theme.colors.colorTextTutorial,
-      textAlign: 'center',
-      fontSize: 17,
-      paddingRight: '2%',
-      paddingLeft: '2%',
-      top: '4%',
-    },
-    title: {
-      top: '2%',
-      fontSize: 25,
-      color: theme.colors.colorTextTutorial,
-      textAlign: 'center',
-    },
-    buttonCircle: {
-      top: '15%',
-      width: 50,
-      height: 40,
-      justifyContent: 'center',
-      alignItems: 'center',
-      position:'relative'
-    },
-    tutorialText: {
-      fontSize: 18,
-      fontWeight: '300',
-      color: theme.colors.primary
-    }
-  });
-  
-  const _renderItem = ({item}: {item: Item}) => {
-    return (
-      <View
-        style={[
-          styles.slide,
-          { 
-            backgroundColor: item.bg,
-          },
-        ]}>
-        <Text style={styles.title}>{item.title}</Text>
-        <Text style={styles.text}>{item.text}</Text>
-        <Image source={item.image} style={styles.image} />
-      </View>
-    );
-  };
-
-  const RenderNextButton = () => {
-    return (
-      <View style={styles.buttonCircle}>
-        <Text style={styles.tutorialText}>{t('TUTORIAL_NEXT', 'Next')}</Text>
-      </View>
-    );
-  };
-
-  const RenderSkipButton = () => {
-    return (
-      <View style={styles.buttonCircle}>
-        <Text style={styles.tutorialText}>{t('TUTORIAL_SKIP', 'Skip')}</Text>
-      </View>
-    );
-  };
-
-  const RenderPrevButton = () => {
-    return (
-      <View style={styles.buttonCircle}>
-        <Text style={styles.tutorialText}>{t('TUTORIAL_BACK', 'Back')}</Text>
-      </View>
-    );
-  };
-
-  const RenderDoneButton = () => {
-    return (
-      <View style={styles.buttonCircle}>
-        <Text style={styles.tutorialText}>{t('TUTORIAL_DONE', 'Done')}</Text>
-      </View>
-    );
-  }
-
-  const _onDone = () => {
-    setTutorial(false)
-    _setStoreData('isTutorial', false)
-  }
-
-  const _keyExtractor = (item: Item) => item.title;
-
-    return (
-      <View style={{flex: 1}}>
-        <StatusBar translucent backgroundColor="transparent" />
-        <AppIntroSlider
-          keyExtractor={_keyExtractor}
-          renderItem={_renderItem}
-          data={data}
-          onDone={_onDone}
-          activeDotStyle= {{backgroundColor: theme.colors.primary}}
-          renderDoneButton={RenderDoneButton}
-          renderNextButton={RenderNextButton}
-          renderSkipButton={RenderSkipButton}
-          renderPrevButton={RenderPrevButton}
-          showSkipButton
-          showPrevButton
-        />
-      </View>
-    );
-  
-}
-export default IntroductoryTutorial;

package/src/pages/Login.tsx

@@ -1,47 +0,0 @@
-import React from 'react';
-import { Platform } from 'react-native';
-import styled from 'styled-components/native';
-import { LoginForm } from '../components/LoginForm';
-import { Container } from '../layouts/Container';
-
-import { useLanguage } from 'ordering-components/native';
-import { _setStoreData } from '../providers/StoreUtil';
-import { useTheme } from 'styled-components/native';
-
-const KeyboardView = styled.KeyboardAvoidingView`
-  flex: 1;
-`;
-
-export const Login = ({ navigation, route }: any) => {
-  const [, t] = useLanguage()
-  const theme = useTheme()
-
-  const loginProps = {
-    navigation,
-    useLoginByCellphone: true,
-    loginButtonText: t('LOGIN', 'Login'),
-    loginButtonBackground: theme.colors.primary,
-    forgotButtonText: t('FORGOT_YOUR_PASSWORD', 'Forgot your password?'),
-    registerButtonText: t('SIGNUP', 'Signup'),
-    onNavigationRedirect: (page: string) => {
-      if (!page) return
-      navigation.navigate(page);
-    },
-    notificationState: route?.params?.notification_state
-  }
-
-  _setStoreData('notification_state', route?.params?.notification_state);
-
-  return (
-    <KeyboardView
-      enabled
-      behavior={Platform.OS === 'ios' ? 'padding' : 'height'}
-    >
-      <Container>
-        <LoginForm {...loginProps} />
-      </Container>
-    </KeyboardView>
-  );
-};
-
-export default Login;

package/src/pages/MomentOption.tsx

@@ -1,30 +0,0 @@
-import React from 'react'
-import { useConfig } from 'ordering-components/native'
-import { MomentOption as MomentOptionController } from '../components/MomentOption'
-
-const MomentOption = ({ navigation, props }: any) => {
-  const [{ configs }] = useConfig()
-  const limitDays = configs?.max_days_preorder?.value
-  const currentDate = new Date()
-  const time = limitDays > 1
-  ? currentDate.getTime() + ((limitDays - 1) * 24 * 60 * 60 * 1000)
-  : limitDays === 1 ? currentDate.getTime() : currentDate.getTime() + (6 * 24 * 60 * 60 * 1000)
-
-  currentDate.setTime(time)
-  currentDate.setHours(23)
-  currentDate.setMinutes(59)
-  const momentOptionProps = {
-    ...props,
-    navigation: navigation,
-    maxDate: currentDate
-  }
-  return (
-    <>
-      {currentDate && (
-        <MomentOptionController {...momentOptionProps} />
-      )}
-    </>
-  )
-}
-
-export default MomentOption

package/src/pages/MultiCheckout.tsx

@@ -1,31 +0,0 @@
-import React from 'react'
-import { Platform, KeyboardAvoidingView, StyleSheet } from 'react-native'
-import { MultiCheckout as MultiCheckoutController } from '../../themes/original/src/components/MultiCheckout'
-
-const MultiCheckout = (props: any) => {
-  const multiCheckoutProps = {
-    ...props,
-    onPlaceOrderClick: (orderUuids: any) => {
-      props.navigation.navigate('MultiOrdersDetails', { orderUuids: orderUuids, isFromMultiCheckout: true })
-    }
-  }
-
-  return (
-    <KeyboardAvoidingView
-      enabled
-      behavior={Platform.OS === 'ios' ? 'padding' : 'height'}
-      style={styles.container}
-    >
-      <MultiCheckoutController {...multiCheckoutProps} />
-    </KeyboardAvoidingView>
-  )
-}
-
-const styles = StyleSheet.create({
-  container: {
-    flexGrow: 1,
-    paddingBottom: 70,
-  },
-});
-
-export default MultiCheckout

package/src/pages/MultiOrdersDetails.tsx

@@ -1,27 +0,0 @@
-import React from 'react'
-import { Platform } from 'react-native'
-import { MultiOrdersDetails as MultiOrdersDetailsController } from '../../themes/original/src/components/MultiOrdersDetails'
-import styled from 'styled-components/native';
-
-const SafeAreaContainer = styled.SafeAreaView`
-  flex: 1;
-  background-color: ${(props: any) => props.theme.colors.backgroundPage};
-  padding-top: ${Platform.OS === 'ios' ? '0px' : '24px'};
-`;
-
-const MultiOrdersDetails = ({ navigation, route }: any) => {
-  const multiOrdersDetailsProps = {
-    navigation,
-    orderUuids: route.params?.orderUuids || [],
-    isFromMultiCheckout: route.params?.isFromMultiCheckout,
-    onRedirectPage: () => navigation.navigate('BusinessList')
-  }
-
-  return (
-    <SafeAreaContainer>
-      <MultiOrdersDetailsController {...multiOrdersDetailsProps} />
-    </SafeAreaContainer>
-  )
-}
-
-export default MultiOrdersDetails

package/src/pages/MyOrders.tsx

@@ -1,40 +0,0 @@
-import React, {useState} from 'react'
-import { useLanguage } from 'ordering-components/native'
-import { OrdersOption } from '../components/OrdersOption'
-import { OText } from '../components/shared'
-import { Container } from '../layouts/Container'
-
-const MyOrders = ({ navigation }: any) => {
-
-  const [, t] = useLanguage()
-  const [ordersLength,setOrdersLength] = useState({activeOrdersLength: 0, previousOrdersLength: 0})
-  const myOrderProps = {
-    navigation,
-    onNavigationRedirect: (page: string, params: any) => {
-      if (!page) return
-      navigation.navigate(page, params);
-    }
-  }
-
-
-  return (
-    <Container>
-      <OText size={24} mBottom={20}>
-        {t('MY_ORDERS', 'My Orders')}
-      </OText>
-      <OrdersOption
-        {...myOrderProps}
-        activeOrders
-        ordersLength={ordersLength}
-        setOrdersLength={setOrdersLength}
-      />
-      <OrdersOption
-        {...myOrderProps}
-        ordersLength={ordersLength}
-        setOrdersLength={setOrdersLength}
-      />
-    </Container>
-  )
-}
-
-export default MyOrders;

package/src/pages/NetworkError.tsx

@@ -1,24 +0,0 @@
-import React from 'react';
-import {
-  NotFoundSource,
-} from '../components/NotFoundSource';
-import { useTheme } from 'styled-components/native';
-import { useLanguage } from 'ordering-components/native';
-import { SafeAreaContainer } from '../layouts/SafeAreaContainer'
-
-const NetworkError = () => {
-  const theme = useTheme();
-  const [, t] = useLanguage();
-
-  return (
-    <SafeAreaContainer style={{ backgroundColor: theme.colors.white }}>
-      <NotFoundSource
-        content={t('NETWORK_ERROR', 'Network Error')}
-        image={theme.images.general.notFound}
-        conditioned={false}
-      />
-    </SafeAreaContainer>
-  );
-};
-
-export default NetworkError;

package/src/pages/NotFound.tsx

@@ -1,22 +0,0 @@
-import React from 'react'
-import { NotFoundSource } from '../components/NotFoundSource'
-import { Container } from '../layouts/Container'
-import {useSession, useLanguage} from 'ordering-components/native'
-
-const NotFound = ({navigation} : any) => {
-  const [{auth}] = useSession()
-  const [ ,t] = useLanguage()
-
-  const btnTitle = !auth ? t('GO_TO_HOMEPAGE', 'Go to homepage') : t('GO_TO_BUSINESSLIST', 'Go to business list')
-
-  const handleNavigate = () => {
-    auth ? navigation.navigate('BusinessList') : navigation.navigate('Home')
-  }
-  return (
-    <Container>
-      <NotFoundSource btnTitle={btnTitle} content={t('PAGE_NOT_FOUND' , 'Page not found')} onClickButton={handleNavigate}/>
-    </Container>
-  )
-}
-
-export default NotFound

package/src/pages/OrderDetails.tsx

@@ -1,25 +0,0 @@
-import React from 'react'
-import { OrderDetails as OrderDetailsController } from '../components/OrderDetails'
-import { SafeAreaContainer } from '../layouts/SafeAreaContainer'
-
-const OrderDetails = ({ navigation, route }: any) => {
-  const orderDetailsProps = {
-    navigation,
-    orderId: route.params?.orderId,
-    isFromCheckout: route.params?.isFromCheckout,
-    isFromRoot: route.params?.isFromRoot,
-    goToBusinessList: route?.params?.goToBusinessList,
-    onNavigationRedirect: (page: string, params: any) => {
-      if (!page) return
-      navigation.navigate(page, params);
-    }
-  }
-
-  return (
-    <SafeAreaContainer>
-      <OrderDetailsController {...orderDetailsProps} />
-    </SafeAreaContainer>
-  )
-}
-
-export default OrderDetails;

package/src/pages/ProductDetails.tsx

@@ -1,55 +0,0 @@
-import * as React from 'react';
-import styled, { useTheme } from 'styled-components/native';
-import { Platform } from 'react-native';
-import { ProductForm as ProductFormController } from '../components/ProductForm';
-interface Props {
-  navigation: any;
-  route: any;
-}
-
-const ProductDetails = (props: Props) => {
-  const theme = useTheme()
-
-  const productProps = {
-    ...props,
-    isCartProduct: props.route.params?.isCartProduct,
-    isFromCheckout: props.route.params?.isFromCheckout,
-    productCart: props.route.params?.productCart,
-    product: props.route.params?.product,
-    businessSlug: props.route.params?.businessSlug,
-    businessId: props.route.params?.businessId,
-    categoryId: props.route.params?.categoryId,
-    productId: props.route.params?.productId,
-    onSave: props?.navigation?.canGoBack()
-      ? () => { props.route.params?.onAction && props.route.params?.onAction(); props?.navigation?.goBack(); }
-      : () => { props.route.params?.onAction && props.route.params?.onAction(); props?.navigation?.navigate('BottomTab') }
-    ,
-    handleGoBack: props?.navigation?.canGoBack()
-      ? () => {
-        props.route.params?.onAction &&
-        props.route.params?.onAction();
-        props?.navigation?.goBack();
-      }
-      : (businessSlug: any) => {
-        props.route.params?.onAction &&
-        props.route.params?.onAction();
-        businessSlug
-          ? props?.navigation.navigate('Business', { store: businessSlug })
-          : props?.navigation.navigate('BottomTab')
-      }
-  };
-
-  const BusinessProductsListView = styled.SafeAreaView`
-    flex: 1;
-    background-color: ${theme.colors.backgroundPage};
-    padding-top: ${Platform.OS === 'ios' ? '0px' : '20px'};
-  `;
-
-  return (
-    <BusinessProductsListView>
-      <ProductFormController {...productProps} />
-    </BusinessProductsListView>
-  );
-};
-
-export default ProductDetails;

package/src/pages/Profile.tsx

@@ -1,36 +0,0 @@
-import * as React from 'react';
-import styled from 'styled-components/native';
-import { Platform } from 'react-native';
-import { UserProfileForm as ProfileController } from '../components/UserProfileForm';
-import { SafeAreaContainer } from '../layouts/SafeAreaContainer'
-
-const KeyboardView = styled.KeyboardAvoidingView`
-  flex-grow: 1;
-`;
-interface Props {
-  navigation: any;
-  route: any;
-}
-
-const Profile = (props: Props) => {
-  const profileProps = {
-    ...props,
-    goToBack: () => props.navigation?.canGoBack() && props.navigation.goBack(),
-    onNavigationRedirect: (route: string, params: any) => props.navigation.navigate(route, params)
-  }
-
-  return (
-    <>
-      <KeyboardView
-        enabled
-        behavior={Platform.OS === 'ios' ? 'padding' : 'height'}
-      >
-        <SafeAreaContainer>
-          <ProfileController {...profileProps} />
-        </SafeAreaContainer>
-      </KeyboardView>
-    </>
-  );
-};
-
-export default Profile;

package/src/pages/ReviewDriver.tsx

@@ -1,30 +0,0 @@
-import React from 'react'
-import { Platform } from 'react-native';
-import styled from 'styled-components/native';
-import { ReviewDriver as ReviewDriverController } from '../components/ReviewDriver'
-import { SafeAreaContainer } from '../layouts/SafeAreaContainer';
-
-const KeyboardView = styled.KeyboardAvoidingView`
-  flex: 1;
-`;
-
-const ReviewDriver = ({ navigation, route }: any) => {
-  const reviewDriverProps = {
-    navigation,
-    order: route?.params?.order,
-    onNavigationRedirect: (route: string, params: any) => navigation.navigate(route, params)
-  }
-
-  return (
-    <KeyboardView
-      enabled
-      behavior={Platform.OS === 'ios' ? 'padding' : 'height'}
-    >
-      <SafeAreaContainer>
-        <ReviewDriverController {...reviewDriverProps} />
-      </SafeAreaContainer>
-    </KeyboardView>
-  )
-}
-
-export default ReviewDriver