@propel-nsl/propel-react-native-sdk 1.1.6 → 1.2.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@propel-nsl/propel-react-native-sdk",
-  "version": "1.1.6",
+  "version": "1.2.0",
   "description": "Propel Mobile SDK - React Native Core",
   "files": [
     "src/",

package/src/screens/OrdersDetails/index.tsx

@@ -85,6 +85,10 @@ const OrderDetails: React.FC<Props> = ({ navigation, route }) => {
         return (
           <CustomImage source={Images?.pendingIcon} imgStyle={[styles.icon]} />
         );
+      case 'cancelled':
+        return (
+          <CustomImage source={Images?.redCrossIcon} imgStyle={[styles.icon]} />
+        );
       default:
         return null;
     }
@@ -106,6 +110,8 @@ const OrderDetails: React.FC<Props> = ({ navigation, route }) => {
       case 'complete':
       case 'Complete':
         return colors.green;
+      case 'cancelled':
+        return colors.red;
       default:
         return colors.orderDetailsText;
     }

package/src/screens/OtpVerification/index.tsx

@@ -128,7 +128,11 @@ const wasPhoneAlreadyVerified = useAppSelector(
     getDeviceId();
   }, []);
 
+  const isSubmitting = useRef(false);
+
   const handleVerify = async () => {
+    if (isSubmitting.current || verifyOtpLoading) return;
+    isSubmitting.current = true;
     dispatch(
       verifyMobileOtpRequest({
         client_key: "mobile_app",
@@ -143,6 +147,8 @@ const wasPhoneAlreadyVerified = useAppSelector(
         is_hppl_login: true,
       })
     );
+    // Reset guard after a short delay to allow retry on error
+    setTimeout(() => { isSubmitting.current = false; }, 1500);
   };
 
   const handleResendOTP = () => {
@@ -257,6 +263,7 @@ const wasPhoneAlreadyVerified = useAppSelector(
             title="Verify"
             onPress={handleVerify}
             disabled={otpInput.length < 4}
+            loading={verifyOtpLoading}
             customButtonContainerStyle={styles.buttonContainer}
           />
 

package/src/screens/PaymentMethod/index.tsx

@@ -84,6 +84,14 @@ const PaymentMethod: React.FC<{
     }
   }, [cartId, dispatch]);
 
+  // Reset Apply button state when screen gains focus
+  useFocusEffect(
+    useCallback(() => {
+      setShowPointsApply(false);
+      return () => {};
+    }, [])
+  );
+
 
   return (
     <View style={styles.container}>

package/src/screens/ProductDetails/styles.ts

@@ -58,6 +58,7 @@ const styles = StyleSheet.create({
     height: 12,
     justifyContent: 'center',
     alignItems: 'center',
+    overflow: 'visible',
   },
   cartBadgeText: {
     fontFamily: FontFamily.LEXEND_REGULAR,

package/src/screens/Reedem/styles.ts

@@ -63,6 +63,7 @@ const styles = StyleSheet.create({
     height: VSCALE(20),
     justifyContent: 'center',
     alignItems: 'center',
+    overflow: 'visible',
   },
   cartBadgeText: {
     fontFamily: FontFamily.LEXEND_REGULAR,

package/src-app/components/CustomButton/index.tsx

@@ -45,7 +45,7 @@ const CustomButton: React.FC<CustomButtonProps> = ({
           buttonStyle,
         ]}
         onPress={onPress}
-        disabled={disabled}
+        disabled={disabled || loading}
       >
         <View style={styles.row}>
           {loading ? (

package/src-app/components/CustomCard/index.tsx

@@ -68,6 +68,10 @@ const getStatusIcon = (status: string) => {
       return (
         <CustomImage source={Images?.pendingIcon} imgStyle={[styles.icon]} />
       );
+    case 'cancelled':
+      return (
+        <CustomImage source={Images?.redCrossIcon} imgStyle={[styles.icon]} />
+      );
     default:
       return null;
   }
@@ -83,6 +87,8 @@ const getStatusColor = (status: string) => {
       return colors.orange;
     case 'partial':
       return colors.orange;
+    case 'cancelled':
+      return colors.red;
     case 'complete':
     case 'confirmed':
       return colors.green;
@@ -100,8 +106,9 @@ const getStatusText = (status: string) => {
     case 'pending':
       return 'Pending';
     case 'partial':
-    case 'cancelled':
       return 'Partial';
+    case 'cancelled':
+      return 'Cancelled';
     case 'complete':
       return 'Complete';
     case 'confirmed':

package/src-app/components/OTPModal.tsx

@@ -1,4 +1,4 @@
-import React, { useState, useEffect } from 'react';
+import React, { useState, useEffect, useRef } from 'react';
 import {
   View,
   Text,
@@ -79,6 +79,7 @@ const OTPModal: React.FC<OTPModalProps> = ({
     if (visible) {
       setCountdown(60);
       setNewOtp('');
+      isSubmitting.current = false;
     }
   }, [visible]);
 
@@ -90,8 +91,14 @@ const OTPModal: React.FC<OTPModalProps> = ({
     return () => clearTimeout(timer);
   }, [visible, countdown]);
 
+  const isSubmitting = useRef(false);
+
   const handleVerify = () => {
+    if (isSubmitting.current || isVerifying) return;
+    isSubmitting.current = true;
     onVerify(newOtp);
+    // Reset guard after a short delay to allow retry on error
+    setTimeout(() => { isSubmitting.current = false; }, 1500);
   };
 
   const handleResendOTP = () => {