ordering-ui-react-native 0.14.19 → 0.14.21-release

package/package.json

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

package/src/components/shared/OToast.tsx

@@ -27,7 +27,7 @@ export const Toast = (props: any) => {
       duration: fadeDuration,
       useNativeDriver: true,
     }).start(() => {
-      hideToast();
+      hideToast && hideToast();
     });
   }, [opacity, hideToast]);
 

package/themes/business/src/components/shared/OToast.tsx

@@ -27,7 +27,7 @@ export const Toast = (props: any) => {
       duration: fadeDuration,
       useNativeDriver: true,
     }).start(() => {
-      hideToast();
+      hideToast && hideToast();
     });
   }, [opacity, hideToast]);
 

package/themes/doordash/src/components/shared/OToast.tsx

@@ -26,7 +26,7 @@ export const Toast: React.FC = () => {
             duration: fadeDuration,
             useNativeDriver: true,
         }).start(() => {
-            hideToast();
+            hideToast && hideToast();
         });
     }, [opacity, hideToast]);
 

package/themes/instacart/src/components/shared/OToast.tsx

@@ -25,7 +25,7 @@ export const Toast = () => {
       duration: fadeDuration,
       useNativeDriver: true,
     }).start(() => {
-      hideToast();
+      hideToast && hideToast();
     });
   }, [opacity, hideToast]);
 

package/themes/kiosk/src/components/shared/OToast.tsx

@@ -27,7 +27,7 @@ export const Toast: React.FC = () => {
       duration: fadeDuration,
       useNativeDriver: true,
     }).start(() => {
-      hideToast();
+      hideToast && hideToast();
     });
   }, [opacity, hideToast]);
 

package/themes/original/index.tsx

@@ -28,8 +28,6 @@ import { HelpGuide } from './src/components/HelpGuide';
 import { HelpOrder } from './src/components/HelpOrder';
 import { NotFoundSource } from './src/components/NotFoundSource';
 import { OrderTypeSelector } from './src/components/OrderTypeSelector';
