ordering-ui-react-native 0.24.16 → 0.24.18

package/themes/uber-eats/index.tsx

@@ -1,127 +1,127 @@
-import { Account } from './src/components/Account'
-import { ActiveOrders } from './src/components/ActiveOrders'
-import { AddressDetails } from './src/components/AddressDetails'
-import { AddressForm } from './src/components/AddressForm'
-import { AddressList } from './src/components/AddressList'
-import { BusinessBasicInformation } from './src/components/BusinessBasicInformation'
-import { BusinessController } from './src/components/BusinessController'
-import { BusinessesListing } from './src/components/BusinessesListing'
-import { BusinessItemAccordion } from './src/components/BusinessItemAccordion'
-import { BusinessProductsList } from './src/components/BusinessProductsList'
-import { BusinessProductsListing } from './src/components/BusinessProductsListing'
-import { BusinessTypeFilter } from './src/components/BusinessTypeFilter'
-import { Cart } from './src/components/Cart'
-import { CartContent } from './src/components/CartContent'
-import { Checkout } from './src/components/Checkout'
-import { CouponControl } from './src/components/CouponControl'
-import { DriverTips } from './src/components/DriverTips'
-import { FacebookLogin } from './src/components/FacebookLogin'
-import { FloatingButton } from './src/components/FloatingButton'
-import { Help } from './src/components/Help'
-import { HelpAccountAndPayment } from './src/components/HelpAccountAndPayment'
-import { HelpGuide } from './src/components/HelpGuide'
-import { HelpOrder } from './src/components/HelpOrder'
-import { Home } from './src/components/Home'
-import { LanguageSelector } from './src/components/LanguageSelector'
-import { LastOrders } from './src/components/LastOrders'
-import { LoginForm } from './src/components/LoginForm'
-import { MomentOption } from './src/components/MomentOption'
-import { OrderDetails } from './src/components/OrderDetails'
-import { OrdersOption } from './src/components/OrdersOption'
-import { OrderSummary } from './src/components/OrderSummary'
-import { OrderTypeSelector } from './src/components/OrderTypeSelector'
-import { PaymentOptionCash } from './src/components/PaymentOptionCash'
-import { PaymentOptions } from './src/components/PaymentOptions'
-import { PhoneInputNumber } from './src/components/PhoneInputNumber'
-import { PreviousOrders } from './src/components/PreviousOrders'
-import { ProductForm } from './src/components/ProductForm'
-import { ProductIngredient } from './src/components/ProductIngredient'
-import { ProductItemAccordion } from './src/components/ProductItemAccordion'
-import { ProductOption } from './src/components/ProductOption'
-import { ProductOptionSubOption } from './src/components/ProductOptionSubOption'
-import { SearchBar } from './src/components/SearchBar'
-import { SignupForm } from './src/components/SignupForm'
-import { SingleProductCard } from './src/components/SingleProductCard'
-import { UpsellingProducts } from './src/components/UpsellingProducts'
-import { UserDetails } from './src/components/UserDetails'
-import { UserFormDetailsUI } from './src/components/UserFormDetails'
-import { UserProfileForm } from './src/components/UserProfileForm'
-
-// shared components
-import {
-  OText,
-  OButton,
-  OInput,
-  OIcon,
-  OIconButton,
-  OAlert,
-  OBottomPopup
-} from './src/components/shared'
-
-// layouts
-import { Container } from './src/layouts/Container'
-import { SafeAreaContainer } from './src/layouts/SafeAreaContainer'
-
-export {
-  Account,
-  ActiveOrders,
-  AddressDetails,
-  AddressForm,
-  AddressList,
-  BusinessBasicInformation,
-  BusinessController,
-  BusinessesListing,
-  BusinessItemAccordion,
-  BusinessProductsList,
-  BusinessProductsListing,
-  BusinessTypeFilter,
-  Cart,
-  CartContent,
-  Checkout,
-  CouponControl,
-  DriverTips,
-  FacebookLogin,
-  FloatingButton,
-  Help,
-  HelpAccountAndPayment,
-  HelpGuide,
-  HelpOrder,
-  Home,
-  LanguageSelector,
-  LastOrders,
-  LoginForm,
-  MomentOption,
-  OrderDetails,
-  OrdersOption,
-  OrderSummary,
-  OrderTypeSelector,
-  PaymentOptionCash,
-  PaymentOptions,
-  PhoneInputNumber,
-  PreviousOrders,
-  ProductForm,
-  ProductIngredient,
-  ProductItemAccordion,
-  ProductOption,
-  ProductOptionSubOption,
-  SearchBar,
-  SignupForm,
-  SingleProductCard,
-  UpsellingProducts,
-  UserDetails,
-  UserFormDetailsUI,
-  UserProfileForm,
-
-  // shared components
-  OText,
-  OButton,
-  OInput,
-  OIcon,
-  OIconButton,
-  OAlert,
-  OBottomPopup,
-
-  // layouts
-  Container,
-  SafeAreaContainer
-}
+import { Account } from './src/components/Account'
+import { ActiveOrders } from './src/components/ActiveOrders'
+import { AddressDetails } from './src/components/AddressDetails'
+import { AddressForm } from './src/components/AddressForm'
+import { AddressList } from './src/components/AddressList'
+import { BusinessBasicInformation } from './src/components/BusinessBasicInformation'
+import { BusinessController } from './src/components/BusinessController'
+import { BusinessesListing } from './src/components/BusinessesListing'
+import { BusinessItemAccordion } from './src/components/BusinessItemAccordion'
+import { BusinessProductsList } from './src/components/BusinessProductsList'
+import { BusinessProductsListing } from './src/components/BusinessProductsListing'
+import { BusinessTypeFilter } from './src/components/BusinessTypeFilter'
+import { Cart } from './src/components/Cart'
+import { CartContent } from './src/components/CartContent'
+import { Checkout } from './src/components/Checkout'
+import { CouponControl } from './src/components/CouponControl'
+import { DriverTips } from './src/components/DriverTips'
+import { FacebookLogin } from './src/components/FacebookLogin'
+import { FloatingButton } from './src/components/FloatingButton'
+import { Help } from './src/components/Help'
+import { HelpAccountAndPayment } from './src/components/HelpAccountAndPayment'
+import { HelpGuide } from './src/components/HelpGuide'
+import { HelpOrder } from './src/components/HelpOrder'
+import { Home } from './src/components/Home'
+import { LanguageSelector } from './src/components/LanguageSelector'
+import { LastOrders } from './src/components/LastOrders'
+import { LoginForm } from './src/components/LoginForm'
+import { MomentOption } from './src/components/MomentOption'
+import { OrderDetails } from './src/components/OrderDetails'
+import { OrdersOption } from './src/components/OrdersOption'
+import { OrderSummary } from './src/components/OrderSummary'
+import { OrderTypeSelector } from './src/components/OrderTypeSelector'
+import { PaymentOptionCash } from './src/components/PaymentOptionCash'
+import { PaymentOptions } from './src/components/PaymentOptions'
+import { PhoneInputNumber } from './src/components/PhoneInputNumber'
+import { PreviousOrders } from './src/components/PreviousOrders'
+import { ProductForm } from './src/components/ProductForm'
+import { ProductIngredient } from './src/components/ProductIngredient'
+import { ProductItemAccordion } from './src/components/ProductItemAccordion'
+import { ProductOption } from './src/components/ProductOption'
+import { ProductOptionSubOption } from './src/components/ProductOptionSubOption'
+import { SearchBar } from './src/components/SearchBar'
+import { SignupForm } from './src/components/SignupForm'
+import { SingleProductCard } from './src/components/SingleProductCard'
+import { UpsellingProducts } from './src/components/UpsellingProducts'
+import { UserDetails } from './src/components/UserDetails'
+import { UserFormDetailsUI } from './src/components/UserFormDetails'
+import { UserProfileForm } from './src/components/UserProfileForm'
+
+// shared components
+import {
+  OText,
+  OButton,
+  OInput,
+  OIcon,
+  OIconButton,
+  OAlert,
+  OBottomPopup
+} from './src/components/shared'
+
+// layouts
+import { Container } from './src/layouts/Container'
+import { SafeAreaContainer } from './src/layouts/SafeAreaContainer'
+
+export {
+  Account,
+  ActiveOrders,
+  AddressDetails,
+  AddressForm,
+  AddressList,
+  BusinessBasicInformation,
+  BusinessController,
+  BusinessesListing,
+  BusinessItemAccordion,
+  BusinessProductsList,
+  BusinessProductsListing,
+  BusinessTypeFilter,
+  Cart,
+  CartContent,
+  Checkout,
+  CouponControl,
+  DriverTips,
+  FacebookLogin,
+  FloatingButton,
+  Help,
+  HelpAccountAndPayment,
+  HelpGuide,
+  HelpOrder,
+  Home,
+  LanguageSelector,
+  LastOrders,
+  LoginForm,
+  MomentOption,
+  OrderDetails,
+  OrdersOption,
+  OrderSummary,
+  OrderTypeSelector,
+  PaymentOptionCash,
+  PaymentOptions,
+  PhoneInputNumber,
+  PreviousOrders,
+  ProductForm,
+  ProductIngredient,
+  ProductItemAccordion,
+  ProductOption,
+  ProductOptionSubOption,
+  SearchBar,
+  SignupForm,
+  SingleProductCard,
+  UpsellingProducts,
+  UserDetails,
+  UserFormDetailsUI,
+  UserProfileForm,
+
+  // shared components
+  OText,
+  OButton,
+  OInput,
+  OIcon,
+  OIconButton,
+  OAlert,
+  OBottomPopup,
+
+  // layouts
+  Container,
+  SafeAreaContainer
+}

