@blocklet/payment-react 1.18.33 → 1.18.35

package/es/components/over-due-invoice-payment.js

@@ -40,7 +40,7 @@ function OverdueInvoicePayment({
   alertMessage = "",
   authToken
 }) {
-  const { t } = useLocaleContext();
+  const { t, locale } = useLocaleContext();
   const { connect, session } = usePaymentContext();
   const [selectCurrencyId, setSelectCurrencyId] = useState("");
   const [payLoading, setPayLoading] = useState(false);
@@ -170,12 +170,18 @@ function OverdueInvoicePayment({
         extraParams.customerId = effectiveCustomerId;
       }
       connect.open({
+        locale,
         containerEl: void 0,
         saveConnect: false,
         action: "collect-batch",
         prefix: joinURL(getPrefix(), "/api/did"),
         useSocket: !isCrossOriginRequest,
         extraParams,
+        messages: {
+          scan: t("common.connect.defaultScan"),
+          title: t("payment.customer.invoice.payBatch"),
+          confirm: t("common.connect.confirm")
+        },
         onSuccess: () => {
           connect.close();
           handleConnected();

package/es/history/invoice/list.js

@@ -469,7 +469,7 @@ const InvoiceList = React.memo((props) => {
 });
 export default function CustomerInvoiceList(props) {
   const { action, type } = props;
-  const { t } = useLocaleContext();
+  const { t, locale } = useLocaleContext();
   const { connect } = usePaymentContext();
   const [state, setState] = useSetState({ paying: "" });
   const onPay = (invoiceId) => {
@@ -480,6 +480,7 @@ export default function CustomerInvoiceList(props) {
     connect.open({
       action: "collect",
       saveConnect: false,
+      locale,
       useSocket: isCrossOrigin() === false,
       messages: {
         scan: "",

package/es/libs/util.d.ts

@@ -120,3 +120,4 @@ export declare function parseMarkedText(text: string): Array<{
     type: 'text' | 'marked';
     content: string;
 }>;
+export declare function getTokenBalanceLink(method: TPaymentMethod, address: string): string;

package/es/libs/util.js

@@ -979,3 +979,16 @@ export function parseMarkedText(text) {
   }
   return result.filter((p) => p.content !== "");
 }
+export function getTokenBalanceLink(method, address) {
+  if (!method || !address) {
+    return "";
+  }
+  const explorerHost = method?.settings?.[method?.type]?.explorer_host || "";
+  if (method.type === "arcblock" && address) {
+    return joinURL(explorerHost, "accounts", address, "tokens");
+  }
+  if (["ethereum", "base"].includes(method.type) && address) {
+    return joinURL(explorerHost, "address", address);
+  }
+  return "";
+}

package/es/libs/validator.d.ts

@@ -1 +1,2 @@
 export declare function validatePostalCode(postalCode: string, country?: string): boolean;
+export declare function getFieldValidation(fieldName: string, validations?: Record<string, any>, locale?: string): Record<string, any>;

package/es/libs/validator.js

@@ -1,4 +1,5 @@
 import isPostalCode from "validator/lib/isPostalCode";
+import { t } from "../locales/index.js";
 const POSTAL_CODE_SUPPORTED_COUNTRIES = [
   "AD",
   "AT",
@@ -68,3 +69,16 @@ export function validatePostalCode(postalCode, country) {
     return false;
   }
 }
+export function getFieldValidation(fieldName, validations, locale = "en") {
+  if (!validations || !validations[fieldName])
+    return {};
+  const fieldValidation = validations[fieldName];
+  const rules = {};
+  if (fieldValidation.pattern) {
+    rules.pattern = {
+      value: new RegExp(fieldValidation.pattern),
+      message: fieldValidation.pattern_message?.[locale] || t("payment.checkout.invalid", locale)
+    };
+  }
+  return rules;
+}

package/es/locales/en.js

@@ -94,7 +94,13 @@ export default flat({
     stakeAmount: "Stake Amount",
     slashStakeAmount: "Slash Stake Amount",
     know: "I know",
-    relatedSubscription: "Subscription"
+    relatedSubscription: "Subscription",
+    connect: {
+      defaultScan: "Use following methods to complete this action",
+      scan: "Use following methods to complete this {action}",
+      confirm: "Confirm",
+      cancel: "Cancel"
+    }
   },
   payment: {
     checkout: {
@@ -166,7 +172,10 @@ export default flat({
         donate: "Thanks for your tip",
         tip: "A payment to {payee} has been completed. You can view the details of this payment in your account."
       },
-      confirm: "Confirming allows {payee} to charge or reduce your staking. You can cancel or revoke staking anytime.",
+      confirm: {
+        withStake: "By confirming, you allow {payee} to charge your account for future payments and, if necessary, slash your stake. You can cancel your subscription or withdraw your stake at any time.",
+        withoutStake: "By confirming, you allow {payee} to charge your account for future payments. You can cancel your subscription at any time."
+      },
       required: "Required",
       invalid: "Invalid",
       billing: {
@@ -209,7 +218,23 @@ export default flat({
       },
       orderSummary: "Order Summary",
       paymentDetails: "Payment Details",
-      productListTotal: "Includes {total} items"
+      productListTotal: "Includes {total} items",
+      connectModal: {
+        title: "{action}",
+        scan: "Use following methods to complete this payment",
+        confirm: "Confirm",
+        cancel: "Cancel"
+      },
+      fastPay: {
+        title: "Confirm Payment",
+        confirmMessage: "You will pay {amount} {symbol} from {sourceType}.",
+        autoPaymentReason: "This payment will be processed automatically due to prior delegation or sufficient balance.",
+        confirmPrompt: "Please confirm the details before proceeding.",
+        payer: "Account",
+        amount: "Amount",
+        failed: "Account changed, please pay manually.",
+        balanceLink: "View Balance"
+      }
     },
     customer: {
       payments: "Payment History",
@@ -275,7 +300,8 @@ export default flat({
         select: "Select payment method",
         submit: "Confirm change",
         confirm: "By confirming this change, you allow {payee} to charge {symbol} from your account for future payments in accordance with their terms. You can always change your payment method.",
-        completed: "Your payment method has been successfully updated, all future payments will use the new payment method unless you change it again."
+        completed: "Your payment method has been successfully updated, all future payments will use the new payment method unless you change it again.",
+        title: "Payment Method Change"
       },
       invoice: {
         summary: "Summary",
@@ -296,7 +322,8 @@ export default flat({
         next: "No invoices yet, next invoice will be generated on {date}",
         invoiceNumber: "Invoice Number",
         emptyList: "No Invoice",
-        noPaymentRequired: "No Payment Required"
+        noPaymentRequired: "No Payment Required",
+        payBatch: "Pay Due Invoices"
       },
       payment: {
         empty: "There are no payments",

package/es/locales/zh.js

@@ -94,7 +94,13 @@ export default flat({
     stakeAmount: "\u8D28\u62BC\u91D1\u989D",
     slashStakeAmount: "\u7F5A\u6CA1\u91D1\u989D",
     know: "\u6211\u77E5\u9053\u4E86",
-    relatedSubscription: "\u8BA2\u9605"
+    relatedSubscription: "\u8BA2\u9605",
+    connect: {
+      defaultScan: "\u4F7F\u7528\u4EE5\u4E0B\u65B9\u5F0F\u5B8C\u6210\u672C\u6B21\u64CD\u4F5C",
+      scan: "\u4F7F\u7528\u4EE5\u4E0B\u65B9\u5F0F\u5B8C\u6210\u672C\u6B21{action}",
+      confirm: "\u786E\u8BA4",
+      cancel: "\u53D6\u6D88"
+    }
   },
   payment: {
     checkout: {
@@ -166,7 +172,10 @@ export default flat({
         donate: "\u611F\u8C22\u60A8\u7684\u652F\u6301",
         tip: "\u5411{payee}\u7684\u4ED8\u6B3E\u5DF2\u5B8C\u6210\u3002\u60A8\u53EF\u4EE5\u5728\u60A8\u7684\u8D26\u6237\u4E2D\u67E5\u770B\u6B64\u4ED8\u6B3E\u7684\u8BE6\u7EC6\u4FE1\u606F\u3002"
       },
-      confirm: "\u786E\u8BA4\u5141\u8BB8{payee}\u5BF9\u60A8\u7684\u8D26\u6237\u8FDB\u884C\u4ED8\u6B3E\u6216\u8005\u7F5A\u6CA1\u60A8\u7684\u8D28\u62BC\u3002\u60A8\u968F\u65F6\u53EF\u4EE5\u53D6\u6D88\u60A8\u7684\u8BA2\u9605\uFF0C\u6216\u8005\u64A4\u9500\u8D28\u62BC\u3002",
+      confirm: {
+        withStake: "\u786E\u8BA4\u8BA2\u9605\uFF0C\u5373\u8868\u793A\u60A8\u6388\u6743 {payee} \u4ECE\u60A8\u7684\u8D26\u6237\u6263\u53D6\u672A\u6765\u6B3E\u9879\uFF0C\u5E76\u5728\u5FC5\u8981\u65F6\u7F5A\u6CA1\u8D28\u62BC\u3002\u60A8\u53EF\u968F\u65F6\u53D6\u6D88\u8BA2\u9605\u6216\u64A4\u9500\u8D28\u62BC\u3002",
+        withoutStake: "\u786E\u8BA4\u8BA2\u9605\uFF0C\u5373\u8868\u793A\u60A8\u6388\u6743 {payee} \u4ECE\u60A8\u7684\u8D26\u6237\u6263\u53D6\u672A\u6765\u6B3E\u9879\u3002\u60A8\u53EF\u968F\u65F6\u53D6\u6D88\u8BA2\u9605\u3002"
+      },
       required: "\u5FC5\u586B\u9879",
       invalid: "\u65E0\u6548",
       billing: {
@@ -209,7 +218,23 @@ export default flat({
       },
       orderSummary: "\u8BA2\u5355\u6982\u89C8",
       paymentDetails: "\u652F\u4ED8\u4FE1\u606F",
-      productListTotal: "\u5305\u62EC {total} \u9879"
+      productListTotal: "\u5305\u62EC {total} \u9879",
+      connectModal: {
+        title: "{action}",
+        scan: "\u4F7F\u7528\u4EE5\u4E0B\u65B9\u5F0F\u5B8C\u6210\u672C\u6B21\u652F\u4ED8",
+        confirm: "\u786E\u8BA4",
+        cancel: "\u53D6\u6D88"
+      },
+      fastPay: {
+        title: "\u786E\u8BA4\u652F\u4ED8",
+        confirmMessage: "\u60A8\u5C06\u652F\u4ED8 {amount} {symbol}\uFF0C\u4ECE{sourceType}\u6263\u9664\u3002",
+        autoPaymentReason: "\u7531\u4E8E\u6388\u6743\u6216\u4F59\u989D\u5145\u8DB3\uFF0C\u7CFB\u7EDF\u5C06\u65E0\u9700\u94B1\u5305\u786E\u8BA4\u81EA\u52A8\u5B8C\u6210\u652F\u4ED8\u3002",
+        confirmPrompt: "\u8BF7\u786E\u8BA4\u652F\u4ED8\u4FE1\u606F\u65E0\u8BEF\u540E\u7EE7\u7EED\u3002",
+        payer: "\u8D26\u6237\u5730\u5740",
+        amount: "\u652F\u4ED8\u91D1\u989D",
+        failed: "\u8D26\u6237\u53D1\u751F\u53D8\u5316\uFF0C\u65E0\u6CD5\u81EA\u52A8\u5B8C\u6210\u652F\u4ED8\uFF0C\u8BF7\u624B\u52A8\u652F\u4ED8\u3002",
+        balanceLink: "\u67E5\u770B\u4F59\u989D"
+      }
     },
     customer: {
       payments: "\u652F\u4ED8\u5386\u53F2",
@@ -276,7 +301,8 @@ export default flat({
         select: "\u9009\u62E9\u652F\u4ED8\u65B9\u5F0F",
         submit: "\u786E\u8BA4\u53D8\u66F4",
         confirm: "\u786E\u8BA4\u53D8\u66F4\u65B9\u5F0F\u610F\u5473\u7740\u4F60\u5141\u8BB8 {payee} \u4F7F\u7528\u65B0\u7684\u652F\u4ED8\u65B9\u5F0F\u652F\u4ED8\u4F60\u7684\u672A\u6765\u8D26\u5355\u3002\u4F60\u53EF\u4EE5\u968F\u65F6\u518D\u6B21\u53D8\u66F4\u652F\u4ED8\u65B9\u5F0F\u3002",
-        completed: "\u4F60\u7684\u652F\u4ED8\u65B9\u5F0F \u5DF2\u7ECF\u66F4\u65B0\u6210\u529F\u3002\u4F60\u53EF\u4EE5\u5728\u4F60\u7684\u8D26\u6237\u4E2D\u67E5\u770B\u6B64\u652F\u4ED8\u65B9\u5F0F\u7684\u8BE6\u7EC6\u4FE1\u606F\u3002"
+        completed: "\u4F60\u7684\u652F\u4ED8\u65B9\u5F0F \u5DF2\u7ECF\u66F4\u65B0\u6210\u529F\u3002\u4F60\u53EF\u4EE5\u5728\u4F60\u7684\u8D26\u6237\u4E2D\u67E5\u770B\u6B64\u652F\u4ED8\u65B9\u5F0F\u7684\u8BE6\u7EC6\u4FE1\u606F\u3002",
+        title: "\u652F\u4ED8\u65B9\u5F0F\u53D8\u66F4"
       },
       invoice: {
         summary: "\u6458\u8981",
@@ -297,7 +323,8 @@ export default flat({
         next: "\u8FD8\u6CA1\u6709\u8D26\u5355\uFF0C\u4E0B\u6B21\u8D26\u5355\u5C06\u5728 {date} \u751F\u6210",
         invoiceNumber: "\u8D26\u5355\u7F16\u53F7",
         emptyList: "\u6CA1\u6709\u8D26\u5355",
-        noPaymentRequired: "\u65E0\u9700\u652F\u4ED8"
+        noPaymentRequired: "\u65E0\u9700\u652F\u4ED8",
+        payBatch: "\u652F\u4ED8\u6B20\u6B3E"
       },
       payment: {
         empty: "\u6CA1\u6709\u652F\u4ED8\u8BB0\u5F55",

package/es/payment/form/address.d.ts

@@ -3,11 +3,15 @@ type Props = {
     mode: string;
     stripe: boolean;
     sx?: SxProps;
+    fieldValidation?: Record<string, any>;
+    errorPosition?: 'right' | 'bottom';
 };
-declare function AddressForm({ mode, stripe, sx }: Props): import("react").JSX.Element | null;
+declare function AddressForm({ mode, stripe, sx, fieldValidation, errorPosition }: Props): import("react").JSX.Element | null;
 declare namespace AddressForm {
     var defaultProps: {
         sx: {};
+        fieldValidation: {};
+        errorPosition: string;
     };
 }
 export default AddressForm;

package/es/payment/form/address.js

@@ -4,11 +4,13 @@ import { Fade, FormLabel, InputAdornment, Stack } from "@mui/material";
 import { Controller, useFormContext, useWatch } from "react-hook-form";
 import FormInput from "../../components/input.js";
 import CountrySelect from "../../components/country-select.js";
-import { validatePostalCode } from "../../libs/validator.js";
+import { getFieldValidation, validatePostalCode } from "../../libs/validator.js";
 AddressForm.defaultProps = {
-  sx: {}
+  sx: {},
+  fieldValidation: {},
+  errorPosition: "right"
 };
-export default function AddressForm({ mode, stripe, sx = {} }) {
+export default function AddressForm({ mode, stripe, sx = {}, fieldValidation, errorPosition }) {
   const { t } = useLocaleContext();
   const { control } = useFormContext();
   const country = useWatch({ control, name: "billing_address.country" });
@@ -19,8 +21,11 @@ export default function AddressForm({ mode, stripe, sx = {} }) {
         FormInput,
         {
           name: "billing_address.line1",
-          rules: { required: t("payment.checkout.required") },
-          errorPosition: "right",
+          rules: {
+            required: t("payment.checkout.required"),
+            ...getFieldValidation("billing_address.line1", fieldValidation)
+          },
+          errorPosition,
           variant: "outlined",
           placeholder: t("payment.checkout.billing.line1")
         }
@@ -30,8 +35,11 @@ export default function AddressForm({ mode, stripe, sx = {} }) {
         FormInput,
         {
           name: "billing_address.city",
-          rules: { required: t("payment.checkout.required") },
-          errorPosition: "right",
+          rules: {
+            required: t("payment.checkout.required"),
+            ...getFieldValidation("billing_address.city", fieldValidation)
+          },
+          errorPosition,
           variant: "outlined",
           placeholder: t("payment.checkout.billing.city")
         }
@@ -41,8 +49,11 @@ export default function AddressForm({ mode, stripe, sx = {} }) {
         FormInput,
         {
           name: "billing_address.state",
-          rules: { required: t("payment.checkout.required") },
-          errorPosition: "right",
+          rules: {
+            required: t("payment.checkout.required"),
+            ...getFieldValidation("billing_address.state", fieldValidation)
+          },
+          errorPosition,
           variant: "outlined",
           placeholder: t("payment.checkout.billing.state")
         }
@@ -57,9 +68,10 @@ export default function AddressForm({ mode, stripe, sx = {} }) {
             validate: (x) => {
               const isValid = validatePostalCode(x, country);
               return isValid ? true : t("payment.checkout.invalid");
-            }
+            },
+            ...getFieldValidation("billing_address.postal_code", fieldValidation)
           },
-          errorPosition: "right",
+          errorPosition,
           variant: "outlined",
           placeholder: t("payment.checkout.billing.postal_code"),
           InputProps: {
@@ -98,9 +110,10 @@ export default function AddressForm({ mode, stripe, sx = {} }) {
             validate: (x) => {
               const isValid = validatePostalCode(x, country);
               return isValid ? true : t("payment.checkout.invalid");
-            }
+            },
+            ...getFieldValidation("billing_address.postal_code", fieldValidation)
           },
-          errorPosition: "right",
+          errorPosition,
           variant: "outlined",
           placeholder: t("payment.checkout.billing.postal_code"),
           wrapperStyle: { height: "40px" },