ordering-ui-react-native 0.21.29 → 0.21.31-test

package/package.json

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

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

@@ -126,46 +126,46 @@ const NewOrderNotificationUI = (props: any) => {
   }, [])
 
   useEffect(() => {
-    return () => {
-      handleCloseEvents()
-    }
+    return () => handleCloseEvents()
   }, [])
 
   return (
-    <Modal
-      animationType='slide'
-      transparent={true}
-      visible={!!currentEvent?.orderId}
-    >
-      <NotificationContainer>
-        <View style={styles.modalView}>
-          <TouchableOpacity
-            style={styles.wrapperIcon}
-            onPress={() => handleCloseEvents()}
-          >
-            <Icon name="x" size={30} />
-          </TouchableOpacity>
-          <OText
-            size={18}
-            color={theme.colors.textGray}
-            weight={600}
-          >
-            {evtList[currentEvent?.evt]?.message}
-          </OText>
-          <OIcon
-            src={theme.images.general.newOrder}
-            width={250}
-            height={200}
-          />
-          <OText
-            color={theme.colors.textGray}
-            mBottom={15}
-          >
-            {evtList[currentEvent?.evt]?.message2}
-          </OText>
-        </View>
-      </NotificationContainer>
-    </Modal>
+    <>
+      <Modal
+        animationType='slide'
+        transparent={true}
+        visible={!!currentEvent?.orderId}
+      >
+        <NotificationContainer>
+          <View style={styles.modalView}>
+            <TouchableOpacity
+              style={styles.wrapperIcon}
+              onPress={() => handleCloseEvents()}
+            >
+              <Icon name="x" size={30} />
+            </TouchableOpacity>
+            <OText
+              size={18}
+              color={theme.colors.textGray}
+              weight={600}
+            >
+              {evtList[currentEvent?.evt]?.message}
+            </OText>
+            <OIcon
+              src={theme.images.general.newOrder}
+              width={250}
+              height={200}
+            />
+            <OText
+              color={theme.colors.textGray}
+              mBottom={15}
+            >
+              {evtList[currentEvent?.evt]?.message2}
+            </OText>
+          </View>
+        </NotificationContainer>
+      </Modal>
+    </>
   )
 }
 

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

@@ -162,6 +162,7 @@ const CheckoutUI = (props: any) => {
 	const [allowedGuest, setAllowedGuest] = useState(false)
 	const [placeByMethodPay, setPlaceByMethodPay] = useState(false)
 	const [methodPaySupported, setMethodPaySupported] = useState({ enabled: false, message: null, loading: true })
+	const [paymethodClicked, setPaymethodClicked] = useState<any>(null)
 	const [cardList, setCardList] = useState<any>({ cards: [], loading: false, error: null })
 	const cardsMethods = ['credomatic']
 	const stripePaymethods: any = ['stripe', 'stripe_direct', 'stripe_connect', 'stripe_redirect']
@@ -742,6 +743,10 @@ const CheckoutUI = (props: any) => {
 									setPlaceByMethodPay={setPlaceByMethodPay}
 									cardList={cardList}
 									setCardList={setCardList}
+									requiredFields={requiredFields}
+									openUserModal={setIsOpen}
+									paymethodClicked={paymethodClicked}
+									setPaymethodClicked={setPaymethodClicked}
 								/>
 							</ChPaymethods>
 						</ChSection>
@@ -926,7 +931,14 @@ const CheckoutUI = (props: any) => {
 								handlePlaceOrderAsGuest={handlePlaceOrderAsGuest}
 								onClose={() => {
 									setIsOpen(false)
-									handlePlaceOrder(null, true)
+									if (paymethodClicked) {
+										setPaymethodClicked({
+											...paymethodClicked,
+											confirmed: true
+										})
+									} else {
+										handlePlaceOrder(null, true)
+									}
 								}}
 								setIsOpen={setIsOpen}
 							/>

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

@@ -69,7 +69,11 @@ const PaymentOptionsUI = (props: any) => {
 		methodPaySupported,
 		setPlaceByMethodPay,
 		setCardList,
-		onPaymentChange
+		onPaymentChange,
+		requiredFields,
+		openUserModal,
+		paymethodClicked,
+		setPaymethodClicked
 	} = props
 
 	const theme = useTheme();
@@ -115,6 +119,14 @@ const PaymentOptionsUI = (props: any) => {
 
 	const handlePaymentMethodClick = (paymethod: any) => {
 		if (cart?.balance > 0) {
+			if (paymethod?.gateway === 'paypal' && requiredFields.length > 0) {
+				openUserModal && openUserModal(true)
+				setPaymethodClicked({
+					confirmed: false,
+					paymethod
+				})
+				return
+			}
 			const isPopupMethod = ['stripe', 'stripe_direct', 'stripe_connect', 'stripe_redirect', 'paypal'].includes(paymethod?.gateway)
 			if (webViewPaymentGateway.includes(paymethod?.gateway)) {
 				handlePaymentMethodClickCustom(paymethod)
@@ -159,7 +171,14 @@ const PaymentOptionsUI = (props: any) => {
 			handlePlaceOrder(confirmApplePayPayment)
 		}
 	}, [paymethodData, paymethodSelected])
-	
+
+	useEffect(() => {
+		if (paymethodClicked?.confirmed) {
+			handlePaymentMethodClickCustom(paymethodClicked?.paymethod)
+		}
+	}, [paymethodClicked?.confirmed])
+
+
 	const renderPaymethods = ({ item }: any) => {
 		return (
 			<>