-import { Wallets } from './src/components/Wallets';
-import { PaymentOptionWallet } from './src/components/PaymentOptionWallet';
 
 import { Toast } from './src/components/shared/OToast';
 import {
@@ -88,8 +86,6 @@ export {
 	HelpOrder,
 	NotFoundSource,
 	OrderTypeSelector,
-  Wallets,
-  PaymentOptionWallet,
 
 	// OComponents
 	Toast,

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

@@ -23,7 +23,6 @@ import { PaymentOptions } from '../PaymentOptions';
 import { DriverTips } from '../DriverTips';
 import { NotFoundSource } from '../NotFoundSource';
 import { UserDetails } from '../UserDetails';
-import { PaymentOptionWallet } from '../PaymentOptionWallet';
 
 import {
 	ChContainer,
@@ -38,8 +37,7 @@ import {
 	ChUserDetails,
 	ChCart,
 	DeliveryOptionsContainer,
-	DeliveryOptionItem,
-  WalletPaymentOptionContainer
+	DeliveryOptionItem
 } from './styles';
 import { Fade, Placeholder, PlaceholderLine } from 'rn-placeholder';
 
@@ -506,15 +504,6 @@ const CheckoutUI = (props: any) => {
 						</ChSection>
 					)}
 
-          {!cartState.loading && cart && (
-            <WalletPaymentOptionContainer>
-              <PaymentOptionWallet
-                cart={cart}
-              />
-            </WalletPaymentOptionContainer>
-          )}
-
-
 					{!cartState.loading && cart && (
 						<ChSection>
 							<ChCart>
@@ -554,8 +543,8 @@ const CheckoutUI = (props: any) => {
 					)}
 
 					{!cartState.loading && cart && (
-            <View>
-							<ChErrors style={{ marginBottom: 0 }}>
+						<ChSection style={{ paddingTop: 0, paddingBottom: 20, paddingHorizontal: 20 }}>
+							<ChErrors>
 								{!cart?.valid_address && cart?.status !== 2 && (
 									<OText
 										color={theme.colors.error}
@@ -583,7 +572,7 @@ const CheckoutUI = (props: any) => {
 									</OText>
 								)}
 							</ChErrors>
-						</View>
+						</ChSection>
 					)}
 					<OModal
 						open={openChangeStore && props.isFranchiseApp}

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

@@ -74,10 +74,6 @@ export const ChDriverTips = styled(ChPaymethods)``
 
 export const ChCart = styled(ChPaymethods)``
 
-export const WalletPaymentOptionContainer = styled(ChPaymethods)`
-  padding-bottom: 0;
-`
-
 export const ChPlaceOrderBtn = styled.View`
   width: 100%;
   display: flex;
@@ -103,4 +99,4 @@ export const DeliveryOptionItem = styled.View`
   align-items: center;
   flex-direction: row;
   background-color: ${(props : any) => props?.backgroundColor ?? '#fff'};
-`;
+`; 

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

@@ -104,15 +104,6 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
 
   const { order, businessData } = props.order;
 
-  const walletName: any = {
-    cash: {
-      name: t('PAY_WITH_CASH_WALLET', 'Pay with Cash Wallet'),
-    },
-    credit_point: {
-      name: t('PAY_WITH_CREDITS_POINTS_WALLET', 'Pay with Credit Points Wallet'),
-    }
-  }
-
   const getOrderStatus = (s: string) => {
     const status = parseInt(s);
     const orderStatus = [
@@ -835,51 +826,6 @@ export const OrderDetailsUI = (props: OrderDetailsParams) => {
                   </OText>
                 </Table>
               </Total>
-              {order?.payment_events?.length > 0 && (
-                <View style={{marginTop: 10}}>
-                  <OText size={20} weight='bold' color={theme.colors.textNormal}>{t('PAYMENTS', 'Payments')}</OText>
-                  <View
-                    style={{
-                      width: '100%',
-                      marginTop: 10
-                    }}
-                  >
-                    {order?.payment_events?.map((event: any) => (
-                      <View
-                        key={event.id}
-                        style={{
-                          display: 'flex',
-                          flexDirection: 'row',
-                          justifyContent: 'space-between',
-                          alignItems: 'center',
-                          marginBottom: 10
-                        }}
-                      >
-                        <View
-                          style={{
-                            display: 'flex',
-                            flexDirection: 'column',
-                          }}
-                        >
-                          <OText>
-                            {event?.wallet_event
-                              ? walletName[event?.wallet_event?.wallet?.type]?.name
-                              : event?.paymethod?.name}
-                          </OText>
-                          {event?.data?.charge_id && (
-                            <OText>
-                              {`${t('CODE', 'Code')}: ${event?.data?.charge_id}`}
-                            </OText>
-                          )}
-                        </View>
-                        <OText>
-                          -{parsePrice(event.amount)}
-                        </OText>
-                      </View>
-                    ))}
-                  </View>
-                </View>
-              )}
             </OrderBill>
           </OrderContent>
         </>

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

@@ -28,6 +28,7 @@ import { TouchableOpacity } from 'react-native';
 
 const OrderSummaryUI = (props: any) => {
   const {
+    cart,
     changeQuantity,
     getProductMax,
     offsetDisabled,
@@ -75,16 +76,6 @@ const OrderSummaryUI = (props: any) => {
     }
   }
 
-  const cart = orderState?.carts?.[`businessId:${props.cart.business_id}`]
-
-  const walletName: any = {
-    cash: {
-      name: t('PAY_WITH_CASH_WALLET', 'Pay with Cash Wallet'),
-    },
-    credit_point: {
-      name: t('PAY_WITH_CREDITS_POINTS_WALLET', 'Pay with Credit Points Wallet'),
-    }
-  }
 
   return (
     <OSContainer>
@@ -214,8 +205,7 @@ const OrderSummaryUI = (props: any) => {
                           height: 100,
                           borderColor: theme.colors.border,
                           paddingRight: 50,
-                          marginTop: 10,
-                          borderRadius: 8
+                          marginTop: 10
                         }}
                         multiline
                       />
@@ -232,52 +222,6 @@ const OrderSummaryUI = (props: any) => {
                   </View>
                 </OSTable>
               )}
-              {cart?.payment_events?.length > 0 && (
-                <View
-                  style={{
-                    width: '100%',
-                    marginTop: 20
-                  }}
-                >
-                  {cart?.payment_events?.map((event: any) => (
-                    <View
-                      key={event.id}
-                      style={{
-                        display: 'flex',
-                        flexDirection: 'row',
-                        justifyContent: 'space-between',
-                        marginBottom: 10
-                      }}
-                    >
-                      <OText>
-                        {walletName[cart?.wallets?.find((wallet: any) => wallet.id === event.wallet_id)?.type]?.name}
-                      </OText>
-                      <OText>
-                        -{parsePrice(event.amount)}
-                      </OText>
-                    </View>
-                  ))}
-                    <View
-                    style={{
-                      display: 'flex',
-                      flexDirection: 'row',
-                      justifyContent: 'space-between',
-                      marginBottom: 10
-                    }}
-                  >
-                    <OText
-                      weight={'bold'}
-                    >
-                      {t('TOTAL_TO_PAY', 'Total to pay')}
-                    </OText>
-                    <OText
-                      weight={'bold'}
-                    >
-                      {parsePrice(cart?.balance)}
-                    </OText>
-                  </View>
-                </View>
-              )}
             </OSBill>
           )}
           <OModal

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

@@ -14,7 +14,6 @@ import { ProfileParams } from '../../types';
 import { LogoutButton } from '../LogoutButton'
 import { LanguageSelector } from '../LanguageSelector'
 import MessageCircle from 'react-native-vector-icons/AntDesign'
-import Ionicons from 'react-native-vector-icons/Ionicons'
 
 import {
 	OIcon,
@@ -161,10 +160,6 @@ const ProfileListUI = (props: ProfileParams) => {
 						<MessageCircle name='message1' style={styles.messageIconStyle} color={theme.colors.textNormal} />
 						<OText size={14} lineHeight={24} weight={'400'} color={theme.colors.textNormal}>{t('MESSAGES', 'Messages')}</OText>
 					</ListItem>
-					<ListItem onPress={() => onRedirect('Wallets', { isFromProfile: true, isGoBack: true })} activeOpacity={0.7}>
-						<Ionicons name='wallet-outline' style={styles.messageIconStyle} color={theme.colors.textNormal} />
-						<OText size={14} lineHeight={24} weight={'400'} color={theme.colors.textNormal}>{t('WALLETS', 'Wallets')}</OText>
-					</ListItem>
 					<ListItem onPress={() => navigation.navigate('Help', {})} activeOpacity={0.7}>
 						<OIcon src={theme.images.general.ic_help} width={16} color={theme.colors.textNormal} style={{ marginEnd: 14 }} />
 						<OText size={14} lineHeight={24} weight={'400'} color={theme.colors.textNormal}>{t('HELP', 'Help')}</OText>

package/themes/original/src/components/shared/OToast.tsx

@@ -26,7 +26,7 @@ export const Toast: React.FC = () => {
 			duration: fadeDuration,
 			useNativeDriver: true,
 		}).start(() => {
-			hideToast();
+			hideToast && hideToast();
 		});
 	}, [opacity, hideToast]);
 

package/themes/original/src/types/index.tsx

@@ -344,8 +344,8 @@ export interface MessagesParams {
 	onClose?: () => void,
 	isMeesageListing?: boolean,
 	setCanRead?: any,
-	business?: boolean,
-	driver?: boolean,
+	business: boolean,
+	driver: boolean,
 	onMessages?: any
 }
 export interface ViewInterface {

package/themes/single-business/src/components/shared/OToast.tsx

@@ -26,7 +26,7 @@ export const Toast: React.FC = () => {
 			duration: fadeDuration,
 			useNativeDriver: true,
 		}).start(() => {
-			hideToast();
+			hideToast && hideToast();
 		});
 	}, [opacity, hideToast]);
 

package/themes/uber-eats/src/components/shared/OToast.tsx

@@ -27,7 +27,7 @@ export const Toast = (props: any) => {
       duration: fadeDuration,
       useNativeDriver: true,
     }).start(() => {
-      hideToast();
+      hideToast && hideToast();
     });
   }, [opacity, hideToast]);
 

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

