react-native-moyasar-sdk/lib/module/views/samsung_pay/samsung_pay.js

Official React Native Moyasar SDK - Integrate Credit Cards, Apple Pay, Samsung Pay, and STC Pay with simple interfaces for a seamless payment experience in your React Native app

"use strict";

import { View, Platform, findNodeHandle, UIManager } from 'react-native';
import { SamsungPayButton } from "./index.js";
import { debugLog, errorLog } from "../../helpers/debug_log.js";
import { useEffect, useRef } from 'react';
import { PaymentRequest } from "../../models/api/api_requests/payment_request.js";
import { SamsungPayRequestSource } from "../../models/api/sources/samsung_pay/samsung_pay_request_source.js";
import { createPayment } from "../../services/payment_service.js";
import { GeneralError, isMoyasarError, NetworkError } from "../../models/errors/moyasar_errors.js";
import { toMajor } from "../../helpers/currency_util.js";
import { assert } from "../../helpers/assert.js";
import { jsx as _jsx } from "react/jsx-runtime";
export async function onSamsungPayResponse(token, orderNumber, paymentConfig, onPaymentResult) {
  const source = new SamsungPayRequestSource({
    samsungPayToken: token,
    manualPayment: paymentConfig.samsungPay?.manual
  });
  const paymentRequest = new PaymentRequest({
    givenId: paymentConfig.givenId,
    amount: paymentConfig.amount,
    currency: paymentConfig.currency,
    description: paymentConfig.description,
    metadata: {
      ...(paymentConfig.metadata || {}),
      samsungpay_order_id: orderNumber // This value must be supplied to native layer for Visa payments. Also for refund & chargebacks that's why we will send it to the backend
    },
    source: source
  });
  debugLog('Moyasar SDK: Paying with Samsung Pay...');
  try {
    const paymentResponse = await createPayment(paymentRequest, paymentConfig.publishableApiKey);
    onPaymentResult(paymentResponse);
  } catch (error) {
    errorLog(`Moyasar SDK: Failed to pay with Samsung Pay, ${error}`);
    if (isMoyasarError(error)) {
      onPaymentResult(error);
    } else {
      onPaymentResult(new NetworkError('Moyasar SDK: An error occured error while processing a Samsung Pay payment'));
    }
  }
}

// If we can't get the manufacturer, assume it's a Samsung device. Native layer will handle it.
function isSamsungDevice() {
  if (Platform.OS !== 'android') return false;
  try {
    const manufacturer = Platform.constants.Manufacturer;
    if (!manufacturer) return true;
    const sanitized = manufacturer.toLowerCase().trim();
    return sanitized === 'samsung' || sanitized.includes('samsung');
  } catch (e) {
    debugLog(`Moyasar SDK: Error checking Samsung device: ${e}`);
    return true;
  }
}
const createFragment = viewId => UIManager.dispatchViewManagerCommand(viewId,
// We are calling the 'create' command
'CreateSamsungPayButtonFragment', [viewId]);

//  TODO: Support customizing the Samsung Pay button
export function SamsungPay({
  paymentConfig,
  onPaymentResult,
  style
}) {
  assert(!!paymentConfig.samsungPay, 'Samsung Pay is not configured to use Samsung Pay, you have to configure the `samsungPay` property in the `PaymentConfig` object');
  const ref = useRef(null);
  useEffect(() => {
    if (isSamsungDevice() && paymentConfig.samsungPay) {
      // Samsung Pay SDK initialization code
      const viewId = findNodeHandle(ref.current);
      if (viewId === null) {
        errorLog('Failed to get viewId for Samsung Pay');
        return;
      }
      debugLog('Moyasar SDK: Initializing Samsung Pay fragment...');
      // TODO: Try catch
      createFragment(viewId);
    }
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, []);

  // Samsung Pay is in Samsung devices only, show empty view on other devices
  if (!isSamsungDevice() || !paymentConfig.samsungPay) {
    debugLog('Moyasar SDK: Samsung Pay is not supported on this device or the `samsungPay` property is not set, showing empty view');
    return /*#__PURE__*/_jsx(View, {});
  }

  // TODO: Check why the button takes some top and bottom padding
  // If the below view is rendered but not visible,
  // it mostly mean that the Samsung device does not support Samsung Pay
  // or the device is not configured for it yet (There are other rare cases as well as implmented by Samsung)
  return /*#__PURE__*/_jsx(View, {
    style: {
      alignItems: 'center'
    },
    children: /*#__PURE__*/_jsx(SamsungPayButton, {
      style: {
        height: style?.height ?? 65,
        width: style?.width ?? '90%'
      },
      merchantInfo: {
        serviceId: paymentConfig.samsungPay?.serviceId ?? '',
        merchantName: paymentConfig.samsungPay?.merchantName ?? '',
        merchantId: paymentConfig.publishableApiKey.substring(0, 15),
        // Currently, the merchantId will be part of the publishable API key
        merchantCountryCode: paymentConfig.merchantCountryCode,
        amount: toMajor(paymentConfig.amount, paymentConfig.currency),
        currency: paymentConfig.currency,
        supportedNetworks: paymentConfig.supportedNetworks,
        orderNumber: paymentConfig.samsungPay?.orderNumber,
        buttonBorderRadius: style?.cornerRadius
      },
      onPaymentResult: result => {
        if (!result.nativeEvent.result) {
          errorLog('Moyasar SDK: Samsung Pay result is empty or null');
          onPaymentResult(new GeneralError('Moyasar SDK: Samsung Pay token is null'));
          return;
        }
        const payload = JSON.parse(result.nativeEvent.result ?? '');
        onSamsungPayResponse(payload['3DS'].data, result.nativeEvent.orderNumber ?? '', paymentConfig, onPaymentResult);
      },
      ref: ref
    })
  });
}
//# sourceMappingURL=samsung_pay.js.map