ordering-ui-react-native 0.14.22-release → 0.14.25

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ordering-ui-react-native",
-  "version": "0.14.22-release",
+  "version": "0.14.25",
   "description": "Reusable components made in react native",
   "main": "src/index.tsx",
   "author": "ordering.inc",
@@ -55,7 +55,7 @@
     "@types/styled-components": "^5.1.3",
     "axios": "^0.21.0",
     "moment": "^2.29.1",
-    "ordering-components": "github:Ordering-Inc/ordering-components#release",
+    "ordering-components": "github:Ordering-Inc/ordering-components#development",
     "patch-package": "^6.4.7",
     "postinstall-postinstall": "^2.1.0",
     "prop-types": "^15.7.2",

package/src/components/ProductForm/index.tsx

@@ -232,19 +232,21 @@ export const ProductOptionsUI = (props: any) => {
                       </React.Fragment>
                     )
                   }))}
-                  <ProductComment>
-                    <SectionTitle>
-                      <OText size={16}>{t('SPECIAL_COMMENT', 'Special comment')}</OText>
-                    </SectionTitle>
-                    <OInput
-                      multiline
-                      placeholder={t('SPECIAL_COMMENT', 'Special comment')}
-                      value={productCart.comment}
-                      onChange={(val: string) => handleChangeCommentState({ target: { value: val } })}
-                      isDisabled={!(productCart && !isSoldOut && maxProductQuantity)}
-                      style={styles.comment}
-                    />
-                  </ProductComment>
+                  {!product?.hide_special_instructions && (  
+                    <ProductComment>
+                      <SectionTitle>
+                        <OText size={16}>{t('SPECIAL_COMMENT', 'Special comment')}</OText>
+                      </SectionTitle>
+                      <OInput
+                        multiline
+                        placeholder={t('SPECIAL_COMMENT', 'Special comment')}
+                        value={productCart.comment}
+                        onChange={(val: string) => handleChangeCommentState({ target: { value: val } })}
+                        isDisabled={!(productCart && !isSoldOut && maxProductQuantity)}
+                        style={styles.comment}
+                      />
+                    </ProductComment>
+                  )}
                 </ProductEditions>
               )}
             </WrapContent>

package/themes/doordash/src/components/ProductForm/index.tsx

@@ -287,20 +287,22 @@ export const ProductOptionsUI = (props: any) => {
 											</React.Fragment>
 										)
 									}))}