@@ -1,163 +0,0 @@
-import React, { useState, useEffect } from 'react'
-import { Platform, StyleSheet, View } from 'react-native'
-import { Fade, Placeholder, PlaceholderLine } from 'rn-placeholder';
-import { useTheme } from 'styled-components/native'
-import CheckBox from '@react-native-community/checkbox';
-import {
-  PaymentOptionWallet as PaymentOptionWalletController,
-  useLanguage,
-  useUtils,
-} from 'ordering-components/native'
-
-import {
-  Container,
-  SectionLeft,
-} from './styles'
-
-import { OText } from '../shared'
-
-const PaymentOptionWalletUI = (props: any) => {
-  const {
-    cart,
-    walletsState,
-    selectWallet,
-    deletetWalletSelected
-  } = props
-
-  const theme = useTheme()
-  const [, t] = useLanguage()
-  const [{ parsePrice }] = useUtils()
-
-  const styles = StyleSheet.create({
-    checkBoxStyle: {
-      width: 25,
-      height: 25,
-    }
-  });
-
-  const [checkedState, setCheckedState] = useState(
-    new Array(walletsState.result?.length).fill(false)
-  );
-
-  const creditBalance = (wallet: any) => ` = ${parsePrice((wallet.balance * wallet.redemption_rate) / 100)}`
-
-  const walletName: any = {
-    cash: {
-      name: t('PAY_WITH_CASH_WALLET', 'Pay with Cash Wallet'),
-    },
-    credit_point: {
-      name: t('PAY_WITH_CREDITS_POINTS_WALLET', 'Pay with Credit Points Wallet'),
-    }
-  }
-
-  const handleOnChange = (position: any, wallet: any) => {
-    const updatedCheckedState = checkedState.map((item, index) =>
-      index === position ? !item : item
-    );
-
-    if (!checkedState[position]) {
-      selectWallet(wallet)
-    } else {
-      deletetWalletSelected(wallet)
-    }
-
-    setCheckedState(updatedCheckedState);
-  };
-
-  useEffect(() => {
-    if (!walletsState.loading) {
-      setCheckedState(
-        walletsState.result.map((wallet: any) => {
-          return !!cart?.wallets?.find((w: any) => w.id === wallet.id)
-        })
-      )
-    }
-  }, [walletsState.result?.length])
-
-  return (
-    <>
-      {!walletsState.loading &&
-        !walletsState.error &&
-        walletsState.result?.length > 0 &&
-      (
-        <>
-          {walletsState.result?.map((wallet: any, idx: any) => wallet.valid && (
-            <Container
-              key={wallet.id}
-              isBottomBorder={idx === walletsState.result?.filter((wallet: any) => wallet.valid)?.length - 1}
-            >
-              <SectionLeft>
-                <CheckBox
-                  value={checkedState[idx]}
-                  onValueChange={() => handleOnChange(idx, wallet)}
-                  disabled={(cart?.balance === 0 && !checkedState[idx]) || wallet.balance === 0 }
-                  boxType={'square'}
-                  tintColors={{
-                    true: theme.colors.primary,
-                    false: theme.colors.disabled
-                  }}
-                  tintColor={theme.colors.disabled}
-                  onCheckColor={theme.colors.primary}
-                  onTintColor={theme.colors.primary}
-                  style={Platform.OS === 'ios' && styles.checkBoxStyle}
-                />
-                <View style={{ alignItems: 'baseline' }}>
-                  <View>
-                    <OText
-                      style={((cart?.balance === 0 && !checkedState[idx]) || wallet.balance === 0) ?{
-                        color: theme.colors.disabled
-                      } : {}}
-                    >
-                      {walletName[wallet.type]?.name}
-                    </OText>
-                  </View>
-              </View>
-              </SectionLeft>
-
-              <View style={{maxWidth: '40%', alignItems: 'flex-end' }}>
-                {wallet.type === 'cash' && (
-                  <OText>
-                    {parsePrice(wallet?.balance)}
-                  </OText>
-                )}
-                {wallet.type === 'credit_point' && (
-                  <OText>
-                    <OText color={theme.colors.primary} weight='bold'>
-                    {`${wallet?.balance} ${t('POINTS', 'Points')}`}
-                    </OText>
-                    <OText>
-                      {`${wallet.balance > 0 && creditBalance(wallet)}`}
-                    </OText>
-                  </OText>
-                )}
-              </View>
-            </Container>
-          ))}
-        </>
-      )}
-
-      {walletsState?.loading && (
-        <View>
-          {[...Array(2).keys()].map(i => (
-            <View style={{ marginBottom: 10 }} key={i}>
-              <Placeholder Animation={Fade}>
-                <PlaceholderLine width={100} height={40} style={{ marginBottom: 0, borderRadius: 8 }} />
-              </Placeholder>
-            </View>
-          ))}
-        </View>
-      )}
-    </>
-  )
-}
-
-export const PaymentOptionWallet = (props: any) => {
-  const paymentWalletProps = {
-    ...props,
-    UIComponent: PaymentOptionWalletUI
-  }
-
-  return (
-    <PaymentOptionWalletController {...paymentWalletProps} />
-  )
-}

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

