ordering-ui-react-native 0.21.71 → 0.21.73

package/package.json

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

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

@@ -33,6 +33,7 @@ export const OrderSummary = ({ order, navigation, orderStatus, askBluetoothPermi
   const [state, setState] = useState({
     selectedPrinter: { url: undefined },
   });
+  const paymethodsLength = order?.payment_events?.filter((item: any) => item.event === 'payment')?.length
 
   const getFormattedSubOptionName = ({ quantity, name, position, price }: any) => {
     if (name !== 'No') {
@@ -83,6 +84,24 @@ export const OrderSummary = ({ order, navigation, orderStatus, askBluetoothPermi
   const customerName = `${order?.customer?.name ?? ''} ${order?.customer?.middle_name ?? ''} ${order?.customer?.lastname ?? ''} ${order?.customer?.second_lastname ?? ''
     }`?.replace('  ', ' ')?.trim() ?? ''
 
+  const walletName: any = {
+    cash: {
+      name: t('CASH_WALLET', 'Cash Wallet')
+    },
+    credit_point: {
+      name: t('POINTS_WALLET', 'Points Wallet')
+    }
+  }
+
+  const handlePaymethodsListString = () => {
+    const paymethodsList = order?.payment_events?.filter((item: any) => item.event === 'payment').map((paymethod: any) => {
+      return paymethod?.wallet_event
+        ? walletName[paymethod?.wallet_event?.wallet?.type]?.name
+        : t(paymethod?.paymethod?.gateway?.toUpperCase(), paymethod?.paymethod?.name)
+    })
+    return paymethodsList.join(', ')
+  }
+
   const orderSummary = () => {
     return `
     <div>
@@ -99,7 +118,7 @@ export const OrderSummary = ({ order, navigation, orderStatus, askBluetoothPermi
         : parseDate(order?.delivery_datetime, { utc: false })
       }
           </br>
-          ${t('PAYMENT_METHOD')}: ${order?.paymethod?.name}
+          ${paymethodsLength > 1 ? 'PAYMENT_METHODS' : 'PAYMENT_METHOD'}: ${handlePaymethodsListString()}
         </p>
 
         <h1>${t('CUSTOMER_DETAILS', 'Customer details')}</h1>
@@ -114,8 +133,8 @@ export const OrderSummary = ({ order, navigation, orderStatus, askBluetoothPermi
         } </br>`
         : ''
       }
-         ${t('FULL_ADDRESS', 'Full Addres')}: ${order?.customer?.address} 
-         </br> 
+         ${t('FULL_ADDRESS', 'Full Addres')}: ${order?.customer?.address}
+         </br>
          ${!!order?.customer?.internal_number
         ? `${t('INTERNAL_NUMBER', 'Internal Number')}: ${order?.customer?.internal_number
         } </br>`
@@ -379,10 +398,7 @@ export const OrderSummary = ({ order, navigation, orderStatus, askBluetoothPermi
                 }`}
             </OText>
 
-            <OText style={{ marginBottom: 5 }}>{`${t('PAYMENT_METHOD')}: ${t(
-              order?.paymethod?.name.toUpperCase(),
-              order?.paymethod?.name,
-            )}`}</OText>
+            <OText style={{ marginBottom: 5 }}>{`${t(`${paymethodsLength > 1 ? 'PAYMENT_METHODS' : 'PAYMENT_METHOD'}`, `${paymethodsLength > 1 ? 'Payment methods' : 'Payment method'}`)}: ${handlePaymethodsListString()}`}</OText>
           </OrderHeader>
 
           <OrderCustomer>

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

@@ -170,12 +170,12 @@ const CheckoutUI = (props: any) => {
 	const [paymethodClicked, setPaymethodClicked] = useState<any>(null)
 	const [showTitle, setShowTitle] = useState(false)
 	const [cardList, setCardList] = useState<any>({ cards: [], loading: false, error: null })
+	const [isGiftCardCart, setIsGiftCardCart] = useState(!cart?.business_id)
 	const containerRef = useRef<any>()
 	const cardsMethods = ['credomatic']
 	const stripePaymethods: any = ['stripe', 'stripe_direct', 'stripe_connect', 'stripe_redirect']
 	const placeSpotTypes = [3, 4, 5]
 	const placeSpotsEnabled = placeSpotTypes.includes(options?.type)
-	const isGiftCardCart = !cart?.business_id
 	const businessConfigs = businessDetails?.business?.configs ?? []
 	const isWalletCashEnabled = businessConfigs.find((config: any) => config.key === 'wallet_cash_enabled')?.value === '1'
 	const isWalletCreditPointsEnabled = businessConfigs.find((config: any) => config.key === 'wallet_credit_point_enabled')?.value === '1'
@@ -359,11 +359,21 @@ const CheckoutUI = (props: any) => {
 		if (cart?.products?.length === 0) {
 			if (cart?.business_id !== null) {
 				onNavigationRedirect('Business', { store: cart?.business?.slug, header: null, logo: null, fromMulti: props.fromMulti })
-			} else {
+			} else if (isGiftCardCart) {
 				onNavigationRedirect('Wallets')
 			}
 		}
-	}, [cart?.products])
+	}, [cart?.products?.length])
+
+	useEffect(() => {
+		if (cart?.products?.length > 0) {
+			if (cart?.uuid && cart?.business_id === null) {
+				setIsGiftCardCart(true)
+			} else {
+				setIsGiftCardCart(false)
+			}
+		}
+	}, [cart?.uuid, cart?.products?.length])
 
 	useEffect(() => {
 		onFailPaypal()

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

@@ -27,9 +27,9 @@ const StyledButton = styled.View<Props>`
 	padding-left: 20px;
 	padding-right: 20px;
 	position: relative;
-	${(props: any) => props?.theme?.general?.components?.buttons?.borderRadius && css`
-      border-radius: ${props?.theme?.general?.components?.buttons?.borderRadius}px;
-  `}
+	${(props: any) => props?.borderRadius && css`
+      border-radius: ${typeof props?.borderRadius === 'string' ? props?.borderRadius : `${props?.borderRadius}px`};
+  	`}
 `
 const StyledButtonDisabled = styled(StyledButton)`
 	background-color: ${(props: any) => props.theme.colors.disabled};

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

@@ -53,9 +53,9 @@ const Wrapper = styled.Pressable`
 	align-items: center;
 	justify-content: center;
 	width: 100%;
-	${(props: any) => props.theme?.general?.components?.inputs?.borderRadius && css`
-      border-radius: ${props?.theme?.general?.components?.inputs?.borderRadius};
-  `}
+	${(props: any) => props?.borderRadius && css`
+      border-radius: ${typeof props?.borderRadius === 'string' ? props?.borderRadius : `${props?.borderRadius}px`};
+  	`}
 `;
 
 const OInput = (props: Props): React.ReactElement => {
@@ -70,6 +70,7 @@ const OInput = (props: Props): React.ReactElement => {
 					? props.borderColor
 					: inputFocused ? theme.colors.primary : theme.colors.border,
 				...props.style,
+				borderRadius: parseInt(theme?.general?.components?.inputs?.borderRadius) || props.style?.borderRadius
 			}}>
 			{props.icon ? (
 				<OIcon
@@ -104,9 +105,9 @@ const OInput = (props: Props): React.ReactElement => {
 					props.forwardRef && (props.forwardRef.current = e)
 				}}
 				style={{
-          ...(theme?.general?.components?.inputs?.color && {
-            color: theme?.general?.components?.inputs?.color
-          }),
+					...(theme?.general?.components?.inputs?.color && {
+						color: theme?.general?.components?.inputs?.color
+					}),
 					...props?.inputStyle
 				}}
 				onFocus={() => setInputFocused(true)}