@reown/appkit-react-native 0.0.0-feat-multichain-20250724181758 → 0.0.0-feat-multichain-20250725133522

package/lib/module/views/w3m-onramp-view/components/PaymentButton.js

@@ -0,0 +1,103 @@
+import { BorderRadius, FlexView, Icon, Image, LoadingSpinner, Pressable, Spacing, Text, useTheme } from '@reown/appkit-ui-react-native';
+import { StyleSheet, View } from 'react-native';
+function PaymentButton({
+  disabled,
+  loading,
+  title,
+  subtitle,
+  paymentLogo,
+  providerLogo,
+  onPress,
+  testID
+}) {
+  const Theme = useTheme();
+  const backgroundColor = Theme['gray-glass-005'];
+  return /*#__PURE__*/React.createElement(Pressable, {
+    disabled: disabled || loading,
+    onPress: onPress,
+    style: styles.pressable,
+    testID: testID
+  }, /*#__PURE__*/React.createElement(FlexView, {
+    style: [styles.container, {
+      backgroundColor
+    }],
+    alignItems: "center",
+    justifyContent: "space-between",
+    flexDirection: "row"
+  }, /*#__PURE__*/React.createElement(FlexView, {
+    alignItems: "center",
+    justifyContent: "center",
+    style: [styles.iconContainer, {
+      backgroundColor: Theme['bg-300']
+    }]
+  }, paymentLogo ? /*#__PURE__*/React.createElement(Image, {
+    source: paymentLogo,
+    style: styles.paymentLogo,
+    resizeMethod: "resize",
+    resizeMode: "contain"
+  }) : /*#__PURE__*/React.createElement(Icon, {
+    name: "card",
+    size: "lg"
+  })), /*#__PURE__*/React.createElement(FlexView, {
+    flexGrow: 1,
+    flexDirection: "column",
+    alignItems: "flex-start",
+    margin: ['0', '0', '0', 's']
+  }, /*#__PURE__*/React.createElement(Text, {
+    variant: "paragraph-400",
+    color: "fg-100"
+  }, title), subtitle && /*#__PURE__*/React.createElement(FlexView, {
+    flexDirection: "row",
+    alignItems: "center",
+    margin: ['4xs', '0', '0', '0']
+  }, providerLogo && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Text, {
+    variant: "small-400",
+    color: "fg-150"
+  }, "via"), /*#__PURE__*/React.createElement(Image, {
+    source: providerLogo,
+    style: styles.providerLogo,
+    resizeMethod: "resize",
+    resizeMode: "contain"
+  })), /*#__PURE__*/React.createElement(Text, {
+    variant: "small-400",
+    color: "fg-150"
+  }, subtitle))), loading ? /*#__PURE__*/React.createElement(LoadingSpinner, {
+    size: "md",
+    color: "fg-200",
+    style: styles.rightIcon
+  }) : disabled ? /*#__PURE__*/React.createElement(View, null) : /*#__PURE__*/React.createElement(Icon, {
+    name: "chevronRight",
+    size: "md",
+    color: "fg-200",
+    style: styles.rightIcon
+  })));
+}
+const styles = StyleSheet.create({
+  pressable: {
+    borderRadius: BorderRadius.xs
+  },
+  container: {
+    padding: Spacing.s,
+    borderRadius: BorderRadius.xs
+  },
+  iconContainer: {
+    height: 40,
+    width: 40,
+    borderRadius: BorderRadius['3xs']
+  },
+  paymentLogo: {
+    height: 24,
+    width: 24
+  },
+  providerLogo: {
+    height: 16,
+    width: 16,
+    marginHorizontal: Spacing['4xs'],
+    borderRadius: BorderRadius['5xs']
+  },
+  rightIcon: {
+    marginRight: Spacing.xs
+  }
+});
+export default PaymentButton;
+//# sourceMappingURL=PaymentButton.js.map