@@ -1,38 +0,0 @@
-import styled, { css } from 'styled-components/native'
-
-export const Container = styled.View`
-  width: 100%;
-  display: flex;
-  padding: 20px 0;
-  margin-top: 10px;
-  flex-direction: row;
-  justify-content: space-between;
-  align-items: center;
-  border-top-width: 1px;
-  border-top-color: ${(props: any) => props.theme.colors.backgroundGray200};
-  ${(props: any) => props.isBottomBorder && css`
-    border-bottom-width: 1px;
-    border-bottom-color: ${(props: any) => props.theme.colors.backgroundGray200};
-  `}
-`
-
-export const SectionLeft = styled.View`
-  max-width: 55%;
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  justify-content: center;
-`
-
-export const SectionLeftText = styled.View`
-  alignSelf: flex-start;
-  display: flex;
-  flex-direction: column;
-  flex-wrap: wrap;
-`
-
-export const SectionWrapper = styled.View`
-  padding-top: 10px;
-  display: flex;
-  flex-direction: column;
-`

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

@@ -1,68 +0,0 @@
-import React from 'react'
-import { useTheme } from 'styled-components/native'
-import { useLanguage, useUtils } from 'ordering-components/native'
-
-import {
-  Container,
-  DateBlock,
-  MessageBlock,
-  DescriptionBlock,
-  Dot
-} from './styles'
-import { OIcon, OText } from '../shared';
-
-export const WalletTransactionItem = (props: any) => {
-  const {
-    item,
-    idx,
-    type
-  } = props
-
-  const theme = useTheme()
-  const [{ parsePrice, parseDate }] = useUtils()
-  const [, t] = useLanguage()
-
-  const LANG_EVENT_KEY = `WALLET_${type.toUpperCase()}_${item?.event.toUpperCase()}_${item?.event_type.toUpperCase()}_${item?.amount >= 0 ? 'POSITIVE': 'NEGATIVE'}`
-  const lang_event_text = !!item?.event?.order_id
-    ? `:author ${item?.amount >= 0 ? 'add' : 'reduce'} money in Order No. :order_id`
-    : `:author ${item?.amount >= 0 ? 'add' : 'reduce'} money`
-
-  return (
-    <Container>
-      <Dot isTop={idx === 0} />
-      <DateBlock>
-        <OText color={theme.colors.disabled}>{parseDate(item?.created_at)}</OText>
-        <OText
-          style={{
-            color: item?.amount > 0 && theme.colors.primary,
-            fontWeight: 'bold'
-          }}
-        >
-          {item?.amount > 0 && '+ '}{parsePrice(item?.amount)}
-        </OText>
-      </DateBlock>
-      <MessageBlock>
-        <OText>
-          {t(LANG_EVENT_KEY, lang_event_text)
-            .replace(':author', item?.event?.author?.name ?? '')
-            .replace(':order_id', item?.event?.order_id ?? '')}
-        </OText>
-      </MessageBlock>
-      {!!item?.description && (
-        <DescriptionBlock>
-          <OText>{item?.description}</OText>
-        </DescriptionBlock>
-      )}
-      {!!item?.code && (
-        <DescriptionBlock>
-          <OText weight={'bold'}>
-            {t('CODE', 'Code')}
-            <OText weight={'100'}>
-              {': '}{item?.code}
-            </OText>
-          </OText>
-        </DescriptionBlock>
-      )}
-    </Container>
-  )
-}

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