-									<ProductComment onLayout={(e: any) => setCommentY(e.nativeEvent.layout.y + e.nativeEvent.layout.height)}>
-										<SectionTitle>
-											<OText style={theme.labels.middle as TextStyle}>{t('SPECIAL_COMMENT', 'Special comment')}</OText>
-										</SectionTitle>
-										<OInput
-											multiline
-											placeholder={t('SPECIAL_COMMENT', 'Special comment')}
-											value={productCart.comment}
-											onChange={(val: string) => handleChangeCommentState({ target: { value: val } })}
-											isDisabled={!(productCart && !isSoldOut && maxProductQuantity)}
-											style={styles.comment}
-											inputStyle={{ fontSize: 12, paddingBottom: 7, paddingTop: 17 }}
-										/>
-									</ProductComment>
+									{!product?.hide_special_instructions && (
+										<ProductComment onLayout={(e: any) => setCommentY(e.nativeEvent.layout.y + e.nativeEvent.layout.height)}>
+											<SectionTitle>
+												<OText style={theme.labels.middle as TextStyle}>{t('SPECIAL_COMMENT', 'Special comment')}</OText>
+											</SectionTitle>
+											<OInput
+												multiline
+												placeholder={t('SPECIAL_COMMENT', 'Special comment')}
+												value={productCart.comment}
+												onChange={(val: string) => handleChangeCommentState({ target: { value: val } })}
+												isDisabled={!(productCart && !isSoldOut && maxProductQuantity)}
+												style={styles.comment}
+												inputStyle={{ fontSize: 12, paddingBottom: 7, paddingTop: 17 }}
+											/>
+										</ProductComment>
+									)}
 									{productCart && !isSoldOut && maxProductQuantity > 0 && (
 										<View style={{ paddingVertical: 4, marginBottom: 10 }}>
 											<SectionTitle>

package/themes/instacart/src/components/BusinessProductsList/styles.tsx

@@ -15,5 +15,5 @@ export const WrapperNotFound = styled.View`
 export const ProductsWrapper = styled.View`
   flex-direction: row;
   flex-wrap: wrap;
-  align-items: flex-start;
+  margin-bottom: 20px;
 `

package/themes/instacart/src/components/ProductForm/index.tsx

@@ -235,19 +235,21 @@ export const ProductOptionsUI = (props: any) => {
 											</React.Fragment>
 										)
 									}))}
-									<ProductComment>
-										<SectionTitle>
-											<OText style={theme.labels.middle}>{t('SPECIAL_COMMENT', 'Special comment')}</OText>
-										</SectionTitle>
-										<OInput
-											multiline
-											placeholder={t('SPECIAL_COMMENT', 'Special comment')}
-											value={productCart.comment}
-											onChange={(val: string) => handleChangeCommentState({ target: { value: val } })}
-											isDisabled={!(productCart && !isSoldOut && maxProductQuantity)}
-											style={{ ...styles.comment, borderColor: theme.colors.border }}
-										/>
-									</ProductComment>
+									{!product?.hide_special_instructions && (
+										<ProductComment>
+											<SectionTitle>
+												<OText style={theme.labels.middle}>{t('SPECIAL_COMMENT', 'Special comment')}</OText>
+											</SectionTitle>
+											<OInput
+												multiline
+												placeholder={t('SPECIAL_COMMENT', 'Special comment')}
+												value={productCart.comment}
+												onChange={(val: string) => handleChangeCommentState({ target: { value: val } })}
+												isDisabled={!(productCart && !isSoldOut && maxProductQuantity)}
+												style={{ ...styles.comment, borderColor: theme.colors.border }}
+											/>
+										</ProductComment>
+									)}
 								</ProductEditions>
 							)}
 						</WrapContent>

package/themes/instacart/src/components/SingleProductCard/index.tsx

@@ -6,7 +6,7 @@ import {
   CardInfo,
   SoldOut
 } from './styles'
-import { StyleSheet, TouchableOpacity, Dimensions } from 'react-native'
+import { StyleSheet, TouchableOpacity, Dimensions, View } from 'react-native'
 import { OText, OIcon } from '../shared'
 import { useTheme } from 'styled-components/native'
 
@@ -23,11 +23,7 @@ export const SingleProductCard = (props: SingleProductCardParams) => {
 
   const styles = StyleSheet.create({
     container: {
-      width: (windowWidth - 80) / 2,
-      height: (windowWidth - 80) / 2 + 40
-    },
-    textStyle: {
-      flex: 1,
+      width: (windowWidth - 80) / 2
     },
     soldOutTextStyle : {
       textTransform: 'capitalize',
@@ -35,9 +31,14 @@ export const SingleProductCard = (props: SingleProductCardParams) => {
       fontSize: 12,
       lineHeight: 18
     },
-    productStyle: {
+    imageWrapper: {
       width: (windowWidth - 160) / 2,
       height: (windowWidth - 160) / 2,
+      position: 'relative'
+    },
+    productStyle: {
+      width: '100%',
+      height: '100%',
       borderRadius: 3,
 		  marginTop: 5
     },
@@ -74,26 +75,30 @@ export const SingleProductCard = (props: SingleProductCardParams) => {
       onPress={() => onProductClick?.(product)}
 		  activeOpacity={0.8}
     >
-      <OIcon
-        url={optimizeImage(product?.images, 'h_200,c_limit')}
-        src={!product?.images && theme.images.dummies.product}
-        style={{...styles.productStyle, opacity: (isSoldOut || maxProductQuantity <= 0) ? 0.4 : 1}}
-      />
+      <View
+        style={styles.imageWrapper}
+      >
+        <OIcon
+          url={optimizeImage(product?.images, 'h_200,c_limit')}
+          src={!product?.images && theme.images.dummies.product}
+          style={{...styles.productStyle, opacity: (isSoldOut || maxProductQuantity <= 0) ? 0.4 : 1}}
+        />
+        {(isSoldOut || maxProductQuantity <= 0) && (
+          <SoldOut>
+            <OText size={10} style={styles.soldOutTextStyle}>{t('SOLD_OUT', 'SOLD OUT')}</OText>
+          </SoldOut>
+        )}
+      </View>
       <CardInfo>
         <OText color={theme.colors.textPrimary} style={{...theme.labels.normal, marginTop: 9}}>{parsePrice(product?.price)}</OText>
-        <OText numberOfLines={1} ellipsizeMode='tail' style={{...styles.textStyle, ...theme.labels.small}}>{product?.name}</OText>
-        <OText color={theme.colors.textSecondary} size={9} numberOfLines={2} ellipsizeMode='tail' style={{...styles.textStyle, ...theme.labels.small}}>{product?.description}</OText>
+        <OText numberOfLines={1} ellipsizeMode='tail' style={{...theme.labels.small}}>{product?.name}</OText>
+        <OText color={theme.colors.textSecondary} size={9} numberOfLines={2} ellipsizeMode='tail' style={{...theme.labels.small}}>{product?.description}</OText>
       </CardInfo>
 
 		<TouchableOpacity style={styles.addBtn} onPress={() => onProductClick?.(product)} activeOpacity={0.7}>
 			<OIcon src={theme.images.general.plus_circle} />
 		</TouchableOpacity>
 
-      {(isSoldOut || maxProductQuantity <= 0) && (
-        <SoldOut>
-          <OText size={10} style={styles.soldOutTextStyle}>{t('SOLD_OUT', 'SOLD OUT')}</OText>
-        </SoldOut>
-      )}
     </CardContainer>
   )
 }

package/themes/instacart/src/components/SingleProductCard/styles.tsx

@@ -1,12 +1,9 @@
 import styled from 'styled-components/native'
 
 export const CardContainer = styled.TouchableOpacity`
-  /* flex-grow: 1; */
-  align-items: flex-start;
+  flex-direction: column;
   padding: 10px;
   position: relative;
-  /* margin-end: 10px; */
-  border-radius: 3px;
 `
 export const CardInfo = styled.View`
   flex: 1;
@@ -16,6 +13,7 @@ export const SoldOut = styled.View`
   position: absolute;
   background: ${(props: any) => props.theme.colors.black} 0% 0% no-repeat padding-box;
   padding: 3px 9px;
-  top: 91px;
-  left: 10px;
+  left: 0px;
+  bottom: -5px;
+  border-radius: 3px;
 `

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

@@ -438,19 +438,21 @@ export const ProductOptionsUI = (props: any) => {
                     </React.Fragment>
                   )
                 }))}
