@blocklet/payment-react 1.15.32 → 1.15.34
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/es/components/pricing-table.d.ts +3 -1
- package/es/components/pricing-table.js +4 -3
- package/es/history/invoice/list.d.ts +1 -0
- package/es/history/invoice/list.js +15 -1
- package/es/libs/util.d.ts +7 -1
- package/es/libs/util.js +41 -0
- package/es/locales/en.js +9 -2
- package/es/locales/zh.js +10 -3
- package/lib/components/pricing-table.d.ts +3 -1
- package/lib/components/pricing-table.js +5 -3
- package/lib/history/invoice/list.d.ts +1 -0
- package/lib/history/invoice/list.js +20 -1
- package/lib/libs/util.d.ts +7 -1
- package/lib/libs/util.js +51 -0
- package/lib/locales/en.js +9 -2
- package/lib/locales/zh.js +10 -3
- package/package.json +3 -3
- package/src/components/pricing-table.tsx +4 -2
- package/src/history/invoice/list.tsx +20 -1
- package/src/libs/util.ts +53 -0
- package/src/locales/en.tsx +7 -0
- package/src/locales/zh.tsx +8 -1
|
@@ -6,13 +6,15 @@ type Props = {
|
|
|
6
6
|
alignItems?: 'center' | 'left';
|
|
7
7
|
mode?: 'checkout' | 'select';
|
|
8
8
|
interval?: string;
|
|
9
|
+
hideCurrency?: boolean;
|
|
9
10
|
};
|
|
10
|
-
declare function PricingTable({ table, alignItems, interval, mode, onSelect }: Props): import("react").JSX.Element;
|
|
11
|
+
declare function PricingTable({ table, alignItems, interval, mode, onSelect, hideCurrency }: Props): import("react").JSX.Element;
|
|
11
12
|
declare namespace PricingTable {
|
|
12
13
|
var defaultProps: {
|
|
13
14
|
alignItems: string;
|
|
14
15
|
mode: string;
|
|
15
16
|
interval: string;
|
|
17
|
+
hideCurrency: boolean;
|
|
16
18
|
};
|
|
17
19
|
}
|
|
18
20
|
export default PricingTable;
|
|
@@ -58,9 +58,10 @@ const groupItemsByRecurring = (items, currency) => {
|
|
|
58
58
|
PricingTable.defaultProps = {
|
|
59
59
|
alignItems: "center",
|
|
60
60
|
mode: "checkout",
|
|
61
|
-
interval: ""
|
|
61
|
+
interval: "",
|
|
62
|
+
hideCurrency: false
|
|
62
63
|
};
|
|
63
|
-
export default function PricingTable({ table, alignItems, interval, mode, onSelect }) {
|
|
64
|
+
export default function PricingTable({ table, alignItems, interval, mode, onSelect, hideCurrency }) {
|
|
64
65
|
const { t, locale } = useLocaleContext();
|
|
65
66
|
const { isMobile } = useMobile();
|
|
66
67
|
const {
|
|
@@ -258,7 +259,7 @@ export default function PricingTable({ table, alignItems, interval, mode, onSele
|
|
|
258
259
|
))
|
|
259
260
|
}
|
|
260
261
|
) }),
|
|
261
|
-
currencyList.length > 0 && /* @__PURE__ */ jsx(
|
|
262
|
+
currencyList.length > 0 && !hideCurrency && /* @__PURE__ */ jsx(
|
|
262
263
|
Select,
|
|
263
264
|
{
|
|
264
265
|
value: currency?.id,
|
|
@@ -16,6 +16,7 @@ import {
|
|
|
16
16
|
formatError,
|
|
17
17
|
formatToDate,
|
|
18
18
|
formatToDatetime,
|
|
19
|
+
getInvoiceDescriptionAndReason,
|
|
19
20
|
getInvoiceStatusColor,
|
|
20
21
|
getPrefix,
|
|
21
22
|
getTxLink
|
|
@@ -69,6 +70,7 @@ const InvoiceTable = React.memo((props) => {
|
|
|
69
70
|
currency_id,
|
|
70
71
|
subscription_id,
|
|
71
72
|
include_staking,
|
|
73
|
+
include_return_staking,
|
|
72
74
|
include_recovered_from,
|
|
73
75
|
onTableDataChange
|
|
74
76
|
} = props;
|
|
@@ -90,6 +92,7 @@ const InvoiceTable = React.memo((props) => {
|
|
|
90
92
|
currency_id,
|
|
91
93
|
subscription_id,
|
|
92
94
|
include_staking,
|
|
95
|
+
include_return_staking,
|
|
93
96
|
include_recovered_from,
|
|
94
97
|
ignore_zero: true
|
|
95
98
|
}),
|
|
@@ -131,6 +134,17 @@ const InvoiceTable = React.memo((props) => {
|
|
|
131
134
|
}
|
|
132
135
|
}
|
|
133
136
|
},
|
|
137
|
+
{
|
|
138
|
+
label: t("common.type"),
|
|
139
|
+
name: "billing_reason",
|
|
140
|
+
options: {
|
|
141
|
+
customBodyRenderLite: (_, index) => {
|
|
142
|
+
const invoice = data.list[index];
|
|
143
|
+
const link = getInvoiceLink(invoice, action);
|
|
144
|
+
return /* @__PURE__ */ jsx("a", { href: link.url, target: link.external ? "_blank" : target, rel: "noreferrer", children: /* @__PURE__ */ jsx(Status, { label: getInvoiceDescriptionAndReason(invoice, locale)?.type }) });
|
|
145
|
+
}
|
|
146
|
+
}
|
|
147
|
+
},
|
|
134
148
|
{
|
|
135
149
|
label: t("payment.customer.invoice.invoiceNumber"),
|
|
136
150
|
name: "number",
|
|
@@ -161,7 +175,7 @@ const InvoiceTable = React.memo((props) => {
|
|
|
161
175
|
customBodyRenderLite: (val, index) => {
|
|
162
176
|
const invoice = data?.list[index];
|
|
163
177
|
const link = getInvoiceLink(invoice, action);
|
|
164
|
-
return /* @__PURE__ */ jsx("a", { href: link.url, target: link.external ? "_blank" : target, rel: "noreferrer", children: invoice
|
|
178
|
+
return /* @__PURE__ */ jsx("a", { href: link.url, target: link.external ? "_blank" : target, rel: "noreferrer", children: getInvoiceDescriptionAndReason(invoice, locale)?.description || invoice.id });
|
|
165
179
|
}
|
|
166
180
|
}
|
|
167
181
|
},
|
package/es/libs/util.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import type { PaymentDetails, PriceCurrency, PriceRecurring, TLineItemExpanded, TPaymentCurrency, TPaymentCurrencyExpanded, TPaymentMethod, TPaymentMethodExpanded, TPrice, TProductExpanded, TSubscriptionExpanded, TSubscriptionItemExpanded } from '@blocklet/payment-types';
|
|
2
|
+
import type { PaymentDetails, PriceCurrency, PriceRecurring, TInvoiceExpanded, TLineItemExpanded, TPaymentCurrency, TPaymentCurrencyExpanded, TPaymentMethod, TPaymentMethodExpanded, TPrice, TProductExpanded, TSubscriptionExpanded, TSubscriptionItemExpanded } from '@blocklet/payment-types';
|
|
3
3
|
import { ActionProps, PricingRenderProps } from '../types';
|
|
4
4
|
export declare const PAYMENT_KIT_DID = "z2qaCNvKMv5GjouKdcDWexv6WqtHbpNPQDnAk";
|
|
5
5
|
export declare const isPaymentKitMounted: () => any;
|
|
@@ -108,3 +108,9 @@ export declare function getWordBreakStyle(value: any): 'break-word' | 'break-all
|
|
|
108
108
|
export declare function isMobileSafari(): boolean;
|
|
109
109
|
export declare function truncateText(text: string, maxLength: number, useWidth?: boolean): string;
|
|
110
110
|
export declare function getCustomerAvatar(did: string | undefined, updated_at: string | number | undefined, imageSize?: number): string;
|
|
111
|
+
export declare function hasDelegateTxHash(details: PaymentDetails, paymentMethod: TPaymentMethod): any;
|
|
112
|
+
export declare function getInvoiceDescriptionAndReason(invoice: TInvoiceExpanded, locale?: string): {
|
|
113
|
+
description: string | undefined;
|
|
114
|
+
reason: string;
|
|
115
|
+
type: string;
|
|
116
|
+
};
|
package/es/libs/util.js
CHANGED
|
@@ -669,6 +669,9 @@ export const flattenPaymentMethods = (methods = []) => {
|
|
|
669
669
|
return out;
|
|
670
670
|
};
|
|
671
671
|
export const getTxLink = (method, details) => {
|
|
672
|
+
if (!details) {
|
|
673
|
+
return { text: "N/A", link: "", gas: "" };
|
|
674
|
+
}
|
|
672
675
|
if (method.type === "arcblock" && details.arcblock?.tx_hash) {
|
|
673
676
|
return {
|
|
674
677
|
link: joinURL(method.settings.arcblock?.explorer_host, "/txs", details.arcblock?.tx_hash),
|
|
@@ -842,3 +845,41 @@ export function getCustomerAvatar(did, updated_at, imageSize = 48) {
|
|
|
842
845
|
const updated = typeof updated_at === "number" ? updated_at : dayjs(updated_at).unix();
|
|
843
846
|
return `/.well-known/service/user/avatar/${did}?imageFilter=resize&w=${imageSize}&h=${imageSize}&updateAt=${updated || dayjs().unix()}`;
|
|
844
847
|
}
|
|
848
|
+
export function hasDelegateTxHash(details, paymentMethod) {
|
|
849
|
+
return paymentMethod?.type && ["arcblock", "ethereum"].includes(paymentMethod?.type) && // @ts-ignore
|
|
850
|
+
details?.[paymentMethod?.type]?.tx_hash;
|
|
851
|
+
}
|
|
852
|
+
export function getInvoiceDescriptionAndReason(invoice, locale = "en") {
|
|
853
|
+
const { billing_reason: reason, description } = invoice;
|
|
854
|
+
const reasonMap = {
|
|
855
|
+
subscription_create: t("payment.invoice.reason.creation", locale),
|
|
856
|
+
subscription_cycle: t("payment.invoice.reason.cycle", locale),
|
|
857
|
+
subscription_update: t("payment.invoice.reason.update", locale),
|
|
858
|
+
subscription_recover: t("payment.invoice.reason.recover", locale),
|
|
859
|
+
subscription_threshold: t("payment.invoice.reason.threshold", locale),
|
|
860
|
+
subscription_cancel: t("payment.invoice.reason.cancel", locale),
|
|
861
|
+
manual: t("payment.invoice.reason.manual", locale),
|
|
862
|
+
upcoming: t("payment.invoice.reason.upcoming", locale),
|
|
863
|
+
slash_stake: t("payment.invoice.reason.slashStake", locale),
|
|
864
|
+
stake: t("payment.invoice.reason.stake", locale),
|
|
865
|
+
return_stake: t("payment.invoice.reason.returnStake", locale)
|
|
866
|
+
};
|
|
867
|
+
if (description?.startsWith("Subscription ") || description?.startsWith("Slash stake")) {
|
|
868
|
+
return {
|
|
869
|
+
description: reasonMap[reason],
|
|
870
|
+
reason: reasonMap[reason],
|
|
871
|
+
type: reason.includes("stake") ? reasonMap[reason] : t("payment.invoice.reason.payment", locale)
|
|
872
|
+
};
|
|
873
|
+
}
|
|
874
|
+
const descMap = {
|
|
875
|
+
"Stake for subscription plan change": t("payment.invoice.reason.stakeForChangePlan", locale),
|
|
876
|
+
"Stake for subscription payment change": t("payment.invoice.reason.stakeForChangePayment", locale),
|
|
877
|
+
"Stake for subscription": t("payment.invoice.reason.staking", locale),
|
|
878
|
+
"Return Subscription staking": t("payment.invoice.reason.returnStake", locale)
|
|
879
|
+
};
|
|
880
|
+
return {
|
|
881
|
+
description: descMap[description] || description,
|
|
882
|
+
reason: reasonMap[reason] || reason,
|
|
883
|
+
type: reason.includes("stake") ? reasonMap[reason] : t("payment.invoice.reason.payment", locale)
|
|
884
|
+
};
|
|
885
|
+
}
|
package/es/locales/en.js
CHANGED
|
@@ -88,7 +88,9 @@ export default flat({
|
|
|
88
88
|
quantityLimitPerCheckout: "Exceed purchase limit",
|
|
89
89
|
quantityNotEnough: "Exceed inventory",
|
|
90
90
|
amountPrecisionLimit: "Amount decimal places must be less than or equal to {precision}",
|
|
91
|
-
saveAsDefaultPriceSuccess: "Set default price successfully"
|
|
91
|
+
saveAsDefaultPriceSuccess: "Set default price successfully",
|
|
92
|
+
stakeAmount: "Stake Amount",
|
|
93
|
+
slashStakeAmount: "Slash Stake Amount"
|
|
92
94
|
},
|
|
93
95
|
payment: {
|
|
94
96
|
checkout: {
|
|
@@ -305,7 +307,12 @@ export default flat({
|
|
|
305
307
|
cancel: "Subscription cancel",
|
|
306
308
|
manual: "Manual invoice",
|
|
307
309
|
upcoming: "Upcoming invoice",
|
|
308
|
-
slashStake: "Slash stake"
|
|
310
|
+
slashStake: "Slash stake",
|
|
311
|
+
stake: "Stake",
|
|
312
|
+
payment: "Payment",
|
|
313
|
+
returnStake: "Return stake",
|
|
314
|
+
stakeForChangePlan: "Subscription plan update",
|
|
315
|
+
stakeForChangePayment: "Subscription payment method update"
|
|
309
316
|
}
|
|
310
317
|
}
|
|
311
318
|
},
|
package/es/locales/zh.js
CHANGED
|
@@ -88,7 +88,9 @@ export default flat({
|
|
|
88
88
|
quantityLimitPerCheckout: "\u8D85\u51FA\u8D2D\u4E70\u9650\u5236",
|
|
89
89
|
quantityNotEnough: "\u5E93\u5B58\u4E0D\u8DB3",
|
|
90
90
|
amountPrecisionLimit: "\u91D1\u989D\u5C0F\u6570\u4F4D\u6570\u5FC5\u987B\u5728 {precision} \u4F4D\u4EE5\u5185",
|
|
91
|
-
saveAsDefaultPriceSuccess: "\u8BBE\u7F6E\u9ED8\u8BA4\u4EF7\u683C\u6210\u529F"
|
|
91
|
+
saveAsDefaultPriceSuccess: "\u8BBE\u7F6E\u9ED8\u8BA4\u4EF7\u683C\u6210\u529F",
|
|
92
|
+
stakeAmount: "\u8D28\u62BC\u91D1\u989D",
|
|
93
|
+
slashStakeAmount: "\u7F5A\u6CA1\u91D1\u989D"
|
|
92
94
|
},
|
|
93
95
|
payment: {
|
|
94
96
|
checkout: {
|
|
@@ -298,14 +300,19 @@ export default flat({
|
|
|
298
300
|
reason: {
|
|
299
301
|
creation: "\u8BA2\u9605\u521B\u5EFA",
|
|
300
302
|
cycle: "\u81EA\u52A8\u6263\u8D39",
|
|
301
|
-
staking: "\u8BA2\u9605\u521B\u5EFA
|
|
303
|
+
staking: "\u8BA2\u9605\u521B\u5EFA",
|
|
302
304
|
update: "\u8BA2\u9605\u66F4\u65B0",
|
|
303
305
|
recover: "\u8BA2\u9605\u6062\u590D",
|
|
304
306
|
threshold: "\u7528\u91CF\u8D26\u5355",
|
|
305
307
|
cancel: "\u8BA2\u9605\u53D6\u6D88",
|
|
306
308
|
manual: "\u4EBA\u5DE5\u8D26\u5355",
|
|
307
309
|
upcoming: "\u672A\u6765\u8D26\u5355",
|
|
308
|
-
slashStake: "\u7F5A\u6CA1\u8D28\u62BC"
|
|
310
|
+
slashStake: "\u7F5A\u6CA1\u8D28\u62BC",
|
|
311
|
+
stake: "\u62BC\u91D1",
|
|
312
|
+
payment: "\u4ED8\u6B3E",
|
|
313
|
+
returnStake: "\u9000\u62BC\u91D1",
|
|
314
|
+
stakeForChangePlan: "\u8BA2\u9605\u5957\u9910\u66F4\u65B0",
|
|
315
|
+
stakeForChangePayment: "\u8BA2\u9605\u652F\u4ED8\u65B9\u5F0F\u66F4\u65B0"
|
|
309
316
|
}
|
|
310
317
|
}
|
|
311
318
|
},
|
|
@@ -6,13 +6,15 @@ type Props = {
|
|
|
6
6
|
alignItems?: 'center' | 'left';
|
|
7
7
|
mode?: 'checkout' | 'select';
|
|
8
8
|
interval?: string;
|
|
9
|
+
hideCurrency?: boolean;
|
|
9
10
|
};
|
|
10
|
-
declare function PricingTable({ table, alignItems, interval, mode, onSelect }: Props): import("react").JSX.Element;
|
|
11
|
+
declare function PricingTable({ table, alignItems, interval, mode, onSelect, hideCurrency }: Props): import("react").JSX.Element;
|
|
11
12
|
declare namespace PricingTable {
|
|
12
13
|
var defaultProps: {
|
|
13
14
|
alignItems: string;
|
|
14
15
|
mode: string;
|
|
15
16
|
interval: string;
|
|
17
|
+
hideCurrency: boolean;
|
|
16
18
|
};
|
|
17
19
|
}
|
|
18
20
|
export default PricingTable;
|
|
@@ -48,14 +48,16 @@ const groupItemsByRecurring = (items, currency) => {
|
|
|
48
48
|
PricingTable.defaultProps = {
|
|
49
49
|
alignItems: "center",
|
|
50
50
|
mode: "checkout",
|
|
51
|
-
interval: ""
|
|
51
|
+
interval: "",
|
|
52
|
+
hideCurrency: false
|
|
52
53
|
};
|
|
53
54
|
function PricingTable({
|
|
54
55
|
table,
|
|
55
56
|
alignItems,
|
|
56
57
|
interval,
|
|
57
58
|
mode,
|
|
58
|
-
onSelect
|
|
59
|
+
onSelect,
|
|
60
|
+
hideCurrency
|
|
59
61
|
}) {
|
|
60
62
|
const {
|
|
61
63
|
t,
|
|
@@ -274,7 +276,7 @@ function PricingTable({
|
|
|
274
276
|
children: (0, _util2.formatRecurring)(recurring[x], true, "", locale)
|
|
275
277
|
}, x))
|
|
276
278
|
})
|
|
277
|
-
}), currencyList.length > 0 && /* @__PURE__ */(0, _jsxRuntime.jsx)(_material.Select, {
|
|
279
|
+
}), currencyList.length > 0 && !hideCurrency && /* @__PURE__ */(0, _jsxRuntime.jsx)(_material.Select, {
|
|
278
280
|
value: currency?.id,
|
|
279
281
|
onChange: e => setCurrency(currencyList.find(v => v?.id === e.target.value)),
|
|
280
282
|
size: "small",
|
|
@@ -67,6 +67,7 @@ const InvoiceTable = _react.default.memo(props => {
|
|
|
67
67
|
currency_id,
|
|
68
68
|
subscription_id,
|
|
69
69
|
include_staking,
|
|
70
|
+
include_return_staking,
|
|
70
71
|
include_recovered_from,
|
|
71
72
|
onTableDataChange
|
|
72
73
|
} = props;
|
|
@@ -93,6 +94,7 @@ const InvoiceTable = _react.default.memo(props => {
|
|
|
93
94
|
currency_id,
|
|
94
95
|
subscription_id,
|
|
95
96
|
include_staking,
|
|
97
|
+
include_return_staking,
|
|
96
98
|
include_recovered_from,
|
|
97
99
|
ignore_zero: true
|
|
98
100
|
}), {
|
|
@@ -135,6 +137,23 @@ const InvoiceTable = _react.default.memo(props => {
|
|
|
135
137
|
});
|
|
136
138
|
}
|
|
137
139
|
}
|
|
140
|
+
}, {
|
|
141
|
+
label: t("common.type"),
|
|
142
|
+
name: "billing_reason",
|
|
143
|
+
options: {
|
|
144
|
+
customBodyRenderLite: (_, index) => {
|
|
145
|
+
const invoice = data.list[index];
|
|
146
|
+
const link = getInvoiceLink(invoice, action);
|
|
147
|
+
return /* @__PURE__ */(0, _jsxRuntime.jsx)("a", {
|
|
148
|
+
href: link.url,
|
|
149
|
+
target: link.external ? "_blank" : target,
|
|
150
|
+
rel: "noreferrer",
|
|
151
|
+
children: /* @__PURE__ */(0, _jsxRuntime.jsx)(_status.default, {
|
|
152
|
+
label: (0, _util.getInvoiceDescriptionAndReason)(invoice, locale)?.type
|
|
153
|
+
})
|
|
154
|
+
});
|
|
155
|
+
}
|
|
156
|
+
}
|
|
138
157
|
}, {
|
|
139
158
|
label: t("payment.customer.invoice.invoiceNumber"),
|
|
140
159
|
name: "number",
|
|
@@ -177,7 +196,7 @@ const InvoiceTable = _react.default.memo(props => {
|
|
|
177
196
|
href: link.url,
|
|
178
197
|
target: link.external ? "_blank" : target,
|
|
179
198
|
rel: "noreferrer",
|
|
180
|
-
children: invoice
|
|
199
|
+
children: (0, _util.getInvoiceDescriptionAndReason)(invoice, locale)?.description || invoice.id
|
|
181
200
|
});
|
|
182
201
|
}
|
|
183
202
|
}
|
package/lib/libs/util.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import type { PaymentDetails, PriceCurrency, PriceRecurring, TLineItemExpanded, TPaymentCurrency, TPaymentCurrencyExpanded, TPaymentMethod, TPaymentMethodExpanded, TPrice, TProductExpanded, TSubscriptionExpanded, TSubscriptionItemExpanded } from '@blocklet/payment-types';
|
|
2
|
+
import type { PaymentDetails, PriceCurrency, PriceRecurring, TInvoiceExpanded, TLineItemExpanded, TPaymentCurrency, TPaymentCurrencyExpanded, TPaymentMethod, TPaymentMethodExpanded, TPrice, TProductExpanded, TSubscriptionExpanded, TSubscriptionItemExpanded } from '@blocklet/payment-types';
|
|
3
3
|
import { ActionProps, PricingRenderProps } from '../types';
|
|
4
4
|
export declare const PAYMENT_KIT_DID = "z2qaCNvKMv5GjouKdcDWexv6WqtHbpNPQDnAk";
|
|
5
5
|
export declare const isPaymentKitMounted: () => any;
|
|
@@ -108,3 +108,9 @@ export declare function getWordBreakStyle(value: any): 'break-word' | 'break-all
|
|
|
108
108
|
export declare function isMobileSafari(): boolean;
|
|
109
109
|
export declare function truncateText(text: string, maxLength: number, useWidth?: boolean): string;
|
|
110
110
|
export declare function getCustomerAvatar(did: string | undefined, updated_at: string | number | undefined, imageSize?: number): string;
|
|
111
|
+
export declare function hasDelegateTxHash(details: PaymentDetails, paymentMethod: TPaymentMethod): any;
|
|
112
|
+
export declare function getInvoiceDescriptionAndReason(invoice: TInvoiceExpanded, locale?: string): {
|
|
113
|
+
description: string | undefined;
|
|
114
|
+
reason: string;
|
|
115
|
+
type: string;
|
|
116
|
+
};
|
package/lib/libs/util.js
CHANGED
|
@@ -30,6 +30,7 @@ exports.formatUpsellSaving = formatUpsellSaving;
|
|
|
30
30
|
exports.getCheckoutAmount = getCheckoutAmount;
|
|
31
31
|
exports.getCustomerAvatar = getCustomerAvatar;
|
|
32
32
|
exports.getFreeTrialTime = getFreeTrialTime;
|
|
33
|
+
exports.getInvoiceDescriptionAndReason = getInvoiceDescriptionAndReason;
|
|
33
34
|
exports.getInvoiceStatusColor = getInvoiceStatusColor;
|
|
34
35
|
exports.getPaymentIntentStatusColor = getPaymentIntentStatusColor;
|
|
35
36
|
exports.getPayoutStatusColor = getPayoutStatusColor;
|
|
@@ -45,6 +46,7 @@ exports.getSubscriptionStatusColor = getSubscriptionStatusColor;
|
|
|
45
46
|
exports.getTxLink = exports.getSubscriptionTimeSummary = void 0;
|
|
46
47
|
exports.getWebhookStatusColor = getWebhookStatusColor;
|
|
47
48
|
exports.getWordBreakStyle = getWordBreakStyle;
|
|
49
|
+
exports.hasDelegateTxHash = hasDelegateTxHash;
|
|
48
50
|
exports.isMobileSafari = isMobileSafari;
|
|
49
51
|
exports.isPaymentKitMounted = void 0;
|
|
50
52
|
exports.isValidCountry = isValidCountry;
|
|
@@ -827,6 +829,13 @@ const flattenPaymentMethods = (methods = []) => {
|
|
|
827
829
|
};
|
|
828
830
|
exports.flattenPaymentMethods = flattenPaymentMethods;
|
|
829
831
|
const getTxLink = (method, details) => {
|
|
832
|
+
if (!details) {
|
|
833
|
+
return {
|
|
834
|
+
text: "N/A",
|
|
835
|
+
link: "",
|
|
836
|
+
gas: ""
|
|
837
|
+
};
|
|
838
|
+
}
|
|
830
839
|
if (method.type === "arcblock" && details.arcblock?.tx_hash) {
|
|
831
840
|
return {
|
|
832
841
|
link: (0, _ufo.joinURL)(method.settings.arcblock?.explorer_host, "/txs", details.arcblock?.tx_hash),
|
|
@@ -1014,4 +1023,46 @@ function truncateText(text, maxLength, useWidth = false) {
|
|
|
1014
1023
|
function getCustomerAvatar(did, updated_at, imageSize = 48) {
|
|
1015
1024
|
const updated = typeof updated_at === "number" ? updated_at : (0, _dayjs.default)(updated_at).unix();
|
|
1016
1025
|
return `/.well-known/service/user/avatar/${did}?imageFilter=resize&w=${imageSize}&h=${imageSize}&updateAt=${updated || (0, _dayjs.default)().unix()}`;
|
|
1026
|
+
}
|
|
1027
|
+
function hasDelegateTxHash(details, paymentMethod) {
|
|
1028
|
+
return paymentMethod?.type && ["arcblock", "ethereum"].includes(paymentMethod?.type) &&
|
|
1029
|
+
// @ts-ignore
|
|
1030
|
+
details?.[paymentMethod?.type]?.tx_hash;
|
|
1031
|
+
}
|
|
1032
|
+
function getInvoiceDescriptionAndReason(invoice, locale = "en") {
|
|
1033
|
+
const {
|
|
1034
|
+
billing_reason: reason,
|
|
1035
|
+
description
|
|
1036
|
+
} = invoice;
|
|
1037
|
+
const reasonMap = {
|
|
1038
|
+
subscription_create: (0, _locales.t)("payment.invoice.reason.creation", locale),
|
|
1039
|
+
subscription_cycle: (0, _locales.t)("payment.invoice.reason.cycle", locale),
|
|
1040
|
+
subscription_update: (0, _locales.t)("payment.invoice.reason.update", locale),
|
|
1041
|
+
subscription_recover: (0, _locales.t)("payment.invoice.reason.recover", locale),
|
|
1042
|
+
subscription_threshold: (0, _locales.t)("payment.invoice.reason.threshold", locale),
|
|
1043
|
+
subscription_cancel: (0, _locales.t)("payment.invoice.reason.cancel", locale),
|
|
1044
|
+
manual: (0, _locales.t)("payment.invoice.reason.manual", locale),
|
|
1045
|
+
upcoming: (0, _locales.t)("payment.invoice.reason.upcoming", locale),
|
|
1046
|
+
slash_stake: (0, _locales.t)("payment.invoice.reason.slashStake", locale),
|
|
1047
|
+
stake: (0, _locales.t)("payment.invoice.reason.stake", locale),
|
|
1048
|
+
return_stake: (0, _locales.t)("payment.invoice.reason.returnStake", locale)
|
|
1049
|
+
};
|
|
1050
|
+
if (description?.startsWith("Subscription ") || description?.startsWith("Slash stake")) {
|
|
1051
|
+
return {
|
|
1052
|
+
description: reasonMap[reason],
|
|
1053
|
+
reason: reasonMap[reason],
|
|
1054
|
+
type: reason.includes("stake") ? reasonMap[reason] : (0, _locales.t)("payment.invoice.reason.payment", locale)
|
|
1055
|
+
};
|
|
1056
|
+
}
|
|
1057
|
+
const descMap = {
|
|
1058
|
+
"Stake for subscription plan change": (0, _locales.t)("payment.invoice.reason.stakeForChangePlan", locale),
|
|
1059
|
+
"Stake for subscription payment change": (0, _locales.t)("payment.invoice.reason.stakeForChangePayment", locale),
|
|
1060
|
+
"Stake for subscription": (0, _locales.t)("payment.invoice.reason.staking", locale),
|
|
1061
|
+
"Return Subscription staking": (0, _locales.t)("payment.invoice.reason.returnStake", locale)
|
|
1062
|
+
};
|
|
1063
|
+
return {
|
|
1064
|
+
description: descMap[description] || description,
|
|
1065
|
+
reason: reasonMap[reason] || reason,
|
|
1066
|
+
type: reason.includes("stake") ? reasonMap[reason] : (0, _locales.t)("payment.invoice.reason.payment", locale)
|
|
1067
|
+
};
|
|
1017
1068
|
}
|
package/lib/locales/en.js
CHANGED
|
@@ -95,7 +95,9 @@ module.exports = (0, _flat.default)({
|
|
|
95
95
|
quantityLimitPerCheckout: "Exceed purchase limit",
|
|
96
96
|
quantityNotEnough: "Exceed inventory",
|
|
97
97
|
amountPrecisionLimit: "Amount decimal places must be less than or equal to {precision}",
|
|
98
|
-
saveAsDefaultPriceSuccess: "Set default price successfully"
|
|
98
|
+
saveAsDefaultPriceSuccess: "Set default price successfully",
|
|
99
|
+
stakeAmount: "Stake Amount",
|
|
100
|
+
slashStakeAmount: "Slash Stake Amount"
|
|
99
101
|
},
|
|
100
102
|
payment: {
|
|
101
103
|
checkout: {
|
|
@@ -312,7 +314,12 @@ module.exports = (0, _flat.default)({
|
|
|
312
314
|
cancel: "Subscription cancel",
|
|
313
315
|
manual: "Manual invoice",
|
|
314
316
|
upcoming: "Upcoming invoice",
|
|
315
|
-
slashStake: "Slash stake"
|
|
317
|
+
slashStake: "Slash stake",
|
|
318
|
+
stake: "Stake",
|
|
319
|
+
payment: "Payment",
|
|
320
|
+
returnStake: "Return stake",
|
|
321
|
+
stakeForChangePlan: "Subscription plan update",
|
|
322
|
+
stakeForChangePayment: "Subscription payment method update"
|
|
316
323
|
}
|
|
317
324
|
}
|
|
318
325
|
},
|
package/lib/locales/zh.js
CHANGED
|
@@ -95,7 +95,9 @@ module.exports = (0, _flat.default)({
|
|
|
95
95
|
quantityLimitPerCheckout: "\u8D85\u51FA\u8D2D\u4E70\u9650\u5236",
|
|
96
96
|
quantityNotEnough: "\u5E93\u5B58\u4E0D\u8DB3",
|
|
97
97
|
amountPrecisionLimit: "\u91D1\u989D\u5C0F\u6570\u4F4D\u6570\u5FC5\u987B\u5728 {precision} \u4F4D\u4EE5\u5185",
|
|
98
|
-
saveAsDefaultPriceSuccess: "\u8BBE\u7F6E\u9ED8\u8BA4\u4EF7\u683C\u6210\u529F"
|
|
98
|
+
saveAsDefaultPriceSuccess: "\u8BBE\u7F6E\u9ED8\u8BA4\u4EF7\u683C\u6210\u529F",
|
|
99
|
+
stakeAmount: "\u8D28\u62BC\u91D1\u989D",
|
|
100
|
+
slashStakeAmount: "\u7F5A\u6CA1\u91D1\u989D"
|
|
99
101
|
},
|
|
100
102
|
payment: {
|
|
101
103
|
checkout: {
|
|
@@ -305,14 +307,19 @@ module.exports = (0, _flat.default)({
|
|
|
305
307
|
reason: {
|
|
306
308
|
creation: "\u8BA2\u9605\u521B\u5EFA",
|
|
307
309
|
cycle: "\u81EA\u52A8\u6263\u8D39",
|
|
308
|
-
staking: "\u8BA2\u9605\u521B\u5EFA
|
|
310
|
+
staking: "\u8BA2\u9605\u521B\u5EFA",
|
|
309
311
|
update: "\u8BA2\u9605\u66F4\u65B0",
|
|
310
312
|
recover: "\u8BA2\u9605\u6062\u590D",
|
|
311
313
|
threshold: "\u7528\u91CF\u8D26\u5355",
|
|
312
314
|
cancel: "\u8BA2\u9605\u53D6\u6D88",
|
|
313
315
|
manual: "\u4EBA\u5DE5\u8D26\u5355",
|
|
314
316
|
upcoming: "\u672A\u6765\u8D26\u5355",
|
|
315
|
-
slashStake: "\u7F5A\u6CA1\u8D28\u62BC"
|
|
317
|
+
slashStake: "\u7F5A\u6CA1\u8D28\u62BC",
|
|
318
|
+
stake: "\u62BC\u91D1",
|
|
319
|
+
payment: "\u4ED8\u6B3E",
|
|
320
|
+
returnStake: "\u9000\u62BC\u91D1",
|
|
321
|
+
stakeForChangePlan: "\u8BA2\u9605\u5957\u9910\u66F4\u65B0",
|
|
322
|
+
stakeForChangePayment: "\u8BA2\u9605\u652F\u4ED8\u65B9\u5F0F\u66F4\u65B0"
|
|
316
323
|
}
|
|
317
324
|
}
|
|
318
325
|
},
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@blocklet/payment-react",
|
|
3
|
-
"version": "1.15.
|
|
3
|
+
"version": "1.15.34",
|
|
4
4
|
"description": "Reusable react components for payment kit v2",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"react",
|
|
@@ -92,7 +92,7 @@
|
|
|
92
92
|
"@babel/core": "^7.25.2",
|
|
93
93
|
"@babel/preset-env": "^7.25.2",
|
|
94
94
|
"@babel/preset-react": "^7.24.7",
|
|
95
|
-
"@blocklet/payment-types": "1.15.
|
|
95
|
+
"@blocklet/payment-types": "1.15.34",
|
|
96
96
|
"@storybook/addon-essentials": "^7.6.20",
|
|
97
97
|
"@storybook/addon-interactions": "^7.6.20",
|
|
98
98
|
"@storybook/addon-links": "^7.6.20",
|
|
@@ -122,5 +122,5 @@
|
|
|
122
122
|
"vite-plugin-babel": "^1.2.0",
|
|
123
123
|
"vite-plugin-node-polyfills": "^0.21.0"
|
|
124
124
|
},
|
|
125
|
-
"gitHead": "
|
|
125
|
+
"gitHead": "95c0d3ddd12382f694014c05015ca46c19424e3e"
|
|
126
126
|
}
|
|
@@ -72,15 +72,17 @@ type Props = {
|
|
|
72
72
|
alignItems?: 'center' | 'left';
|
|
73
73
|
mode?: 'checkout' | 'select';
|
|
74
74
|
interval?: string;
|
|
75
|
+
hideCurrency?: boolean;
|
|
75
76
|
};
|
|
76
77
|
|
|
77
78
|
PricingTable.defaultProps = {
|
|
78
79
|
alignItems: 'center',
|
|
79
80
|
mode: 'checkout',
|
|
80
81
|
interval: '',
|
|
82
|
+
hideCurrency: false,
|
|
81
83
|
};
|
|
82
84
|
|
|
83
|
-
export default function PricingTable({ table, alignItems, interval, mode, onSelect }: Props) {
|
|
85
|
+
export default function PricingTable({ table, alignItems, interval, mode, onSelect, hideCurrency }: Props) {
|
|
84
86
|
const { t, locale } = useLocaleContext();
|
|
85
87
|
const { isMobile } = useMobile();
|
|
86
88
|
const {
|
|
@@ -291,7 +293,7 @@ export default function PricingTable({ table, alignItems, interval, mode, onSele
|
|
|
291
293
|
)}
|
|
292
294
|
</Box>
|
|
293
295
|
)}
|
|
294
|
-
{currencyList.length > 0 && (
|
|
296
|
+
{currencyList.length > 0 && !hideCurrency && (
|
|
295
297
|
<Select
|
|
296
298
|
value={currency?.id}
|
|
297
299
|
onChange={(e) => setCurrency(currencyList.find((v) => v?.id === e.target.value))}
|
|
@@ -23,6 +23,7 @@ import {
|
|
|
23
23
|
formatError,
|
|
24
24
|
formatToDate,
|
|
25
25
|
formatToDatetime,
|
|
26
|
+
getInvoiceDescriptionAndReason,
|
|
26
27
|
getInvoiceStatusColor,
|
|
27
28
|
getPrefix,
|
|
28
29
|
getTxLink,
|
|
@@ -58,6 +59,7 @@ type Props = {
|
|
|
58
59
|
subscription_id?: string;
|
|
59
60
|
currency_id?: string;
|
|
60
61
|
include_staking?: boolean;
|
|
62
|
+
include_return_staking?: boolean;
|
|
61
63
|
include_recovered_from?: boolean;
|
|
62
64
|
status?: string;
|
|
63
65
|
pageSize?: number;
|
|
@@ -97,6 +99,7 @@ const InvoiceTable = React.memo((props: Props & { onPay: (invoiceId: string) =>
|
|
|
97
99
|
currency_id,
|
|
98
100
|
subscription_id,
|
|
99
101
|
include_staking,
|
|
102
|
+
include_return_staking,
|
|
100
103
|
include_recovered_from,
|
|
101
104
|
onTableDataChange,
|
|
102
105
|
} = props;
|
|
@@ -120,6 +123,7 @@ const InvoiceTable = React.memo((props: Props & { onPay: (invoiceId: string) =>
|
|
|
120
123
|
currency_id,
|
|
121
124
|
subscription_id,
|
|
122
125
|
include_staking,
|
|
126
|
+
include_return_staking,
|
|
123
127
|
include_recovered_from,
|
|
124
128
|
ignore_zero: true,
|
|
125
129
|
}),
|
|
@@ -169,6 +173,21 @@ const InvoiceTable = React.memo((props: Props & { onPay: (invoiceId: string) =>
|
|
|
169
173
|
},
|
|
170
174
|
},
|
|
171
175
|
},
|
|
176
|
+
{
|
|
177
|
+
label: t('common.type'),
|
|
178
|
+
name: 'billing_reason',
|
|
179
|
+
options: {
|
|
180
|
+
customBodyRenderLite: (_: string, index: number) => {
|
|
181
|
+
const invoice = data.list[index] as TInvoiceExpanded;
|
|
182
|
+
const link = getInvoiceLink(invoice, action);
|
|
183
|
+
return (
|
|
184
|
+
<a href={link.url} target={link.external ? '_blank' : target} rel="noreferrer">
|
|
185
|
+
<Status label={getInvoiceDescriptionAndReason(invoice, locale)?.type} />
|
|
186
|
+
</a>
|
|
187
|
+
);
|
|
188
|
+
},
|
|
189
|
+
},
|
|
190
|
+
},
|
|
172
191
|
{
|
|
173
192
|
label: t('payment.customer.invoice.invoiceNumber'),
|
|
174
193
|
name: 'number',
|
|
@@ -209,7 +228,7 @@ const InvoiceTable = React.memo((props: Props & { onPay: (invoiceId: string) =>
|
|
|
209
228
|
const link = getInvoiceLink(invoice, action);
|
|
210
229
|
return (
|
|
211
230
|
<a href={link.url} target={link.external ? '_blank' : target} rel="noreferrer">
|
|
212
|
-
{invoice
|
|
231
|
+
{getInvoiceDescriptionAndReason(invoice, locale)?.description || invoice.id}
|
|
213
232
|
</a>
|
|
214
233
|
);
|
|
215
234
|
},
|
package/src/libs/util.ts
CHANGED
|
@@ -4,6 +4,7 @@ import type {
|
|
|
4
4
|
PaymentDetails,
|
|
5
5
|
PriceCurrency,
|
|
6
6
|
PriceRecurring,
|
|
7
|
+
TInvoiceExpanded,
|
|
7
8
|
TLineItemExpanded,
|
|
8
9
|
TPaymentCurrency,
|
|
9
10
|
TPaymentCurrencyExpanded,
|
|
@@ -890,6 +891,9 @@ export const flattenPaymentMethods = (methods: TPaymentMethodExpanded[] = []) =>
|
|
|
890
891
|
};
|
|
891
892
|
|
|
892
893
|
export const getTxLink = (method: TPaymentMethod, details: PaymentDetails) => {
|
|
894
|
+
if (!details) {
|
|
895
|
+
return { text: 'N/A', link: '', gas: '' };
|
|
896
|
+
}
|
|
893
897
|
if (method.type === 'arcblock' && details.arcblock?.tx_hash) {
|
|
894
898
|
return {
|
|
895
899
|
link: joinURL(method.settings.arcblock?.explorer_host as string, '/txs', details.arcblock?.tx_hash as string),
|
|
@@ -1092,3 +1096,52 @@ export function getCustomerAvatar(
|
|
|
1092
1096
|
const updated = typeof updated_at === 'number' ? updated_at : dayjs(updated_at).unix();
|
|
1093
1097
|
return `/.well-known/service/user/avatar/${did}?imageFilter=resize&w=${imageSize}&h=${imageSize}&updateAt=${updated || dayjs().unix()}`;
|
|
1094
1098
|
}
|
|
1099
|
+
|
|
1100
|
+
// 判断是否存在txHash
|
|
1101
|
+
export function hasDelegateTxHash(details: PaymentDetails, paymentMethod: TPaymentMethod) {
|
|
1102
|
+
return (
|
|
1103
|
+
paymentMethod?.type &&
|
|
1104
|
+
['arcblock', 'ethereum'].includes(paymentMethod?.type) &&
|
|
1105
|
+
// @ts-ignore
|
|
1106
|
+
details?.[paymentMethod?.type]?.tx_hash
|
|
1107
|
+
);
|
|
1108
|
+
}
|
|
1109
|
+
|
|
1110
|
+
export function getInvoiceDescriptionAndReason(invoice: TInvoiceExpanded, locale = 'en') {
|
|
1111
|
+
const { billing_reason: reason, description } = invoice;
|
|
1112
|
+
const reasonMap = {
|
|
1113
|
+
subscription_create: t('payment.invoice.reason.creation', locale),
|
|
1114
|
+
subscription_cycle: t('payment.invoice.reason.cycle', locale),
|
|
1115
|
+
subscription_update: t('payment.invoice.reason.update', locale),
|
|
1116
|
+
subscription_recover: t('payment.invoice.reason.recover', locale),
|
|
1117
|
+
subscription_threshold: t('payment.invoice.reason.threshold', locale),
|
|
1118
|
+
subscription_cancel: t('payment.invoice.reason.cancel', locale),
|
|
1119
|
+
manual: t('payment.invoice.reason.manual', locale),
|
|
1120
|
+
upcoming: t('payment.invoice.reason.upcoming', locale),
|
|
1121
|
+
slash_stake: t('payment.invoice.reason.slashStake', locale),
|
|
1122
|
+
stake: t('payment.invoice.reason.stake', locale),
|
|
1123
|
+
return_stake: t('payment.invoice.reason.returnStake', locale),
|
|
1124
|
+
};
|
|
1125
|
+
if (description?.startsWith('Subscription ') || description?.startsWith('Slash stake')) {
|
|
1126
|
+
return {
|
|
1127
|
+
description: reasonMap[reason as keyof typeof reasonMap],
|
|
1128
|
+
reason: reasonMap[reason as keyof typeof reasonMap],
|
|
1129
|
+
type: reason.includes('stake')
|
|
1130
|
+
? reasonMap[reason as keyof typeof reasonMap]
|
|
1131
|
+
: t('payment.invoice.reason.payment', locale),
|
|
1132
|
+
};
|
|
1133
|
+
}
|
|
1134
|
+
const descMap = {
|
|
1135
|
+
'Stake for subscription plan change': t('payment.invoice.reason.stakeForChangePlan', locale),
|
|
1136
|
+
'Stake for subscription payment change': t('payment.invoice.reason.stakeForChangePayment', locale),
|
|
1137
|
+
'Stake for subscription': t('payment.invoice.reason.staking', locale),
|
|
1138
|
+
'Return Subscription staking': t('payment.invoice.reason.returnStake', locale),
|
|
1139
|
+
};
|
|
1140
|
+
return {
|
|
1141
|
+
description: descMap[description as keyof typeof descMap] || description,
|
|
1142
|
+
reason: reasonMap[reason as keyof typeof reasonMap] || reason,
|
|
1143
|
+
type: reason.includes('stake')
|
|
1144
|
+
? reasonMap[reason as keyof typeof reasonMap]
|
|
1145
|
+
: t('payment.invoice.reason.payment', locale),
|
|
1146
|
+
};
|
|
1147
|
+
}
|
package/src/locales/en.tsx
CHANGED
|
@@ -91,6 +91,8 @@ export default flat({
|
|
|
91
91
|
quantityNotEnough: 'Exceed inventory',
|
|
92
92
|
amountPrecisionLimit: 'Amount decimal places must be less than or equal to {precision}',
|
|
93
93
|
saveAsDefaultPriceSuccess: 'Set default price successfully',
|
|
94
|
+
stakeAmount: 'Stake Amount',
|
|
95
|
+
slashStakeAmount: 'Slash Stake Amount',
|
|
94
96
|
},
|
|
95
97
|
payment: {
|
|
96
98
|
checkout: {
|
|
@@ -319,6 +321,11 @@ export default flat({
|
|
|
319
321
|
manual: 'Manual invoice',
|
|
320
322
|
upcoming: 'Upcoming invoice',
|
|
321
323
|
slashStake: 'Slash stake',
|
|
324
|
+
stake: 'Stake',
|
|
325
|
+
payment: 'Payment',
|
|
326
|
+
returnStake: 'Return stake',
|
|
327
|
+
stakeForChangePlan: 'Subscription plan update',
|
|
328
|
+
stakeForChangePayment: 'Subscription payment method update',
|
|
322
329
|
},
|
|
323
330
|
},
|
|
324
331
|
},
|
package/src/locales/zh.tsx
CHANGED
|
@@ -91,6 +91,8 @@ export default flat({
|
|
|
91
91
|
quantityNotEnough: '库存不足',
|
|
92
92
|
amountPrecisionLimit: '金额小数位数必须在 {precision} 位以内',
|
|
93
93
|
saveAsDefaultPriceSuccess: '设置默认价格成功',
|
|
94
|
+
stakeAmount: '质押金额',
|
|
95
|
+
slashStakeAmount: '罚没金额',
|
|
94
96
|
},
|
|
95
97
|
payment: {
|
|
96
98
|
checkout: {
|
|
@@ -301,7 +303,7 @@ export default flat({
|
|
|
301
303
|
reason: {
|
|
302
304
|
creation: '订阅创建',
|
|
303
305
|
cycle: '自动扣费',
|
|
304
|
-
staking: '
|
|
306
|
+
staking: '订阅创建',
|
|
305
307
|
update: '订阅更新',
|
|
306
308
|
recover: '订阅恢复',
|
|
307
309
|
threshold: '用量账单',
|
|
@@ -309,6 +311,11 @@ export default flat({
|
|
|
309
311
|
manual: '人工账单',
|
|
310
312
|
upcoming: '未来账单',
|
|
311
313
|
slashStake: '罚没质押',
|
|
314
|
+
stake: '押金',
|
|
315
|
+
payment: '付款',
|
|
316
|
+
returnStake: '退押金',
|
|
317
|
+
stakeForChangePlan: '订阅套餐更新',
|
|
318
|
+
stakeForChangePayment: '订阅支付方式更新',
|
|
312
319
|
},
|
|
313
320
|
},
|
|
314
321
|
},
|