@@ -1,37 +0,0 @@
-import styled from 'styled-components/native'
-
-export const Container = styled.View`
-  display: flex;
-  flex-direction: column;
-  margin-bottom: 20px;
-  position: relative;
-  padding-left: 10px;
-`
-
-export const DateBlock = styled.View`
-  display: flex;
-  flex-direction: row;
-  justify-content: space-between;
-  align-items: center;
-`
-
-export const MessageBlock = styled.View`
-  display: flex;
-  font-size: 14px;
-`
-
-export const Dot = styled.View`
-  position: absolute;
-  top: ${(props: any) => props.isTop ? 0 : 6}px;
-  left: -4px;
-  width: 6px;
-  height: 6px;
-  border-radius: 50px;
-  background-color: ${(props: any) => props.theme.colors.disabled};
-`
-
-export const DescriptionBlock = styled(MessageBlock)`
-  display: flex;
-  flex-direction: row;
-  flex-wrap: wrap;
-`

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

@@ -1,204 +0,0 @@
-import React, { useState } from 'react'
-import { Pressable, View } from 'react-native';
-import { useTheme } from 'styled-components/native'
-import { Fade, Placeholder, PlaceholderLine } from 'rn-placeholder';
-import {
-  WalletList,
-  useLanguage,
-  useUtils,
-  useConfig
-} from 'ordering-components/native'
-
-import {
-  Container,
-  BalanceElement,
-  TransactionsWrapper,
-  OTabs,
-  OTab,
-  SectionContent
-} from './styles'
-
-import NavBar from '../NavBar'
-import { OIcon, OText } from '../shared';
-import { NotFoundSource } from '../NotFoundSource';
-import { WalletTransactionItem } from '../WalletTransactionItem'
-
-const WalletsUI = (props: any) => {
-  const {
-    navigation,
-    walletList,
-    transactionsList,
-    setWalletSelected
-  } = props
-
-  const [, t] = useLanguage()
-  const theme = useTheme()
-  const [{ parsePrice, parseDate }] = useUtils()
-  const [{ configs }] = useConfig()
-
-  const [tabSelected, setTabSelected] = useState('cash')
-
-  const currentWalletSelected = (walletList.wallets?.length > 0 && walletList.wallets?.find((w: any) => w.type === tabSelected)) ?? null
-
-  const walletName: any = {
-    cash: {
-      name: t('CASH_WALLET', 'Cash Wallet'),
-      value: 0
-    },
-    credit_point: {
-      name: t('CREDITS_POINTS_WALLET', 'Credit Points Wallet'),
-      value: 1
-    }
-  }
-
-  const handleChangeTab = (wallet: any) => {
-    setTabSelected(wallet.type)
-    setWalletSelected(wallet.id)
-  }
-
-  const goToBack = () => {
-    navigation?.canGoBack() && navigation.goBack()
-  }
-
-  return (
-    <Container>
-      <NavBar
-        title={t('WALLETS', 'Wallets')}
-        titleAlign={'center'}
-        onActionLeft={goToBack}
-        showCall={false}
-        paddingTop={10}
-        btnStyle={{ paddingLeft: 0 }}
-      />
-
-      {!walletList.loading &&
-        !walletList.error &&
-        walletList.wallets?.length > 0 &&
-      (
-        <>
-          <OTabs>
-            {walletList.wallets?.map((wallet: any) =>(
-              <Pressable
-                key={wallet.id}
-                onPress={() => handleChangeTab(wallet)}
-              >
-                <OTab>
-                  <OText size={18} color={tabSelected === wallet.type ? theme.colors.primary : theme.colors.disabled}>
-                    {walletName[wallet.type]?.name}
-                  </OText>
-                </OTab>
-              </Pressable>
-            ))}
-          </OTabs>
-
-          <SectionContent>
-            <BalanceElement>
-              <OText size={20} style={{fontWeight: '600'}}>
-                {currentWalletSelected?.type === 'cash'
-                  ? parsePrice(currentWalletSelected?.balance)
-                  : currentWalletSelected?.balance
-                }
-              </OText>
-              <OText style={{ paddingLeft: 5 }}>
-                {currentWalletSelected?.type === 'cash'
-                  ? configs?.stripe_currency?.value
-                  : t('POINTS', 'Points')}
-              </OText>
-            </BalanceElement>
-            {console.log(transactionsList)}
-
-            <View style={{ marginTop: 20, width: '100%', paddingHorizontal: 1, paddingBottom: 40 }}>
-              {!transactionsList?.loading &&
-                !transactionsList?.error &&
-                transactionsList.list?.[`wallet:${currentWalletSelected?.id}`]?.length > 0 &&
-              (
-                <>
-                  <OText style={{fontSize: 20}}>
-                    {t('TRANSACTIONS_HISTORY', 'Transactions history')}
-                  </OText>
-                  <TransactionsWrapper>
-                    {transactionsList.list?.[`wallet:${currentWalletSelected?.id}`]?.map((transaction: any, i: number) =>(
-                      <WalletTransactionItem
-                        idx={i}
-                        type={currentWalletSelected?.type}
-                        key={transaction.id}
-                        item={transaction}
-                      />
-                    ))}
-                  </TransactionsWrapper>
-                </>
-              )}
-
-              {(transactionsList?.loading || !transactionsList.list?.[`wallet:${currentWalletSelected?.id}`]) && (
-                <View>
-                  {[...Array(4).keys()].map(i => (
-                    <View style={{ marginBottom: 10 }} key={i}>
-                      <Placeholder Animation={Fade}>
-                        <PlaceholderLine width={100} height={100} style={{ marginBottom: 0, borderRadius: 8 }} />
-                      </Placeholder>
-                    </View>
-                  ))}
-                </View>
-              )}
-
-              {!(transactionsList?.loading && transactionsList.list?.[`wallet:${currentWalletSelected?.id}`]) &&
-                (transactionsList?.error ||
-                  !transactionsList.list?.[`wallet:${currentWalletSelected?.id}`]?.length) &&
-              (
-                <NotFoundSource
-                  content={transactionsList?.error
-                    ? t('ERROR_NOT_FOUND_TRANSACTIONS', 'Sorry, an error has occurred')
-                    : t('NOT_FOUND_TRANSACTIONS', 'No transactions to show at this time.')
-                  }
-                />
-              )}
-            </View>
-          </SectionContent>
-        </>
-      )}
-
-      {walletList?.loading && (
-        <>
-          <View>
-            <Placeholder Animation={Fade}>
-              <PlaceholderLine width={100} height={40} style={{ marginBottom: 0 }} />
-            </Placeholder>
-          </View>
-          <View style={{ marginTop: 10, marginBottom: 20 }}>
-            <Placeholder Animation={Fade}>
-              <PlaceholderLine width={100} height={40} style={{ marginBottom: 0 }} />
-            </Placeholder>
-          </View>
-          <View>
-            {[...Array(4).keys()].map(i => (
-              <View style={{ marginBottom: 10 }} key={i}>
-                <Placeholder Animation={Fade}>
-                  <PlaceholderLine width={100} height={60} style={{ marginBottom: 0 }} />
-                </Placeholder>
-              </View>
-            ))}
-          </View>
-        </>
-      )}
-
-      {!walletList?.loading && (walletList?.error || !walletList?.wallets?.length) && (
-        <NotFoundSource
-          content={walletList?.error
-            ? t('ERROR_NOT_FOUND_WALLETS', 'Sorry, an error has occurred')
-            : t('NOT_FOUND_WALLETS', 'No wallets to show at this time.')
-          }
-        />
-      )}
-    </Container>
-  )
-}
-
-export const Wallets = (props: any) => {
-  const walletsProps = {
-    ...props,
-    UIComponent: WalletsUI
-  }
-  return (
-    <WalletList {...walletsProps} />
-  )
-}

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

@@ -1,43 +0,0 @@
-import styled from 'styled-components/native'
-
-export const Container = styled.View`
-  display: flex;
-  flex-direction: column;
-`
-
-export const SectionContent = styled.View`
-  width: 100%;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  margin-top: 20px;
-`
-
-export const TransactionsWrapper = styled.View`
-  display: flex;
-  flex-direction: column;
-  border-left-width: 2px;
-  border-left-color: ${(props: any) => props.theme.colors.disabled};
-`
-
-export const BalanceElement = styled.View`
-  width: 100%;
-  padding: 10px 0;
-  display: flex;
-  flex-direction: row;
-  justify-content: center;
-  align-items: flex-end;
-  background-color: ${(props: any) => props.theme.colors.backgroundGray100};
-  border-radius: 8px;
-`
-
-export const OTabs = styled.View`
-  flex-direction: row;
-  width: 100%;
-  flex-wrap: wrap;
-`;
-
-export const OTab = styled.View`
-  padding-horizontal: 10px;
-`;