-                <ProductComment>
-                  <SectionTitle>
-                    <OText size={28} weight="bold">{t('SPECIAL_COMMENT', 'Special comment')}</OText>
-                  </SectionTitle>
-                  <OInput
-                    multiline
-                    placeholder={t('SPECIAL_COMMENT', 'Special comment')}
-                    value={productCart.comment}
-                    onChange={(val: string) => handleChangeCommentState({ target: { value: val } })}
-                    isDisabled={!(productCart && !isSoldOut && maxProductQuantity)}
-                    style={styles.comment}
-                  />
-                </ProductComment>
+                {!product?.hide_special_instructions && (
+                  <ProductComment>
+                    <SectionTitle>
+                      <OText size={28} weight="bold">{t('SPECIAL_COMMENT', 'Special comment')}</OText>
+                    </SectionTitle>
+                    <OInput
+                      multiline
+                      placeholder={t('SPECIAL_COMMENT', 'Special comment')}
+                      value={productCart.comment}
+                      onChange={(val: string) => handleChangeCommentState({ target: { value: val } })}
+                      isDisabled={!(productCart && !isSoldOut && maxProductQuantity)}
+                      style={styles.comment}
+                    />
+                  </ProductComment>
+                )}
               </ProductEditions>
             </WrapContent>
           </View>

package/themes/original/index.tsx

