@reown/appkit-react-native 2.0.0-alpha.1 → 2.0.0-alpha.3

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

@@ -1,12 +1,14 @@
+"use strict";
+
+/* eslint-disable valtio/state-snapshot-rule */
 import { useSnapshot } from 'valtio';
-import { useRef, useState, useMemo } 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 { useRef, useState, useMemo, useEffect } from 'react';
+import { FlatList, StyleSheet, View, Modal } 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';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const SEPARATOR_HEIGHT = Spacing.s;
 export function SelectPaymentModal({
   title,
@@ -16,158 +18,153 @@ 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, {
+    return /*#__PURE__*/_jsx(View, {
       style: {
         height: SEPARATOR_HEIGHT
       }
     });
   };
   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;
-    return /*#__PURE__*/React.createElement(Quote, {
+    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__*/_jsx(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;
-    return /*#__PURE__*/React.createElement(PaymentMethod, {
+    const isSelected = parsedItem.paymentMethod === activePaymentMethod?.paymentMethod;
+    return /*#__PURE__*/_jsx(PaymentMethod, {
       item: parsedItem,
       onPress: () => handlePaymentMethodPress(parsedItem),
-      selected: selected,
+      selected: isSelected,
       testID: `payment-method-item-${parsedItem.paymentMethod}`
     });
   };
-  return /*#__PURE__*/React.createElement(Modal, {
-    isVisible: visible,
-    useNativeDriver: true,
-    useNativeDriverForBackdrop: true,
-    statusBarTranslucent: true,
-    hideModalContentWhileAnimating: true,
-    onBackdropPress: onClose,
-    onDismiss: onClose,
-    style: styles.modal
-  }, /*#__PURE__*/React.createElement(FlexView, {
-    style: [styles.container, {
-      backgroundColor: Theme['bg-100']
-    }]
-  }, /*#__PURE__*/React.createElement(FlexView, {
-    alignItems: "center",
-    justifyContent: "space-between",
-    flexDirection: "row",
-    style: styles.header
-  }, /*#__PURE__*/React.createElement(IconLink, {
-    icon: "arrowLeft",
-    onPress: onClose,
-    testID: "payment-modal-button-back"
-  }), !!title && /*#__PURE__*/React.createElement(Text, {
-    variant: "paragraph-600"
-  }, title), /*#__PURE__*/React.createElement(View, {
-    style: styles.iconPlaceholder
-  })), /*#__PURE__*/React.createElement(Text, {
-    variant: "small-500",
-    color: "fg-150",
-    style: styles.subtitle
-  }, "Pay with"), /*#__PURE__*/React.createElement(FlexView, null, /*#__PURE__*/React.createElement(FlatList, {
-    data: paymentMethods,
-    renderItem: renderPaymentMethod,
-    ref: paymentMethodsRef,
-    style: styles.paymentMethodsContainer,
-    contentContainerStyle: styles.paymentMethodsContent,
-    fadingEdgeLength: 20,
-    keyExtractor: item => item.paymentMethod,
-    horizontal: true,
-    showsHorizontalScrollIndicator: false
-  })), /*#__PURE__*/React.createElement(Separator, {
-    style: styles.separator,
-    color: "gray-glass-010"
-  }), /*#__PURE__*/React.createElement(Text, {
-    variant: "small-500",
-    color: "fg-150",
-    style: styles.subtitle
-  }, "Providers"), /*#__PURE__*/React.createElement(FlatList, {
-    data: sortedQuotes,
-    bounces: false,
-    renderItem: renderQuote,
-    contentContainerStyle: styles.listContent,
-    ItemSeparatorComponent: renderSeparator,
-    fadingEdgeLength: 20,
-    ListEmptyComponent: renderEmpty,
-    keyExtractor: item => `${item.serviceProvider}-${item.paymentMethodType}`,
-    getItemLayout: (_, index) => ({
-      length: QUOTE_ITEM_HEIGHT + SEPARATOR_HEIGHT,
-      offset: (QUOTE_ITEM_HEIGHT + SEPARATOR_HEIGHT) * index,
-      index
+  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__*/_jsx(Modal, {
+    visible: visible,
+    transparent: true,
+    animationType: "slide",
+    onRequestClose: onClose,
+    children: /*#__PURE__*/_jsx(View, {
+      style: styles.modalContent,
+      children: /*#__PURE__*/_jsxs(FlexView, {
+        style: [styles.container, {
+          backgroundColor: Theme['bg-100']
+        }],
+        children: [/*#__PURE__*/_jsxs(FlexView, {
+          alignItems: "center",
+          justifyContent: "space-between",
+          flexDirection: "row",
+          style: styles.header,
+          children: [/*#__PURE__*/_jsx(IconLink, {
+            icon: "arrowLeft",
+            onPress: onClose,
+            testID: "payment-modal-button-back"
+          }), !!title && /*#__PURE__*/_jsx(Text, {
+            variant: "paragraph-600",
+            children: title
+          }), /*#__PURE__*/_jsx(View, {
+            style: styles.iconPlaceholder
+          })]
+        }), /*#__PURE__*/_jsx(Text, {
+          variant: "small-500",
+          color: "fg-150",
+          style: styles.subtitle,
+          children: "Pay with"
+        }), /*#__PURE__*/_jsx(FlexView, {
+          children: /*#__PURE__*/_jsx(FlatList, {
+            data: availablePaymentMethods,
+            renderItem: renderPaymentMethod,
+            ref: paymentMethodsRef,
+            style: styles.paymentMethodsContainer,
+            contentContainerStyle: styles.paymentMethodsContent,
+            fadingEdgeLength: 20,
+            keyExtractor: item => item.paymentMethod,
+            horizontal: true,
+            showsHorizontalScrollIndicator: false
+          })
+        }), /*#__PURE__*/_jsx(Separator, {
+          style: styles.separator,
+          color: "gray-glass-010"
+        }), /*#__PURE__*/_jsx(Text, {
+          variant: "small-500",
+          color: "fg-150",
+          style: styles.subtitle,
+          children: "Providers"
+        }), /*#__PURE__*/_jsx(FlatList, {
+          data: sortedQuotes,
+          bounces: false,
+          renderItem: renderQuote,
+          extraData: selectedPaymentMethod,
+          contentContainerStyle: styles.listContent,
+          ItemSeparatorComponent: renderSeparator,
+          fadingEdgeLength: 20,
+          keyExtractor: item => `${item.serviceProvider}-${item.paymentMethodType}`,
+          getItemLayout: (_, index) => ({
+            length: QUOTE_ITEM_HEIGHT + SEPARATOR_HEIGHT,
+            offset: (QUOTE_ITEM_HEIGHT + SEPARATOR_HEIGHT) * index,
+            index
+          })
+        })]
+      })
     })
-  })));
+  });
 }
 const styles = StyleSheet.create({
-  modal: {
+  modalContent: {
     margin: 0,
+    flex: 1,
     justifyContent: 'flex-end'
   },
   header: {

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","FlatList","StyleSheet","View","Modal","FlexView","IconLink","Spacing","Text","useTheme","Separator","BorderRadius","OnRampController","Quote","ITEM_HEIGHT","QUOTE_ITEM_HEIGHT","PaymentMethod","jsx","_jsx","jsxs","_jsxs","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","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","transparent","animationType","onRequestClose","children","styles","modalContent","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","flex","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":[]}