package/lib/module/views/w3m-onramp-view/components/PaymentButton.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["BorderRadius","FlexView","Icon","Image","LoadingSpinner","Pressable","Spacing","Text","useTheme","StyleSheet","View","PaymentButton","disabled","loading","title","subtitle","paymentLogo","providerLogo","onPress","testID","Theme","backgroundColor","React","createElement","style","styles","pressable","container","alignItems","justifyContent","flexDirection","iconContainer","source","resizeMethod","resizeMode","name","size","flexGrow","margin","variant","color","Fragment","rightIcon","create","borderRadius","xs","padding","s","height","width","marginHorizontal","marginRight"],"sourceRoot":"../../../../../src","sources":["views/w3m-onramp-view/components/PaymentButton.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/views/w3m-onramp-view/components/PaymentMethod.js

@@ -2,7 +2,7 @@ import { useSnapshot } from 'valtio';
 import { ThemeController } from '@reown/appkit-core-react-native';
 import { Pressable, FlexView, Spacing, Text, useTheme, Image, BorderRadius, IconBox } from '@reown/appkit-ui-react-native';
 import { StyleSheet } from 'react-native';
-export const ITEM_SIZE = 85;
+export const ITEM_SIZE = 100;
 export function PaymentMethod({
   onPress,
   item,
@@ -33,7 +33,7 @@ export function PaymentMethod({
     source: item.logos[themeMode ?? 'light'],
     style: styles.logo,
     resizeMethod: "resize",
-    resizeMode: "center"
+    resizeMode: "contain"
   }), selected && /*#__PURE__*/React.createElement(IconBox, {
     icon: "checkmark",
     size: "sm",
@@ -45,15 +45,14 @@ export function PaymentMethod({
   })), /*#__PURE__*/React.createElement(Text, {
     variant: "tiny-400",
     color: "fg-100",
-    numberOfLines: 1,
+    numberOfLines: 2,
     style: styles.text
   }, item.name));
 }
 const styles = StyleSheet.create({
   container: {
     height: ITEM_SIZE,
-    width: ITEM_SIZE,
-    justifyContent: 'center',
+    width: 85,
     alignItems: 'center'
   },
   logoContainer: {
@@ -63,8 +62,8 @@ const styles = StyleSheet.create({
     marginBottom: Spacing['4xs']
   },
   logo: {
-    width: 22,
-    height: 22
+    width: 26,
+    height: 26
   },
   checkmark: {
     borderRadius: BorderRadius.full,
@@ -73,7 +72,9 @@ const styles = StyleSheet.create({
     right: -10
   },
   text: {
-    marginTop: Spacing.xs
+    marginTop: Spacing.xs,
+    paddingHorizontal: Spacing['3xs'],
+    textAlign: 'center'
   }
 });
 //# sourceMappingURL=PaymentMethod.js.map

package/lib/module/views/w3m-onramp-view/components/PaymentMethod.js.map

@@ -1 +1 @@
-{"version":3,"names":["useSnapshot","ThemeController","Pressable","FlexView","Spacing","Text","useTheme","Image","BorderRadius","IconBox","StyleSheet","ITEM_SIZE","PaymentMethod","onPress","item","selected","testID","Theme","themeMode","state","handlePress","React","createElement","bounceScale","style","styles","container","transparent","pressable","logoContainer","backgroundColor","alignItems","justifyContent","source","logos","logo","resizeMethod","resizeMode","icon","size","background","iconColor","checkmark","variant","color","numberOfLines","text","name","create","height","width","borderRadius","full","marginBottom","position","bottom","right","marginTop","xs"],"sourceRoot":"../../../../../src","sources":["views/w3m-onramp-view/components/PaymentMethod.tsx"],"mappings":"AAAA,SAASA,WAAW,QAAQ,QAAQ;AACpC,SAASC,eAAe,QAAkC,iCAAiC;AAC3F,SACEC,SAAS,EACTC,QAAQ,EACRC,OAAO,EACPC,IAAI,EACJC,QAAQ,EACRC,KAAK,EACLC,YAAY,EACZC,OAAO,QACF,+BAA+B;AACtC,SAASC,UAAU,QAAQ,cAAc;AAEzC,OAAO,MAAMC,SAAS,GAAG,EAAE;AAS3B,OAAO,SAASC,aAAaA,CAAC;EAAEC,OAAO;EAAEC,IAAI;EAAEC,QAAQ;EAAEC;AAAc,CAAC,EAAE;EACxE,MAAMC,KAAK,GAAGX,QAAQ,CAAC,CAAC;EACxB,MAAM;IAAEY;EAAU,CAAC,GAAGlB,WAAW,CAACC,eAAe,CAACkB,KAAK,CAAC;EAExD,MAAMC,WAAW,GAAGA,CAAA,KAAM;IACxBP,OAAO,CAACC,IAAI,CAAC;EACf,CAAC;EAED,oBACEO,KAAA,CAAAC,aAAA,CAACpB,SAAS;IACRW,OAAO,EAAEO,WAAY;IACrBG,WAAW,EAAE,IAAK;IAClBC,KAAK,EAAEC,MAAM,CAACC,SAAU;IACxBC,WAAW;IACXC,SAAS,EAAE,CAACb,QAAS;IACrBC,MAAM,EAAEA;EAAO,gBAEfK,KAAA,CAAAC,aAAA,CAACnB,QAAQ;IACPqB,KAAK,EAAE,CAACC,MAAM,CAACI,aAAa,EAAE;MAAEC,eAAe,EAAEb,KAAK,CAAC,gBAAgB;IAAE,CAAC,CAAE;IAC5Ec,UAAU,EAAC,QAAQ;IACnBC,cAAc,EAAC;EAAQ,gBAEvBX,KAAA,CAAAC,aAAA,CAACf,KAAK;IACJ0B,MAAM,EAAEnB,IAAI,CAACoB,KAAK,CAAChB,SAAS,IAAI,OAAO,CAAE;IACzCM,KAAK,EAAEC,MAAM,CAACU,IAAK;IACnBC,YAAY,EAAC,QAAQ;IACrBC,UAAU,EAAC;EAAQ,CACpB,CAAC,EACDtB,QAAQ,iBACPM,KAAA,CAAAC,aAAA,CAACb,OAAO;IACN6B,IAAI,EAAC,WAAW;IAChBC,IAAI,EAAC,IAAI;IACTC,UAAU;IACVV,eAAe,EAAC,YAAY;IAC5BW,SAAS,EAAC,aAAa;IACvBjB,KAAK,EAAEC,MAAM,CAACiB,SAAU;IACxB1B,MAAM,EAAC;EAA0B,CAClC,CAEK,CAAC,eACXK,KAAA,CAAAC,aAAA,CAACjB,IAAI;IAACsC,OAAO,EAAC,UAAU;IAACC,KAAK,EAAC,QAAQ;IAACC,aAAa,EAAE,CAAE;IAACrB,KAAK,EAAEC,MAAM,CAACqB;EAAK,GAC1EhC,IAAI,CAACiC,IACF,CACG,CAAC;AAEhB;AAEA,MAAMtB,MAAM,GAAGf,UAAU,CAACsC,MAAM,CAAC;EAC/BtB,SAAS,EAAE;IACTuB,MAAM,EAAEtC,SAAS;IACjBuC,KAAK,EAAEvC,SAAS;IAChBqB,cAAc,EAAE,QAAQ;IACxBD,UAAU,EAAE;EACd,CAAC;EACDF,aAAa,EAAE;IACbqB,KAAK,EAAE,EAAE;IACTD,MAAM,EAAE,EAAE;IACVE,YAAY,EAAE3C,YAAY,CAAC4C,IAAI;IAC/BC,YAAY,EAAEjD,OAAO,CAAC,KAAK;EAC7B,CAAC;EACD+B,IAAI,EAAE;IACJe,KAAK,EAAE,EAAE;IACTD,MAAM,EAAE;EACV,CAAC;EACDP,SAAS,EAAE;IACTS,YAAY,EAAE3C,YAAY,CAAC4C,IAAI;IAC/BE,QAAQ,EAAE,UAAU;IACpBC,MAAM,EAAE,CAAC;IACTC,KAAK,EAAE,CAAC;EACV,CAAC;EACDV,IAAI,EAAE;IACJW,SAAS,EAAErD,OAAO,CAACsD;EACrB;AACF,CAAC,CAAC"}
+{"version":3,"names":["useSnapshot","ThemeController","Pressable","FlexView","Spacing","Text","useTheme","Image","BorderRadius","IconBox","StyleSheet","ITEM_SIZE","PaymentMethod","onPress","item","selected","testID","Theme","themeMode","state","handlePress","React","createElement","bounceScale","style","styles","container","transparent","pressable","logoContainer","backgroundColor","alignItems","justifyContent","source","logos","logo","resizeMethod","resizeMode","icon","size","background","iconColor","checkmark","variant","color","numberOfLines","text","name","create","height","width","borderRadius","full","marginBottom","position","bottom","right","marginTop","xs","paddingHorizontal","textAlign"],"sourceRoot":"../../../../../src","sources":["views/w3m-onramp-view/components/PaymentMethod.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/views/w3m-onramp-view/components/Quote.js

@@ -7,14 +7,16 @@ export function Quote({
   logoURL,
   onQuotePress,
   selected,
-  tagText
+  tagText,
+  testID
 }) {
   const Theme = useTheme();
   return /*#__PURE__*/React.createElement(Pressable, {
     style: [styles.container, selected && {
       borderColor: Theme['accent-100']
     }],
-    onPress: () => onQuotePress(item)
+    onPress: () => onQuotePress(item),
+    testID: testID
   }, /*#__PURE__*/React.createElement(FlexView, {
     justifyContent: "space-between",
     alignItems: "center",
@@ -46,7 +48,7 @@ export function Quote({
     style: styles.tag
   }, tagText)), /*#__PURE__*/React.createElement(Text, {
     variant: "tiny-500"
-  }, NumberUtil.roundNumber(item.destinationAmount, 6, 5), " ", item.destinationCurrencyCode))), selected && /*#__PURE__*/React.createElement(Icon, {
+  }, NumberUtil.roundNumber(item.destinationAmount, 6, 5), ' ', item.destinationCurrencyCode?.split('_')[0]))), selected && /*#__PURE__*/React.createElement(Icon, {
     name: "checkmark",
     color: "accent-100"
   })));

package/lib/module/views/w3m-onramp-view/components/Quote.js.map

@@ -1 +1 @@
-{"version":3,"names":["NumberUtil","FlexView","Image","Spacing","Text","Tag","useTheme","BorderRadius","Icon","Pressable","StyleSheet","ITEM_HEIGHT","Quote","item","logoURL","onQuotePress","selected","tagText","Theme","React","createElement","style","styles","container","borderColor","onPress","justifyContent","alignItems","flexDirection","padding","source","logo","backgroundColor","margin","variant","providerText","serviceProvider","toLowerCase","tag","roundNumber","destinationAmount","destinationCurrencyCode","name","color","create","borderRadius","xs","borderWidth","height","width","marginRight","textTransform","marginLeft"],"sourceRoot":"../../../../../src","sources":["views/w3m-onramp-view/components/Quote.tsx"],"mappings":"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"}
+{"version":3,"names":["NumberUtil","FlexView","Image","Spacing","Text","Tag","useTheme","BorderRadius","Icon","Pressable","StyleSheet","ITEM_HEIGHT","Quote","item","logoURL","onQuotePress","selected","tagText","testID","Theme","React","createElement","style","styles","container","borderColor","onPress","justifyContent","alignItems","flexDirection","padding","source","logo","backgroundColor","margin","variant","providerText","serviceProvider","toLowerCase","tag","roundNumber","destinationAmount","destinationCurrencyCode","split","name","color","create","borderRadius","xs","borderWidth","height","width","marginRight","textTransform","marginLeft"],"sourceRoot":"../../../../../src","sources":["views/w3m-onramp-view/components/Quote.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/views/w3m-onramp-view/components/SelectPaymentModal.js

@@ -1,12 +1,12 @@
+/* eslint-disable valtio/state-snapshot-rule */
 import { useSnapshot } from 'valtio';
-import { useRef, useState, useMemo } from 'react';
+import { useRef, useState, useMemo, useEffect } from 'react';
 import Modal from 'react-native-modal';
-import { Dimensions, FlatList, StyleSheet, View } from 'react-native';
-import { FlexView, IconLink, Spacing, Text, useTheme, Separator, LoadingSpinner, BorderRadius } from '@reown/appkit-ui-react-native';
+import { FlatList, StyleSheet, View } from 'react-native';
+import { FlexView, IconLink, Spacing, Text, useTheme, Separator, BorderRadius } from '@reown/appkit-ui-react-native';
 import { OnRampController } from '@reown/appkit-core-react-native';
-import { Placeholder } from '../../../partials/w3m-placeholder';
 import { Quote, ITEM_HEIGHT as QUOTE_ITEM_HEIGHT } from './Quote';
-import { PaymentMethod, ITEM_SIZE } from './PaymentMethod';
+import { PaymentMethod } from './PaymentMethod';
 const SEPARATOR_HEIGHT = Spacing.s;
 export function SelectPaymentModal({
   title,
@@ -16,18 +16,24 @@ export function SelectPaymentModal({
   const Theme = useTheme();
   const {
     selectedQuote,
-    quotes
+    quotes,
+    selectedPaymentMethod
   } = useSnapshot(OnRampController.state);
   const paymentMethodsRef = useRef(null);
   const [paymentMethods, setPaymentMethods] = useState(OnRampController.state.paymentMethods);
+  const [activePaymentMethod, setActivePaymentMethod] = useState(OnRampController.state.selectedPaymentMethod);
+  const availablePaymentMethods = useMemo(() => {
+    return paymentMethods.filter(paymentMethod => quotes?.some(quote => quote.paymentMethodType === paymentMethod.paymentMethod));
+  }, [paymentMethods, quotes]);
+  const availableQuotes = useMemo(() => {
+    return quotes?.filter(quote => activePaymentMethod?.paymentMethod === quote.paymentMethodType);
+  }, [quotes, activePaymentMethod]);
   const sortedQuotes = useMemo(() => {
-    if (!selectedQuote) {
-      return quotes;
+    if (!selectedQuote || selectedQuote.paymentMethodType !== activePaymentMethod?.paymentMethod) {
+      return availableQuotes;
     }
-    return [selectedQuote,
-    // eslint-disable-next-line valtio/state-snapshot-rule
-    ...(quotes?.filter(quote => quote.serviceProvider !== selectedQuote.serviceProvider) ?? [])];
-  }, [quotes, selectedQuote]);
+    return [selectedQuote, ...(availableQuotes?.filter(quote => quote.serviceProvider !== selectedQuote.serviceProvider) ?? [])];
+  }, [availableQuotes, selectedQuote, activePaymentMethod]);
   const renderSeparator = () => {
     return /*#__PURE__*/React.createElement(View, {
       style: {
@@ -36,72 +42,53 @@ export function SelectPaymentModal({
     });
   };
   const handleQuotePress = quote => {
-    if (quote.serviceProvider !== OnRampController.state.selectedQuote?.serviceProvider) {
+    if (activePaymentMethod) {
+      OnRampController.clearError();
       OnRampController.setSelectedQuote(quote);
+      OnRampController.setSelectedPaymentMethod(activePaymentMethod);
     }
     onClose();
   };
   const handlePaymentMethodPress = paymentMethod => {
-    if (paymentMethod.paymentMethod !== OnRampController.state.selectedPaymentMethod?.paymentMethod) {
-      OnRampController.setSelectedPaymentMethod(paymentMethod);
-    }
-    const visibleItemsCount = Math.round(Dimensions.get('window').width / ITEM_SIZE);
-
-    // Switch payment method to the top if there are more than visibleItemsCount payment methods
-    if (OnRampController.state.paymentMethods.length > visibleItemsCount) {
-      const paymentIndex = paymentMethods.findIndex(method => method.paymentMethod === paymentMethod.paymentMethod);
-
-      // Switch payment if its not visible
-      if (paymentIndex + 1 > visibleItemsCount - 1) {
-        const realIndex = OnRampController.state.paymentMethods.findIndex(method => method.paymentMethod === paymentMethod.paymentMethod);
-        const newPaymentMethods = [paymentMethod, ...OnRampController.state.paymentMethods.slice(0, realIndex), ...OnRampController.state.paymentMethods.slice(realIndex + 1)];
-        setPaymentMethods(newPaymentMethods);
-      }
-    }
-    paymentMethodsRef.current?.scrollToIndex({
-      index: 0,
-      animated: true
-    });
+    setActivePaymentMethod(paymentMethod);
   };
   const renderQuote = ({
-    item
+    item,
+    index
   }) => {
     const logoURL = OnRampController.getServiceProviderImage(item.serviceProvider);
-    const selected = item.serviceProvider === OnRampController.state.selectedQuote?.serviceProvider;
-    const isBestDeal = OnRampController.state.quotes?.findIndex(quote => quote.serviceProvider === item.serviceProvider) === 0;
-    const tagText = isBestDeal ? 'Best Deal' : item.lowKyc ? 'Low KYC' : undefined;
+    const isSelected = item.serviceProvider === OnRampController.state.selectedQuote?.serviceProvider && item.paymentMethodType === OnRampController.state.selectedQuote?.paymentMethodType;
+    const isRecommended = availableQuotes?.findIndex(quote => quote.serviceProvider === item.serviceProvider) === 0 && availableQuotes?.length > 1;
+    const tagText = isRecommended ? 'Recommended' : item.lowKyc ? 'Low KYC' : undefined;
     return /*#__PURE__*/React.createElement(Quote, {
       item: item,
-      selected: selected,
+      selected: isSelected,
       logoURL: logoURL,
       onQuotePress: () => handleQuotePress(item),
-      tagText: tagText
-    });
-  };
-  const renderEmpty = () => {
-    return OnRampController.state.quotesLoading ? /*#__PURE__*/React.createElement(FlexView, {
-      alignItems: "center",
-      justifyContent: "center",
-      padding: "2xl",
-      style: styles.emptyContainer
-    }, /*#__PURE__*/React.createElement(LoadingSpinner, null)) : /*#__PURE__*/React.createElement(Placeholder, {
-      title: "No providers available",
-      description: "Please select a different payment method or increase the amount",
-      icon: "warningCircle"
+      tagText: tagText,
+      testID: `quote-item-${index}`
     });
   };
   const renderPaymentMethod = ({
     item
   }) => {
     const parsedItem = item;
-    const selected = parsedItem.paymentMethod === OnRampController.state.selectedPaymentMethod?.paymentMethod;
+    const isSelected = parsedItem.paymentMethod === activePaymentMethod?.paymentMethod;
     return /*#__PURE__*/React.createElement(PaymentMethod, {
       item: parsedItem,
       onPress: () => handlePaymentMethodPress(parsedItem),
-      selected: selected,
+      selected: isSelected,
       testID: `payment-method-item-${parsedItem.paymentMethod}`
     });
   };
+  useEffect(() => {
+    if (visible && OnRampController.state.selectedPaymentMethod) {
+      const methods = [OnRampController.state.selectedPaymentMethod, ...OnRampController.state.paymentMethods.filter(m => m.paymentMethod !== OnRampController.state.selectedPaymentMethod?.paymentMethod)];
+      //Update payment methods order
+      setPaymentMethods(methods);
+      setActivePaymentMethod(OnRampController.state.selectedPaymentMethod);
+    }
+  }, [visible]);
   return /*#__PURE__*/React.createElement(Modal, {
     isVisible: visible,
     useNativeDriver: true,
@@ -133,7 +120,7 @@ export function SelectPaymentModal({
     color: "fg-150",
     style: styles.subtitle
   }, "Pay with"), /*#__PURE__*/React.createElement(FlexView, null, /*#__PURE__*/React.createElement(FlatList, {
-    data: paymentMethods,
+    data: availablePaymentMethods,
     renderItem: renderPaymentMethod,
     ref: paymentMethodsRef,
     style: styles.paymentMethodsContainer,
@@ -153,10 +140,10 @@ export function SelectPaymentModal({
     data: sortedQuotes,
     bounces: false,
     renderItem: renderQuote,
+    extraData: selectedPaymentMethod,
     contentContainerStyle: styles.listContent,
     ItemSeparatorComponent: renderSeparator,
     fadingEdgeLength: 20,
-    ListEmptyComponent: renderEmpty,
     keyExtractor: item => `${item.serviceProvider}-${item.paymentMethodType}`,
     getItemLayout: (_, index) => ({
       length: QUOTE_ITEM_HEIGHT + SEPARATOR_HEIGHT,

package/lib/module/views/w3m-onramp-view/components/SelectPaymentModal.js.map

@@ -1 +1 @@
-{"version":3,"names":["useSnapshot","useRef","useState","useMemo","Modal","Dimensions","FlatList","StyleSheet","View","FlexView","IconLink","Spacing","Text","useTheme","Separator","LoadingSpinner","BorderRadius","OnRampController","Placeholder","Quote","ITEM_HEIGHT","QUOTE_ITEM_HEIGHT","PaymentMethod","ITEM_SIZE","SEPARATOR_HEIGHT","s","SelectPaymentModal","title","visible","onClose","Theme","selectedQuote","quotes","state","paymentMethodsRef","paymentMethods","setPaymentMethods","sortedQuotes","filter","quote","serviceProvider","renderSeparator","React","createElement","style","height","handleQuotePress","setSelectedQuote","handlePaymentMethodPress","paymentMethod","selectedPaymentMethod","setSelectedPaymentMethod","visibleItemsCount","Math","round","get","width","length","paymentIndex","findIndex","method","realIndex","newPaymentMethods","slice","current","scrollToIndex","index","animated","renderQuote","item","logoURL","getServiceProviderImage","selected","isBestDeal","tagText","lowKyc","undefined","onQuotePress","renderEmpty","quotesLoading","alignItems","justifyContent","padding","styles","emptyContainer","description","icon","renderPaymentMethod","parsedItem","onPress","testID","isVisible","useNativeDriver","useNativeDriverForBackdrop","statusBarTranslucent","hideModalContentWhileAnimating","onBackdropPress","onDismiss","modal","container","backgroundColor","flexDirection","header","variant","iconPlaceholder","color","subtitle","data","renderItem","ref","paymentMethodsContainer","contentContainerStyle","paymentMethodsContent","fadingEdgeLength","keyExtractor","horizontal","showsHorizontalScrollIndicator","separator","bounces","listContent","ItemSeparatorComponent","ListEmptyComponent","paymentMethodType","getItemLayout","_","offset","create","margin","marginBottom","l","paddingHorizontal","m","paddingTop","borderTopLeftRadius","borderTopRightRadius","marginVertical","marginHorizontal","paddingBottom","xs","paddingLeft"],"sourceRoot":"../../../../../src","sources":["views/w3m-onramp-view/components/SelectPaymentModal.tsx"],"mappings":"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"}
+{"version":3,"names":["useSnapshot","useRef","useState","useMemo","useEffect","Modal","FlatList","StyleSheet","View","FlexView","IconLink","Spacing","Text","useTheme","Separator","BorderRadius","OnRampController","Quote","ITEM_HEIGHT","QUOTE_ITEM_HEIGHT","PaymentMethod","SEPARATOR_HEIGHT","s","SelectPaymentModal","title","visible","onClose","Theme","selectedQuote","quotes","selectedPaymentMethod","state","paymentMethodsRef","paymentMethods","setPaymentMethods","activePaymentMethod","setActivePaymentMethod","availablePaymentMethods","filter","paymentMethod","some","quote","paymentMethodType","availableQuotes","sortedQuotes","serviceProvider","renderSeparator","React","createElement","style","height","handleQuotePress","clearError","setSelectedQuote","setSelectedPaymentMethod","handlePaymentMethodPress","renderQuote","item","index","logoURL","getServiceProviderImage","isSelected","isRecommended","findIndex","length","tagText","lowKyc","undefined","selected","onQuotePress","testID","renderPaymentMethod","parsedItem","onPress","methods","m","isVisible","useNativeDriver","useNativeDriverForBackdrop","statusBarTranslucent","hideModalContentWhileAnimating","onBackdropPress","onDismiss","styles","modal","container","backgroundColor","alignItems","justifyContent","flexDirection","header","icon","variant","iconPlaceholder","color","subtitle","data","renderItem","ref","paymentMethodsContainer","contentContainerStyle","paymentMethodsContent","fadingEdgeLength","keyExtractor","horizontal","showsHorizontalScrollIndicator","separator","bounces","extraData","listContent","ItemSeparatorComponent","getItemLayout","_","offset","create","margin","marginBottom","l","paddingHorizontal","paddingTop","borderTopLeftRadius","borderTopRightRadius","width","marginVertical","marginHorizontal","paddingBottom","xs","emptyContainer","paddingLeft"],"sourceRoot":"../../../../../src","sources":["views/w3m-onramp-view/components/SelectPaymentModal.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/views/w3m-onramp-view/index.js

@@ -2,17 +2,16 @@ import { useSnapshot } from 'valtio';
 import { memo, useCallback, useEffect, useState } from 'react';
 import { ScrollView } from 'react-native';
 import { OnRampController, ThemeController, RouterController, SnackController, ConstantsUtil, ConnectionsController, AssetController } from '@reown/appkit-core-react-native';
-import { Button, FlexView, Image, ListItem, Text, TokenButton, useTheme } from '@reown/appkit-ui-react-native';
+import { Button, FlexView, Image, Text, TokenButton, useTheme } from '@reown/appkit-ui-react-native';
 import { NumberUtil, StringUtil } from '@reown/appkit-common-react-native';
 import { SelectorModal } from '../../partials/w3m-selector-modal';
-import { Currency } from './components/Currency';
-import { getPurchaseCurrencies, getCurrencySuggestedValues } from './utils';
+import { Currency, ITEM_HEIGHT as CURRENCY_ITEM_HEIGHT } from './components/Currency';
+import { getPurchaseCurrencies, getQuotesDebounced } from './utils';
 import { CurrencyInput } from './components/CurrencyInput';
 import { SelectPaymentModal } from './components/SelectPaymentModal';
-import { ITEM_HEIGHT as CURRENCY_ITEM_HEIGHT } from './components/Currency';
 import { Header } from './components/Header';
-import { UiUtil } from '../../utils/UiUtil';
 import { LoadingView } from './components/LoadingView';
+import PaymentButton from './components/PaymentButton';
 import styles from './styles';
 const MemoizedCurrency = /*#__PURE__*/memo(Currency);
 export function OnRampView() {
@@ -23,10 +22,10 @@ export function OnRampView() {
   const {
     purchaseCurrency,
     paymentCurrency,
-    paymentMethods,
     selectedPaymentMethod,
     paymentAmount,
     quotesLoading,
+    quotes,
     selectedQuote,
     error,
     loading,
@@ -41,8 +40,6 @@ export function OnRampView() {
   const [searchValue, setSearchValue] = useState('');
   const [isCurrencyModalVisible, setIsCurrencyModalVisible] = useState(false);
   const [isPaymentMethodModalVisible, setIsPaymentMethodModalVisible] = useState(false);
-  const providerImage = OnRampController.getServiceProviderImage(selectedQuote?.serviceProvider);
-  const suggestedValues = getCurrencySuggestedValues(paymentCurrency);
   const purchaseCurrencyCode = purchaseCurrency?.currencyCode?.split('_')[0] ?? purchaseCurrency?.currencyCode;
   const networkImage = activeNetwork ? networkImages[activeNetwork.id] : undefined;
   const getQuotes = useCallback(() => {
@@ -50,20 +47,33 @@ export function OnRampView() {
       OnRampController.getQuotes();
     }
   }, []);
-  const getProviderButtonText = () => {
-    if (selectedQuote) {
-      return 'via ';
+  const getPaymentButtonTitle = () => {
+    if (selectedPaymentMethod) {
+      return selectedPaymentMethod.name;
+    }
+    if (quotesLoading) {
+      return 'Loading quotes';
+    }
+    if (!paymentAmount || quotes?.length === 0) {
+      return 'Enter a valid amount';
     }
-    if (!paymentAmount) {
-      return 'Enter an amount';
+    return '';
+  };
+  const getPaymentButtonSubtitle = () => {
+    if (selectedQuote) {
+      return StringUtil.capitalize(selectedQuote?.serviceProvider);
     }
-    if (!paymentMethods?.length) {
-      return 'No payment methods available';
+    if (selectedPaymentMethod) {
+      if (quotesLoading) {
+        return 'Loading quotes';
+      }
+      if (!paymentAmount || quotes?.length === 0) {
+        return 'Enter a valid amount';
+      }
     }
-    return 'Select a provider';
+    return undefined;
   };
   const onValueChange = value => {
-    UiUtil.animateChange();
     if (!value) {
       OnRampController.abortGetQuotes();
       OnRampController.setPaymentAmount(0);
@@ -72,12 +82,7 @@ export function OnRampView() {
       return;
     }
     OnRampController.setPaymentAmount(value);
-    OnRampController.getQuotesDebounced();
-  };
-  const onSuggestedValuePress = value => {
-    UiUtil.animateChange();
-    OnRampController.setPaymentAmount(value);
-    getQuotes();
+    getQuotesDebounced();
   };
   const handleSearch = value => {
     setSearchValue(value);
@@ -111,9 +116,6 @@ export function OnRampView() {
     setIsCurrencyModalVisible(false);
     setIsPaymentMethodModalVisible(false);
   };
-  useEffect(() => {
-    getQuotes();
-  }, [selectedPaymentMethod, getQuotes]);
   useEffect(() => {
     if (error?.type === ConstantsUtil.ONRAMP_ERROR_TYPES.FAILED_TO_LOAD) {
       SnackController.showInternalError({
@@ -161,43 +163,21 @@ export function OnRampView() {
     value: paymentAmount?.toString(),
     symbol: paymentCurrency?.currencyCode,
     error: error?.message,
-    suggestedValues: suggestedValues,
-    onSuggestedValuePress: onSuggestedValuePress,
     isAmountError: error?.type === ConstantsUtil.ONRAMP_ERROR_TYPES.AMOUNT_TOO_LOW || error?.type === ConstantsUtil.ONRAMP_ERROR_TYPES.AMOUNT_TOO_HIGH || error?.type === ConstantsUtil.ONRAMP_ERROR_TYPES.INVALID_AMOUNT,
     loading: loading || quotesLoading,
     purchaseValue: `${selectedQuote?.destinationAmount ? NumberUtil.roundNumber(selectedQuote.destinationAmount, 6, 5)?.toString() : '0.00'} ${purchaseCurrencyCode ?? ''}`,
     onValueChange: onValueChange,
     style: styles.currencyInput
-  }), /*#__PURE__*/React.createElement(ListItem, {
-    chevron: true,
-    backgroundColor: "gray-glass-005",
+  }), /*#__PURE__*/React.createElement(PaymentButton, {
+    title: getPaymentButtonTitle(),
+    subtitle: getPaymentButtonSubtitle(),
+    paymentLogo: selectedPaymentMethod?.logos[themeMode ?? 'light'],
+    providerLogo: OnRampController.getServiceProviderImage(selectedQuote?.serviceProvider),
+    disabled: !paymentAmount || quotes?.length === 0,
     loading: quotesLoading || loading,
     onPress: () => setIsPaymentMethodModalVisible(true),
-    style: styles.paymentMethodButton,
-    imageSrc: selectedPaymentMethod?.logos[themeMode ?? 'light'],
-    imageStyle: styles.paymentMethodImage,
-    imageContainerStyle: [styles.paymentMethodImageContainer, {
-      backgroundColor: Theme['gray-glass-010']
-    }],
-    disabled: !selectedPaymentMethod || !paymentAmount,
     testID: "payment-method-button"
-  }, /*#__PURE__*/React.createElement(FlexView, null, selectedPaymentMethod?.name && /*#__PURE__*/React.createElement(Text, {
-    variant: "paragraph-400",
-    color: "fg-100"
-  }, selectedPaymentMethod.name), getProviderButtonText() && /*#__PURE__*/React.createElement(FlexView, {
-    flexDirection: "row",
-    alignItems: "center",
-    margin: ['3xs', '0', '0', '0']
-  }, /*#__PURE__*/React.createElement(Text, {
-    variant: "small-400",
-    color: "fg-150"
-  }, getProviderButtonText()), selectedQuote && /*#__PURE__*/React.createElement(React.Fragment, null, providerImage && /*#__PURE__*/React.createElement(Image, {
-    source: providerImage,
-    style: styles.providerImage
-  }), /*#__PURE__*/React.createElement(Text, {
-    variant: "small-400",
-    color: "fg-150"
-  }, StringUtil.capitalize(selectedQuote?.serviceProvider)))))), /*#__PURE__*/React.createElement(FlexView, {
+  }), /*#__PURE__*/React.createElement(FlexView, {
     flexDirection: "row",
     alignItems: "center",
     justifyContent: "center",