@@ -28,6 +28,8 @@ 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 {
@@ -86,6 +88,8 @@ export {
 	HelpOrder,
 	NotFoundSource,
 	OrderTypeSelector,
+  Wallets,
+  PaymentOptionWallet,
 
 	// OComponents
 	Toast,

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

@@ -17,6 +17,7 @@ export const BusinessItemAccordion = (props: any) => {
 	const {
 		cart,
 		moment,
+    singleBusiness,
 		handleClearProducts
 	} = props
 
@@ -29,7 +30,7 @@ export const BusinessItemAccordion = (props: any) => {
 	const isClosed = !cart?.valid_schedule
 	const isProducts = cart?.products?.length
 
-	const [isActive, setActiveState] = useState(false)
+	const [isActive, setActiveState] = useState(!!singleBusiness)
 
 	useEffect(() => {
 		const cartsArray = Object.values(orderState?.carts)

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

@@ -57,6 +57,7 @@ const BusinessesListingUI = (props: BusinessesListingParams) => {
 		handleBusinessClick,
 		paginationProps,
 		handleChangeSearch,
+    businessId
 	} = props;
 
 	const theme = useTheme();
@@ -256,17 +257,20 @@ const BusinessesListingUI = (props: BusinessesListingParams) => {
 							/>
 						</WrapMomentOption>
 
-						<SearchBar
-							onSearch={handleChangeSearch}
-							searchValue={searchValue}
-							lazyLoad
-							isCancelXButtonShow={!!searchValue}
-							borderStyle={styles.borderStyle}
-							onCancel={() => handleChangeSearch('')}
-							placeholder={t('SEARCH', 'Search')}
-							height={26}
-							inputStyle={{ ...styles.searchInput, ...Platform.OS === 'ios' ? {} : { paddingBottom: 4 } }}
-						/>
+            {!businessId && (
+              <SearchBar
+                onSearch={handleChangeSearch}
+                searchValue={searchValue}
+                lazyLoad
+                isCancelXButtonShow={!!searchValue}
+                borderStyle={styles.borderStyle}
+                onCancel={() => handleChangeSearch('')}
+                placeholder={t('SEARCH', 'Search')}
+                height={26}
+                inputStyle={{ ...styles.searchInput, ...Platform.OS === 'ios' ? {} : { paddingBottom: 4 } }}
+              />
+            )}
+
 					</View>
 				</OrderControlContainer>
 			</HeaderWrapper>
@@ -277,7 +281,7 @@ const BusinessesListingUI = (props: BusinessesListingParams) => {
 					/>
 				</OrderProgressWrapper>
 			)}
-			{!props.franchiseId && featuredBusiness && featuredBusiness.length > 0 && (
+			{!businessId && !props.franchiseId && featuredBusiness && featuredBusiness.length > 0 && (
 				<FeaturedWrapper>
 					<OText size={16} style={{ marginLeft: 40 }} weight={Platform.OS === 'ios' ? '600' : 'bold'}>{t('FEATURED_BUSINESS', 'Featured business')}</OText>
 					<ScrollView
@@ -306,17 +310,19 @@ const BusinessesListingUI = (props: BusinessesListingParams) => {
 				</FeaturedWrapper>
 			)}
 			<View style={{ height: 8, backgroundColor: theme.colors.backgroundGray100 }} />
-      {!props.franchiseId && (
+      {!businessId && !props.franchiseId && (
         <HighestRatedBusinesses onBusinessClick={handleBusinessClick} navigation={navigation} />
       )}
 			<View style={{ height: 8, backgroundColor: theme.colors.backgroundGray100 }} />
 			<ListWrapper>
-				<BusinessTypeFilter
-					images={props.images}
-					businessTypes={props.businessTypes}
-					defaultBusinessType={props.defaultBusinessType}
-					handleChangeBusinessType={handleChangeBusinessType}
-				/>
+        {!businessId && (
+          <BusinessTypeFilter
+            images={props.images}
+            businessTypes={props.businessTypes}
+            defaultBusinessType={props.defaultBusinessType}
+            handleChangeBusinessType={handleChangeBusinessType}
+          />
+        )}
 				{!businessesList.loading && businessesList.businesses.length === 0 && (
 					<NotFoundSource
 						content={t(

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

@@ -113,6 +113,15 @@ const CartUI = (props: any) => {
     }
   }
 
+  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 (
     <CContainer>
       {openUpselling && (
@@ -130,6 +139,7 @@ const CartUI = (props: any) => {
       )}
       <BusinessItemAccordion
         cart={cart}
+        singleBusiness={props.singleBusiness}
         moment={momentFormatted}
         handleClearProducts={handleClearProducts}
         handleCartOpen={handleCartOpen}
@@ -191,7 +201,7 @@ const CartUI = (props: any) => {
               cart?.fees?.length > 0 && cart?.fees?.filter((fee: any) => !(fee.fixed === 0 && fee.percentage === 0)).map((fee: any) => (
                 <OSTable key={fee?.id}>
                   <OSRow>
-                    <OText numberOfLines={1}>
+                    <OText numberOfLines={1} size={12} lineHeight={18}>
                       {fee.name || t('INHERIT_FROM_BUSINESS', 'Inherit from business')}{' '}
                       ({parsePrice(fee?.fixed)} + {fee?.percentage}%){' '}
                     </OText>
@@ -203,6 +213,15 @@ const CartUI = (props: any) => {
                 </OSTable>
               ))
             }
+            {cart?.service_fee > 0 && !cart?.fees?.length && (
+              <OSTable>
+                <OText size={12} lineHeight={18}>
+                  {t('SERVICE_FEE', 'Service Fee')}
+                  {`(${verifyDecimals(cart?.business?.service_fee, parseNumber)}%)`}
+                </OText>
+                <OText size={12} lineHeight={18}>{parsePrice(cart?.service_fee)}</OText>
+              </OSTable>
+            )}
             {orderState?.options?.type === 1 && cart?.delivery_price > 0 && (
               <OSTable>
                 <OText size={12} lineHeight={18}>{t('DELIVERY_FEE', 'Delivery Fee')}</OText>
@@ -223,15 +242,14 @@ const CartUI = (props: any) => {
                 <OText size={12} lineHeight={18}>{parsePrice(cart?.driver_tip)}</OText>
               </OSTable>
             )}
-            {cart?.service_fee > 0 && (
-              <OSTable>
-                <OText size={12} lineHeight={18}>
-                  {t('SERVICE_FEE', 'Service Fee')}
-                  {`(${verifyDecimals(cart?.business?.service_fee, parseNumber)}%)`}
+            {cart?.payment_events?.length > 0 && cart?.payment_events?.map((event: any) => (
+              <OSTable key={event.id}>
+                <OText size={12} numberOfLines={1}>
+                  {walletName[cart?.wallets?.find((wallet: any) => wallet.id === event.wallet_id)?.type]?.name}
                 </OText>
-                <OText size={12} lineHeight={18}>{parsePrice(cart?.service_fee)}</OText>
+                <OText size={12}>-{parsePrice(event.amount)}</OText>
               </OSTable>
-            )}
+            ))}
             {isCouponEnabled && !isCartPending && (
               <OSTable>
                 <OSCoupon>
@@ -249,7 +267,7 @@ const CartUI = (props: any) => {
                   {t('TOTAL', 'Total')}
                 </OText>
                 <OText size={14} lineHeight={21} weight={'600'}>
-                  {cart?.total >= 1 && parsePrice(cart?.total)}
+                  {parsePrice(cart?.balance ?? cart?.total)}
                 </OText>
               </OSTable>
             </OSTotal>

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

@@ -30,6 +30,7 @@ export const CartContent = (props: any) => {
 							{cart.products.length > 0 && (
 								<>
 									<Cart
+                    singleBusiness={props.singleBusiness}
                     isFranchiseApp={props.isFranchiseApp}
 										cart={cart}
                     cartuuid={cart.uuid}

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

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

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

@@ -74,6 +74,10 @@ 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;
@@ -99,4 +103,4 @@ export const DeliveryOptionItem = styled.View`
   align-items: center;
   flex-direction: row;
   background-color: ${(props : any) => props?.backgroundColor ?? '#fff'};
-`; 
+`;

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

@@ -48,8 +48,8 @@ export const Help = (props: HelpParams) => {
 
       <LastOrdersContainer>
         <OText size={18} weight={600}>{t('LAST_ORDERS', 'Last Orders')}</OText>
-        <LastOrders onRedirect={onRedirect} />
+        <LastOrders businessId={props.businessId} onRedirect={onRedirect} />
       </LastOrdersContainer>
     </>
   )
-}
+}

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

@@ -104,6 +104,15 @@ 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 = [
@@ -826,6 +835,51 @@ 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/OrderProgress/index.tsx

@@ -193,13 +193,13 @@ const OrderProgressUI = (props: any) => {
           </View>
         </View>
       )}
-      {!orderList?.loading && orderList?.orders?.length === 0 && (
+      {/* {!orderList?.loading && orderList?.orders?.length === 0 && (
         <NotFoundSource
           image={imageFails}
           content={t('NO_RESULTS_FOUND', 'Sorry, no results found')}
           conditioned
         />
-      )}
+      )} */}
 		</>
 	)
 }