package/themes/uber-eats/src/components/Account/index.tsx

@@ -1,201 +1,201 @@
-import React, { useState, useEffect } from 'react'
-import {
-  UserFormDetails as UserProfileController,
-  useLanguage,
-  useSession,
-  ToastType,
-  useToast
-} from 'ordering-components/native'
-import Spinner from 'react-native-loading-spinner-overlay'
-import { launchImageLibrary } from 'react-native-image-picker'
-import { StyleSheet, View } from 'react-native'
-import { AccountParams } from '../../types'
-import NavBar from '../NavBar'
-import {
-  OIcon,
-  OIconButton,
-  OText,
-  OButton,
-} from '../shared'
-import { useTheme } from 'styled-components/native'
-import { UserFormDetailsUI } from '../UserFormDetails'
-
-import {
-  CenterView,
-  UserData,
-  Names,
-  EditButton
-} from './styles'
-
-const AccountUI = (props: AccountParams) => {
-  const {
-    navigation,
-    isEdit,
-    formState,
-    validationFields,
-    toggleIsEdit,
-    cleanFormState,
-    handleButtonUpdateClick
-  } = props
-
-  const [, t] = useLanguage()
-  const theme = useTheme()
-  const [{ user }] = useSession()
-  const [, { showToast }] = useToast()
-
-  const [phoneInputData, setPhoneInputData] = useState({
-    error: '',
-    phone: {
-      country_phone_code: null,
-      cellphone: null
-    }
-  })
-  const [phoneUpdate, setPhoneUpdate] = useState(false)
-
-  const styles = StyleSheet.create({
-    editButton: {
-      borderRadius: 25,
-      borderColor: theme.colors.primary,
-      backgroundColor: theme.colors.white,
-      borderWidth: 1,
-      color: theme.colors.primary,
-      marginVertical: 8,
-    },
-  });
-
-  const goToBack = () => navigation?.canGoBack() && navigation.goBack()
-
-  const handleImagePicker = () => {
-    launchImageLibrary({ mediaType: 'photo', maxHeight: 200, maxWidth: 200, includeBase64: true }, (response: any) => {
-      if (response.didCancel) {
-        console.log('User cancelled image picker');
-      } else if (response.errorMessage) {
-        console.log('ImagePicker Error: ', response.errorMessage);
-        showToast(ToastType.Error, response.errorMessage);
-      } else {
-        if (response?.assets?.[0]?.uri) {
-          const image = response?.assets?.[0]
-          const url = `data:${image?.type};base64,${image?.base64}`;
-          handleButtonUpdateClick(null, true, url);
-        } else {
-          showToast(ToastType.Error, t('IMAGE_NOT_FOUND', 'Image not found'));
-        }
-      }
-    });
-  }
-
-  const handleCancelEdit = () => {
-    cleanFormState({ changes: {} });
-    toggleIsEdit();
-    setPhoneInputData({
-      error: '',
-      phone: {
-        country_phone_code: null,
-        cellphone: null
-      }
-    })
-  }
-
-  useEffect(() => {
-    if (formState.result.result && !formState.loading) {
-      if (formState.result?.error) {
-        showToast(ToastType.Error, formState.result.result);
-      } else {
-        showToast(ToastType.Success, t('UPDATE_SUCCESSFULLY', 'Update successfully'));
-      }
-    }
-  }, [formState.result])
-
-  useEffect(() => {
-    if (user?.cellphone && !user?.country_phone_code) {
-      setPhoneUpdate(true)
-    } else {
-      setPhoneUpdate(false)
-    }
-  }, [user?.country_phone_code])
-
-  return (
-    <>
-      <NavBar
-        title={t('ACCOUNT', 'Account')}
-        titleAlign={'center'}
-        onActionLeft={goToBack}
-        showCall={false}
-        paddingTop={10}
-        btnStyle={{ paddingLeft: 0 }}
-      />
-      <CenterView>
-        <OIcon
-          url={user?.photo}
-          src={!user?.photo && theme.images.general.user}
-          cover
-          width={100}
-          height={100}
-          style={{ borderRadius: 8 }}
-        />
-        <OIconButton
-          icon={theme.images.general.camera}
-          borderColor={theme.colors.clear}
-          iconStyle={{ width: 30, height: 30 }}
-          style={{ maxWidth: 40 }}
-          onClick={() => handleImagePicker()}
-        />
-      </CenterView>
-      <Spinner visible={formState?.loading} />
-      {!isEdit ? (
-        <UserData>
-          <Names>
-            <OText space>{user?.name}</OText>
-            <OText>{user?.lastname}</OText>
-          </Names>
-          {(!!user?.middle_name || !!user?.second_lastname) && (
-            <Names>
-              <OText space>{user?.middle_name}</OText>
-              <OText>{user?.second_lastname}</OText>
-            </Names>
-          )}
-          <OText>{user?.email}</OText>
-          {!!user?.cellphone && <OText>{user?.cellphone}</OText>}
-          {!!phoneUpdate && (
-            <OText
-              color={theme.colors.error}
-            >
-              {t('NECESSARY_UPDATE_COUNTRY_PHONE_CODE', 'It is necessary to update your phone number')}
-            </OText>
-          )}
-        </UserData>
-      ) : (
-        <View style={{ justifyContent: 'center', alignItems: 'center', paddingBottom: 30 }}>
-          <UserFormDetailsUI
-            {...props}
-            hideUpdateButton
-            handleCancelEdit={handleCancelEdit}
-            toggleIsEdit={toggleIsEdit}
-          />
-        </View>
-      )}
-      {!validationFields.loading && !isEdit && (
-        <EditButton>
-          <OButton
-            text={t('EDIT', 'Edit')}
-            bgColor={theme.colors.white}
-            borderColor={theme.colors.primary}
-            isDisabled={formState.loading}
-            imgRightSrc={null}
-            textStyle={{ fontSize: 20 }}
-            style={{ ...styles.editButton }}
-            onClick={toggleIsEdit}
-          />
-        </EditButton>
-      )}
-    </>
-  )
-}
-
-export const Account = (props: any) => {
-  const accoutProps = {
-    ...props,
-    UIComponent: AccountUI
-  }
-  return <UserProfileController {...accoutProps} />
-}
+import React, { useState, useEffect } from 'react'
+import {
+  UserFormDetails as UserProfileController,
+  useLanguage,
+  useSession,
+  ToastType,
+  useToast
+} from 'ordering-components/native'
+import Spinner from 'react-native-loading-spinner-overlay'
+import { launchImageLibrary } from 'react-native-image-picker'
+import { StyleSheet, View } from 'react-native'
+import { AccountParams } from '../../types'
+import NavBar from '../NavBar'
+import {
+  OIcon,
+  OIconButton,
+  OText,
+  OButton,
+} from '../shared'
+import { useTheme } from 'styled-components/native'
+import { UserFormDetailsUI } from '../UserFormDetails'
+
+import {
+  CenterView,
+  UserData,
+  Names,
+  EditButton
+} from './styles'
+
+const AccountUI = (props: AccountParams) => {
+  const {
+    navigation,
+    isEdit,
+    formState,
+    validationFields,
+    toggleIsEdit,
+    cleanFormState,
+    handleButtonUpdateClick
+  } = props
+
+  const [, t] = useLanguage()
+  const theme = useTheme()
+  const [{ user }] = useSession()
+  const [, { showToast }] = useToast()
+
+  const [phoneInputData, setPhoneInputData] = useState({
+    error: '',
+    phone: {
+      country_phone_code: null,
+      cellphone: null
+    }
+  })
+  const [phoneUpdate, setPhoneUpdate] = useState(false)
+
+  const styles = StyleSheet.create({
+    editButton: {
+      borderRadius: 25,
+      borderColor: theme.colors.primary,
+      backgroundColor: theme.colors.white,
+      borderWidth: 1,
+      color: theme.colors.primary,
+      marginVertical: 8,
+    },
+  });
+
+  const goToBack = () => navigation?.canGoBack() && navigation.goBack()
+
+  const handleImagePicker = () => {
+    launchImageLibrary({ mediaType: 'photo', maxHeight: 200, maxWidth: 200, includeBase64: true }, (response: any) => {
+      if (response.didCancel) {
+        console.log('User cancelled image picker');
+      } else if (response.errorMessage) {
+        console.log('ImagePicker Error: ', response.errorMessage);
+        showToast(ToastType.Error, response.errorMessage);
+      } else {
+        if (response?.assets?.[0]?.uri) {
+          const image = response?.assets?.[0]
+          const url = `data:${image?.type};base64,${image?.base64}`;
+          handleButtonUpdateClick(null, true, url);
+        } else {
+          showToast(ToastType.Error, t('IMAGE_NOT_FOUND', 'Image not found'));
+        }
+      }
+    });
+  }
+
+  const handleCancelEdit = () => {
+    cleanFormState({ changes: {} });
+    toggleIsEdit();
+    setPhoneInputData({
+      error: '',
+      phone: {
+        country_phone_code: null,
+        cellphone: null
+      }
+    })
+  }
+
+  useEffect(() => {
+    if (formState.result.result && !formState.loading) {
+      if (formState.result?.error) {
+        showToast(ToastType.Error, formState.result.result);
+      } else {
+        showToast(ToastType.Success, t('UPDATE_SUCCESSFULLY', 'Update successfully'));
+      }
+    }
+  }, [formState.result])
+
+  useEffect(() => {
+    if (user?.cellphone && !user?.country_phone_code) {
+      setPhoneUpdate(true)
+    } else {
+      setPhoneUpdate(false)
+    }
+  }, [user?.country_phone_code])
+
+  return (
+    <>
+      <NavBar
+        title={t('ACCOUNT', 'Account')}
+        titleAlign={'center'}
+        onActionLeft={goToBack}
+        showCall={false}
+        paddingTop={10}
+        btnStyle={{ paddingLeft: 0 }}
+      />
+      <CenterView>
+        <OIcon
+          url={user?.photo}
+          src={!user?.photo && theme.images.general.user}
+          cover
+          width={100}
+          height={100}
+          style={{ borderRadius: 8 }}
+        />
+        <OIconButton
+          icon={theme.images.general.camera}
+          borderColor={theme.colors.clear}
+          iconStyle={{ width: 30, height: 30 }}
+          style={{ maxWidth: 40 }}
+          onClick={() => handleImagePicker()}
+        />
+      </CenterView>
+      <Spinner visible={formState?.loading} />
+      {!isEdit ? (
+        <UserData>
+          <Names>
+            <OText space>{user?.name}</OText>
+            <OText>{user?.lastname}</OText>
+          </Names>
+          {(!!user?.middle_name || !!user?.second_lastname) && (
+            <Names>
+              <OText space>{user?.middle_name}</OText>
+              <OText>{user?.second_lastname}</OText>
+            </Names>
+          )}
+          <OText>{user?.email}</OText>
+          {!!user?.cellphone && <OText>{user?.cellphone}</OText>}
+          {!!phoneUpdate && (
+            <OText
+              color={theme.colors.error}
+            >
+              {t('NECESSARY_UPDATE_COUNTRY_PHONE_CODE', 'It is necessary to update your phone number')}
+            </OText>
+          )}
+        </UserData>
+      ) : (
+        <View style={{ justifyContent: 'center', alignItems: 'center', paddingBottom: 30 }}>
+          <UserFormDetailsUI
+            {...props}
+            hideUpdateButton
+            handleCancelEdit={handleCancelEdit}
+            toggleIsEdit={toggleIsEdit}
+          />
+        </View>
+      )}
+      {!validationFields.loading && !isEdit && (
+        <EditButton>
+          <OButton
+            text={t('EDIT', 'Edit')}
+            bgColor={theme.colors.white}
+            borderColor={theme.colors.primary}
+            isDisabled={formState.loading}
+            imgRightSrc={null}
+            textStyle={{ fontSize: 20 }}
+            style={{ ...styles.editButton }}
+            onClick={toggleIsEdit}
+          />
+        </EditButton>
+      )}
+    </>
+  )
+}
+
+export const Account = (props: any) => {
+  const accoutProps = {
+    ...props,
+    UIComponent: AccountUI
+  }
+  return <UserProfileController {...accoutProps} />
+}