payment-kit 1.13.296 → 1.13.298

package/api/src/libs/api.ts

@@ -1,3 +1,4 @@
+import { BN, fromTokenToUnit } from '@ocap/util';
 import Joi from 'joi';
 import { Op } from 'sequelize';
 import SqlWhereParser from 'sql-where-parser';
@@ -136,3 +137,19 @@ export function createListParamSchema<T>(schema: any, pageSize: number = 20) {
     ...schema,
   });
 }
+
+export const BNPositiveValidator = Joi.string().custom((value, helpers) => {
+  if (!/^\d+(\.\d+)?$/.test(value)) {
+    return helpers.error('any.invalid');
+  }
+  try {
+    const valueInWei = fromTokenToUnit(value, 18).toString();
+    const bnValue = new BN(valueInWei);
+    if (bnValue.isNeg() || bnValue.isZero()) {
+      return helpers.error('any.invalid');
+    }
+  } catch (error) {
+    return helpers.error('any.invalid');
+  }
+  return value;
+}, 'BN Positive Validation');

package/api/src/libs/refund.ts

@@ -0,0 +1,59 @@
+import { BN } from '@ocap/util';
+import type { WhereOptions } from 'sequelize';
+import { PaymentIntent, Refund } from '../store/models';
+
+export async function getRefundAmountSetup({
+  currencyId,
+  customerId,
+  subscriptionId,
+  PaymentMethodId,
+  paymentIntentId,
+}: {
+  currencyId?: string;
+  customerId?: string;
+  subscriptionId?: string;
+  PaymentMethodId?: string;
+  paymentIntentId: string;
+}) {
+  const paymentIntent = await PaymentIntent.findByPk(paymentIntentId);
+  if (!paymentIntent) {
+    throw new Error('PaymentIntent not found');
+  }
+  const where: WhereOptions<Refund> = {
+    status: ['succeeded'],
+    payment_intent_id: paymentIntentId,
+  };
+  if (currencyId) {
+    where.currency_id = currencyId;
+  }
+  if (customerId) {
+    where.customer_id = customerId;
+  }
+  if (subscriptionId) {
+    where.subscription_id = subscriptionId;
+  }
+  if (PaymentMethodId) {
+    where.payment_method_id = PaymentMethodId;
+  }
+  const { rows: list, count } = await Refund.findAndCountAll({
+    where,
+    include: [],
+  });
+  if (count === 0) {
+    return {
+      amount: paymentIntent.amount_received,
+      totalAmount: paymentIntent.amount_received,
+    };
+  }
+  let refundedAmountBN = new BN('0');
+  list.forEach((refund) => {
+    if (refund) {
+      refundedAmountBN = refundedAmountBN.add(new BN(refund.amount || '0'));
+    }
+  });
+
+  return {
+    amount: new BN(paymentIntent.amount_received).sub(refundedAmountBN).toString(),
+    totalAmount: paymentIntent.amount_received,
+  };
+}

package/api/src/routes/payment-intents.ts

@@ -3,9 +3,10 @@ import { Router } from 'express';
 import Joi from 'joi';
 import pick from 'lodash/pick';
 
+import { BN, fromTokenToUnit } from '@ocap/util';
 import { syncStripeInvoice } from '../integrations/stripe/handlers/invoice';
 import { syncStripePayment } from '../integrations/stripe/handlers/payment-intent';
-import { createListParamSchema, getWhereFromKvQuery, getWhereFromQuery } from '../libs/api';
+import { BNPositiveValidator, createListParamSchema, getWhereFromKvQuery, getWhereFromQuery } from '../libs/api';
 import { authenticate } from '../libs/security';
 import { formatMetadata } from '../libs/util';
 import { paymentQueue } from '../queues/payment';
@@ -16,6 +17,9 @@ import { PaymentCurrency } from '../store/models/payment-currency';
 import { PaymentIntent } from '../store/models/payment-intent';
 import { PaymentMethod } from '../store/models/payment-method';
 import { Subscription } from '../store/models/subscription';
+import logger from '../libs/logger';
+import { Refund } from '../store/models';
+import { getRefundAmountSetup } from '../libs/refund';
 
 const router = Router();
 const authAdmin = authenticate<PaymentIntent>({ component: true, roles: ['owner', 'admin'] });
@@ -30,6 +34,16 @@ const authPortal = authenticate<PaymentIntent>({
   },
 });
 
+async function syncStripePaymentAndInvoice(paymentIntent: PaymentIntent, invoice: Invoice | null, req: any) {
+  const shouldSync = paymentIntent.status !== 'succeeded' || req.query.sync === '1';
+  if (shouldSync) {
+    await syncStripePayment(paymentIntent);
+  }
+  if (invoice?.metadata?.stripe_id) {
+    await syncStripeInvoice(invoice);
+  }
+}
+
 // list payment intents
 const paginationSchema = createListParamSchema<{
   status?: string;
@@ -156,14 +170,8 @@ router.get('/:id', authPortal, async (req, res) => {
     let subscription;
 
     if (doc) {
-      const shouldSync = doc.status !== 'succeeded' || req.query.sync === '1';
-      if (shouldSync) {
-        await syncStripePayment(doc);
-      }
       invoice = await Invoice.findByPk(doc.invoice_id);
-      if (invoice?.metadata?.stripe_id) {
-        await syncStripeInvoice(invoice);
-      }
+      await syncStripePaymentAndInvoice(doc, invoice, req);
 
       checkoutSession = await CheckoutSession.findOne({ where: { payment_intent_id: doc.id } });
       if (invoice && invoice.subscription_id) {
@@ -229,4 +237,109 @@ router.get('/:id/retry', authAdmin, async (req, res) => {
   }
 });
 
+const refundRequestSchema = Joi.object({
+  amount: BNPositiveValidator.required(),
+  reason: Joi.string()
+    .valid('duplicate', 'requested_by_customer', 'requested_by_admin', 'fraudulent', 'expired_uncaptured_charge')
+    .required(),
+  description: Joi.string().required(),
+  metadata: Joi.object().optional(),
+});
+
+router.put('/:id/refund', authAdmin, async (req, res) => {
+  try {
+    const { error } = refundRequestSchema.validate(req.body);
+    if (error) {
+      res.status(400).json({ error: `payment intent refund request invalid: ${error.message}` });
+    }
+    const doc = await PaymentIntent.findOne({
+      where: { id: req.params.id },
+      include: [{ model: PaymentCurrency, as: 'paymentCurrency' }],
+    });
+    if (!doc) {
+      throw new Error('PaymentIntent not found');
+    }
+    const invoice = await Invoice.findByPk(doc.invoice_id);
+    await syncStripePaymentAndInvoice(doc, invoice, req);
+    // @ts-ignore
+    const result = await getRefundAmountSetup({
+      paymentIntentId: doc.id,
+      currencyId: doc.currency_id,
+      customerId: doc.customer_id,
+      subscriptionId: invoice?.subscription_id,
+    });
+    if (!result) {
+      throw new Error('refund amount setup failed');
+    }
+    // @ts-ignore
+    const amount = fromTokenToUnit(req.body.amount, doc.paymentCurrency?.decimal).toString();
+    const amountBN = new BN(amount);
+
+    if (amountBN.gt(new BN(result.amount))) {
+      throw new Error('refund amount exceeds the available amount');
+    }
+
+    const item = await Refund.create({
+      type: 'refund',
+      livemode: doc.livemode,
+      amount,
+      description: req.body.description || 'payment_intent_cancel',
+      status: 'pending',
+      reason: req.body.reason || 'requested_by_admin',
+      currency_id: doc.currency_id,
+      customer_id: doc.customer_id || '',
+      payment_method_id: doc.payment_method_id,
+      payment_intent_id: doc.id,
+      invoice_id: doc.invoice_id,
+      subscription_id: invoice?.subscription_id,
+      attempt_count: 0,
+      attempted: false,
+      next_attempt: 0,
+      last_attempt_error: null,
+      starting_balance: '0',
+      ending_balance: '0',
+      starting_token_balance: {},
+      ending_token_balance: {},
+      metadata: {
+        requested_by: req.user?.did,
+      },
+    });
+    logger.info('payment intent refund created', {
+      ...req.params,
+      ...req.body,
+      ...pick(result, ['amount', 'totalAmount']),
+      item: item.toJSON(),
+    });
+    res.json(item.toJSON());
+  } catch (err) {
+    console.error(err);
+    res.status(500).json({ error: `Failed to payment intent refund: ${err.message}` });
+  }
+});
+
+router.get('/:id/refundable-amount', authPortal, async (req, res) => {
+  try {
+    const doc = await PaymentIntent.findOne({
+      where: { id: req.params.id },
+    });
+
+    if (doc) {
+      const invoice = await Invoice.findByPk(doc.invoice_id);
+      await syncStripePaymentAndInvoice(doc, invoice, req);
+      const result = await getRefundAmountSetup({
+        paymentIntentId: doc.id,
+        currencyId: doc.currency_id,
+        customerId: doc.customer_id,
+        subscriptionId: invoice?.subscription_id,
+      });
+      res.json(result);
+    } else {
+      res.status(404).json(null);
+    }
+  } catch (err) {
+    console.error(err);
+    res.status(500).json({ error: `Failed to get payment intent refundable amount: ${err.message}` });
+  }
+});
+
 export default router;

package/api/src/routes/payment-links.ts

@@ -1,6 +1,7 @@
 import { Joi } from '@arcblock/validator';
 import { Router } from 'express';
 import pick from 'lodash/pick';
+import { Op } from 'sequelize';
 import type { WhereOptions } from 'sequelize';
 
 import { createListParamSchema } from '../libs/api';
@@ -153,7 +154,10 @@ router.post('/', auth, async (req, res) => {
 });
 
 // list payment links
-const paginationSchema = createListParamSchema<{ active?: boolean }>({ active: Joi.boolean().empty('') });
+const paginationSchema = createListParamSchema<{ active?: boolean; donation?: string }>({
+  active: Joi.boolean().empty(''),
+  donation: Joi.string().empty(''),
+});
 router.get('/', auth, async (req, res) => {
   const { page, pageSize, ...query } = await paginationSchema.validateAsync(req.query, { stripUnknown: true });
   const where: WhereOptions<PaymentLink> = { 'metadata.preview': null };
@@ -164,6 +168,9 @@ router.get('/', auth, async (req, res) => {
   if (typeof query.livemode === 'boolean') {
     where.livemode = query.livemode;
   }
+  if (query.donation === 'hide') {
+    where.submit_type = { [Op.not]: 'donate' };
+  }
 
   try {
     const { rows: list, count } = await PaymentLink.findAndCountAll({

package/api/src/routes/products.ts

@@ -137,6 +137,7 @@ const paginationSchema = createListParamSchema<{
   status: Joi.string().empty(''),
   name: Joi.string().empty(''),
   description: Joi.string().empty(''),
+  donation: Joi.string().empty(''),
 });
 router.get('/', auth, async (req, res) => {
   const { page, pageSize, active, livemode, name, description, ...query } = await paginationSchema.validateAsync(
@@ -213,7 +214,7 @@ router.get('/search', auth, async (req, res) => {
 });
 
 // get product detail
-router.get('/:id', auth, async (req, res) => {
+router.get('/:id', async (req, res) => {
   const doc = await Product.expand(req.params.id as string);
   if (doc) {
     res.json(doc);

package/api/src/routes/refunds.ts

@@ -1,9 +1,11 @@
+/* eslint-disable no-console */
 /* eslint-disable consistent-return */
 import { Router } from 'express';
 import Joi from 'joi';
 import pick from 'lodash/pick';
 
-import { createListParamSchema, getWhereFromKvQuery } from '../libs/api';
+import { BN, fromTokenToUnit } from '@ocap/util';
+import { BNPositiveValidator, createListParamSchema, getWhereFromKvQuery } from '../libs/api';
 import { authenticate } from '../libs/security';
 import { formatMetadata } from '../libs/util';
 import {
@@ -15,6 +17,8 @@ import {
   Refund,
   Subscription,
 } from '../store/models';
+import logger from '../libs/logger';
+import { getRefundAmountSetup } from '../libs/refund';
 
 const router = Router();
 const authAdmin = authenticate<Invoice>({ component: true, roles: ['owner', 'admin'] });
@@ -103,6 +107,67 @@ router.get('/', auth, async (req, res) => {
 });
 
 const searchSchema = createListParamSchema<{}>({});
+const refundRequestSchema = Joi.object({
+  amount: BNPositiveValidator.required(),
+  currency_id: Joi.string().required(),
+  customer_id: Joi.string().required(),
+  payment_method_id: Joi.string().required(),
+  payment_intent_id: Joi.string().required(),
+  reason: Joi.string()
+    .valid('duplicate', 'requested_by_customer', 'requested_by_admin', 'fraudulent', 'expired_uncaptured_charge')
+    .required(),
+  description: Joi.string().required(),
+  metadata: Joi.object().optional(),
+  invoice_id: Joi.string().optional(),
+  subscription_id: Joi.string().optional(),
+});
+router.post('/', authAdmin, async (req, res) => {
+  const { error } = refundRequestSchema.validate(req.body);
+  if (error) {
+    return res.status(400).json({ error: `Refund request invalid: ${error.message}` });
+  }
+  try {
+    const paymentCurrency = await PaymentCurrency.findByPk(req.body.currency_id);
+    if (!paymentCurrency) {
+      throw new Error('payment currency not found');
+    }
+    const amount = fromTokenToUnit(req.body.amount, paymentCurrency?.decimal).toString();
+    const amountBN = new BN(amount);
+    const result = await getRefundAmountSetup({
+      paymentIntentId: req.body.payment_intent_id,
+    });
+    if (amountBN.gt(new BN(result.amount))) {
+      throw new Error('refund amount exceeds the available amount');
+    }
+
+    const item = await Refund.create({
+      ...req.body,
+      type: 'refund',
+      livemode: !!req.livemode,
+      amount,
+      metadata: formatMetadata(req.body.metadata),
+      attempt_count: 0,
+      attempted: false,
+      next_attempt: 0,
+      last_attempt_error: null,
+      starting_balance: '0',
+      ending_balance: '0',
+      status: 'pending',
+      starting_token_balance: {},
+      ending_token_balance: {},
+    });
+    logger.info('refund created', {
+      ...req.params,
+      ...req.body,
+      result: item.toJSON(),
+    });
+    res.json(item);
+  } catch (err) {
+    logger.error('create refund error', err);
+    res.status(400).json({ error: err.message });
+  }
+});
+
 router.get('/search', auth, async (req, res) => {
   const { page, pageSize, livemode, q, o } = await searchSchema.validateAsync(req.query, {
     stripUnknown: false,

package/api/src/store/models/index.ts

@@ -153,6 +153,10 @@ export type TPaymentIntentExpanded = TPaymentIntent & {
   checkoutSession?: TCheckoutSession;
   subscription?: TSubscription;
   invoice?: TInvoice;
+  refund?: {
+    amount: string;
+    totalAmount: string;
+  };
 };
 
 export type TSubscriptionExpanded = TSubscription & {

package/blocklet.yml

@@ -14,7 +14,7 @@ repository:
   type: git
   url: git+https://github.com/blocklet/payment-kit.git
 specVersion: 1.2.8
-version: 1.13.296
+version: 1.13.298
 logo: logo.png
 files:
   - dist

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "payment-kit",
-  "version": "1.13.296",
+  "version": "1.13.298",
   "scripts": {
     "dev": "blocklet dev --open",
     "eject": "vite eject",
@@ -52,7 +52,7 @@
     "@arcblock/validator": "^1.18.124",
     "@blocklet/js-sdk": "1.16.28",
     "@blocklet/logger": "1.16.28",
-    "@blocklet/payment-react": "1.13.296",
+    "@blocklet/payment-react": "1.13.298",
     "@blocklet/sdk": "1.16.28",
     "@blocklet/ui-react": "^2.10.3",
     "@blocklet/uploader": "^0.1.18",
@@ -118,7 +118,7 @@
   "devDependencies": {
     "@abtnode/types": "1.16.28",
     "@arcblock/eslint-config-ts": "^0.3.2",
-    "@blocklet/payment-types": "1.13.296",
+    "@blocklet/payment-types": "1.13.298",
     "@types/cookie-parser": "^1.4.7",
     "@types/cors": "^2.8.17",
     "@types/debug": "^4.1.12",
@@ -158,5 +158,5 @@
       "parser": "typescript"
     }
   },
-  "gitHead": "e0f0556ce4ed8833464248e00250c09dbde2c5a9"
+  "gitHead": "85dd6105a19723e06405eebb4bcc6ffddc2cd7aa"
 }

package/scripts/sdk.js

@@ -0,0 +1,41 @@
+// run sdk test: # blocklet exec /scripts/sdk.js --app-id=appid
+
+/* eslint-disable import/no-extraneous-dependencies */
+/* eslint-disable no-console */
+const payment = require('@blocklet/payment-js').default;
+
+(async () => {
+  payment.environments.setTestMode(true);
+  const paymentIntent = await payment.paymentIntents.retrieve('pi_ybTOCWweEnb9grWZsTH7MCVi');
+
+  console.log('paymentIntent', paymentIntent);
+
+  // const refundResult = await payment.paymentIntents.refund('pi_ybTOCWweEnb9grWZsTH7MCVi', {
+  //   amount: '0.001',
+  //   reason: 'requested_by_customer',
+  //   description: 'Refund Test',
+  // });
+  // console.log('refundResult', refundResult);
+
+  const refund = await payment.refunds.retrieve('re_loHv143R78cSe38uGjxRBsfv');
+  console.log('🚀 ~ refund:', refund);
+
+  const refunds = await payment.refunds.list({
+    invoice_id: 'in_EidRR3yL3PL5tnOgd17eyGJr',
+  });
+  console.log('🚀 ~ refunds:', refunds);
+
+  // const customRefundResult = await payment.refunds.create({
+  //   amount: '0.001',
+  //   reason: 'requested_by_admin',
+  //   description: 'Custom Refund Test',
+  //   invoice_id: paymentIntent.invoice_id,
+  //   payment_intent_id: paymentIntent.id,
+  //   currency_id: paymentIntent.currency_id,
+  //   payment_method_id: paymentIntent.payment_method_id,
+  //   customer_id: paymentIntent.customer_id,
+  // });
+  // console.log('🚀 ~ customRefundResult:', customRefundResult);
+
+  process.exit(0);
+})();

package/src/components/payment-intent/actions.tsx

@@ -1,36 +1,176 @@
 import { useLocaleContext } from '@arcblock/ux/lib/Locale/context';
 import Toast from '@arcblock/ux/lib/Toast';
-import { ConfirmDialog, api, formatError } from '@blocklet/payment-react';
+import { ConfirmDialog, api, formatBNStr, formatError } from '@blocklet/payment-react';
 import type { TPaymentIntentExpanded } from '@blocklet/payment-types';
-import { useSetState } from 'ahooks';
+import { useRequest, useSetState } from 'ahooks';
 import { useNavigate } from 'react-router-dom';
 import type { LiteralUnion } from 'type-fest';
+import {
+  FormControl,
+  FormControlLabel,
+  FormHelperText,
+  InputAdornment,
+  Radio,
+  RadioGroup,
+  Stack,
+  TextField,
+} from '@mui/material';
+import { Controller, FormProvider, useForm, useFormContext } from 'react-hook-form';
 
+import { useState } from 'react';
 import Actions from '../actions';
 import ClickBoundary from '../click-boundary';
 
 type Props = {
   data: TPaymentIntentExpanded;
   variant?: LiteralUnion<'compact' | 'normal', string>;
+  onChange: (action: string) => void;
 };
 
+PaymentIntentActionsInner.defaultProps = {
+  variant: 'compact',
+};
 PaymentIntentActions.defaultProps = {
   variant: 'compact',
 };
 
-export default function PaymentIntentActions({ data, variant }: Props) {
+const fetchRefundData = (id: string) => {
+  return api.get(`/api/payment-intents/${id}/refundable-amount`).then((res) => res.data);
+};
+
+function RefundForm({ data, refundMaxAmount }: { data: TPaymentIntentExpanded; refundMaxAmount: string }) {
+  const { t } = useLocaleContext();
+  const { control, getFieldState, setValue } = useFormContext();
+
+  const positive = (v: number) => {
+    return Number(v) > 0 && Number(v) <= Number(refundMaxAmount);
+  };
+  return (
+    <Stack direction="column" spacing={1} alignItems="flex-start" sx={{ width: 400 }}>
+      <Controller
+        name="refund.reason"
+        control={control}
+        render={({ field }) => (
+          <RadioGroup {...field} sx={{ ml: '5px !important' }}>
+            <FormControlLabel
+              value="duplicate"
+              control={<Radio checked={field.value === 'duplicate'} />}
+              label={t('admin.paymentIntent.refundForm.duplicate')}
+              onClick={() => setValue('refund.reason', 'duplicate')}
+            />
+            <FormControlLabel
+              value="requested_by_customer"
+              control={<Radio checked={field.value === 'requested_by_customer'} />}
+              label={t('admin.paymentIntent.refundForm.requestedByCustomer')}
+              onClick={() => setValue('refund.reason', 'requested_by_customer')}
+            />
+            <FormControlLabel
+              value="requested_by_admin"
+              control={<Radio checked={field.value === 'requested_by_admin'} />}
+              label={t('admin.paymentIntent.refundForm.requestedByAdmin')}
+              onClick={() => setValue('refund.reason', 'requested_by_admin')}
+            />
+            <FormControlLabel
+              value="fraudulent"
+              control={<Radio checked={field.value === 'fraudulent'} />}
+              label={t('admin.paymentIntent.refundForm.fraudulent')}
+              onClick={() => setValue('refund.reason', 'fraudulent')}
+            />
+            <FormControlLabel
+              value="expired_uncaptured_charge"
+              control={<Radio checked={field.value === 'expired_uncaptured_charge'} />}
+              label={t('admin.paymentIntent.refundForm.expiredUncapturedCharge')}
+              onClick={() => setValue('refund.reason', 'expired_uncaptured_charge')}
+            />
+          </RadioGroup>
+        )}
+      />
+
+      <FormControl fullWidth component="fieldset" variant="outlined">
+        <Controller
+          name="refund.amount"
+          control={control}
+          render={({ field }) => (
+            <TextField
+              {...field}
+              variant="outlined"
+              size="small"
+              type="number"
+              fullWidth
+              placeholder={t('admin.paymentIntent.refundForm.amount')}
+              error={!!getFieldState('refund.amount').error || !positive(field.value)}
+              helperText={
+                !positive(field.value)
+                  ? t('admin.paymentIntent.refundForm.amountRange', {
+                      min: 0,
+                      max: refundMaxAmount,
+                      symbol: data.paymentCurrency.symbol,
+                    })
+                  : getFieldState('refund.amount').error?.message
+              }
+              InputProps={{
+                endAdornment: <InputAdornment position="end">{data.paymentCurrency.symbol}</InputAdornment>,
+              }}
+            />
+          )}
+        />
+        <FormHelperText>
+          {t('admin.paymentIntent.refundForm.amountHelper', {
+            min: 0,
+            max: refundMaxAmount,
+            symbol: data.paymentCurrency.symbol,
+          })}
+        </FormHelperText>
+      </FormControl>
+
+      <Controller
+        name="refund.description"
+        control={control}
+        render={({ field }) => (
+          <TextField
+            {...field}
+            variant="outlined"
+            size="small"
+            fullWidth
+            multiline
+            minRows={2}
+            maxRows={4}
+            placeholder={t('admin.paymentIntent.refundForm.description')}
+          />
+        )}
+      />
+    </Stack>
+  );
+}
+
+export function PaymentIntentActionsInner({ data, variant, onChange }: Props) {
   const { t } = useLocaleContext();
   const navigate = useNavigate();
+  const { reset, getValues, setValue } = useFormContext();
   const [state, setState] = useSetState({
     action: '',
     loading: false,
   });
+  const [refundMaxAmount, setRefundMaxAmount] = useState('0');
+  const { runAsync: runRefundAmountAsync } = useRequest(() => fetchRefundData(data.id), {
+    onSuccess: (res) => {
+      const amount = formatBNStr(res?.amount, data.paymentCurrency.decimal);
+      setRefundMaxAmount(amount);
+    },
+  });
 
   const onRefund = async () => {
+    const { refund } = getValues();
+    if (!refund.amount || !refund.reason || !refund.description) {
+      Toast.warning(t('admin.paymentIntent.refundForm.required'));
+      return;
+    }
     try {
       setState({ loading: true });
-      await api.put(`/api/payment-intents/${data.id}/refund`).then((res) => res.data);
-      Toast.success(t('common.saved'));
+      await api.put(`/api/payment-intents/${data.id}/refund`, refund).then((res) => res.data);
+      Toast.success(t('admin.paymentIntent.refundSuccess'));
+      onChange('refund');
+      runRefundAmountAsync();
     } catch (err) {
       console.error(err);
       Toast.error(formatError(err));
@@ -42,9 +182,20 @@ export default function PaymentIntentActions({ data, variant }: Props) {
   const actions = [
     {
       label: t('admin.paymentIntent.refund'),
-      handler: () => setState({ action: 'refund' }),
+      handler: () => {
+        runRefundAmountAsync().then((res) => {
+          reset();
+          const curAmount = formatBNStr(res?.amount, data.paymentCurrency.decimal);
+          if (Number(curAmount) <= 0) {
+            Toast.info(t('admin.paymentIntent.refund.empty'));
+            return;
+          }
+          setValue('refund.amount', curAmount);
+          setState({ action: 'refund' });
+        });
+      },
       color: 'primary',
-      disabled: true,
+      disabled: Number(refundMaxAmount) <= 0,
       divider: true,
     },
     {
@@ -71,10 +222,26 @@ export default function PaymentIntentActions({ data, variant }: Props) {
           onConfirm={onRefund}
           onCancel={() => setState({ action: '' })}
           title={t('admin.paymentIntent.refund')}
-          message={t('admin.paymentIntent.refundTip')}
+          message={<RefundForm data={data} refundMaxAmount={refundMaxAmount} />}
           loading={state.loading}
         />
       )}
     </ClickBoundary>
   );
 }
+
+export default function PaymentIntentActions(props: Props) {
+  const methods = useForm({
+    defaultValues: {
+      refund: {
+        reason: 'requested_by_admin',
+        description: '',
+      },
+    },
+  });
+  return (
+    <FormProvider {...methods}>
+      <PaymentIntentActionsInner {...props} />
+    </FormProvider>
+  );
+}

package/src/components/payment-intent/list.tsx

@@ -84,11 +84,15 @@ export default function PaymentList({ customer_id, invoice_id, features }: ListP
 
   const [data, setData] = useState({}) as any;
 
+  const fetchListData = () => {
+    fetchData(search).then((res: any) => {
+      setData(res);
+    });
+  };
+
   useEffect(() => {
     debounce(() => {
-      fetchData(search).then((res: any) => {
-        setData(res);
-      });
+      fetchListData();
     }, 300)();
   }, [search]);
 
@@ -176,7 +180,7 @@ export default function PaymentList({ customer_id, invoice_id, features }: ListP
       options: {
         customBodyRenderLite: (_: string, index: number) => {
           const item = data.list[index] as TPaymentIntentExpanded;
-          return <PaymentIntentActions data={item} />;
+          return <PaymentIntentActions data={item} onChange={fetchListData} />;
         },
       },
     },

package/src/locales/en.tsx

@@ -247,6 +247,22 @@ export default flat({
       refund: 'Refund payment',
       received: 'Received',
       attention: 'Failed payments',
+      refundError: 'Failed to refund payment',
+      refundSuccess: 'Refund application has been successfully created',
+      refundForm: {
+        reason: 'Refund reason',
+        amount: 'Refund amount',
+        description: 'Refund description',
+        duplicate: 'Duplicate payment',
+        requestedByCustomer: 'Requested by customer',
+        requestedByAdmin: 'Requested by admin',
+        fraudulent: 'Fraudulent',
+        expiredUncapturedCharge: 'Expired uncaptured charge',
+        amountRange: 'Refund amount must be between {min} and {max} {symbol}',
+        amountHelper: 'Refund amount must be less than or equal to {max} {symbol}',
+        required: 'please fill in the refund information',
+        empty: 'The current order has been fully refunded',
+      },
     },
     payout: {
       list: 'Payouts',

package/src/locales/zh.tsx

@@ -246,6 +246,22 @@ export default flat({
       refund: '退款',
       received: '实收金额',
       attention: '失败的付款',
+      refundError: '退款申请失败',
+      refundSuccess: '退款申请已成功创建',
+      refundForm: {
+        reason: '退款原因',
+        amount: '退款金额',
+        description: '退款说明',
+        duplicate: '订单因重复下单已被取消并退款',
+        requestedByCustomer: '订单已被客户取消并退款',
+        requestedByAdmin: '订单已被管理员取消并退款',
+        fraudulent: '订单因涉嫌欺诈已被取消并退款',
+        expiredUncapturedCharge: '订单因支付未完成已被取消并退款',
+        amountRange: '退款金额必须在 {min} {symbol} 到 {max} {symbol} 之间',
+        amountHelper: '目前最大退款金额为{max} {symbol}',
+        required: '请完整填写退款信息',
+        empty: '当前订单已全部退款完成',
+      },
     },
     paymentMethod: {
       _name: '支付方式',

package/src/pages/admin/payments/intents/detail.tsx

@@ -31,6 +31,7 @@ import PaymentIntentActions from '../../../../components/payment-intent/actions'
 import PayoutList from '../../../../components/payouts/list';
 import SectionHeader from '../../../../components/section/header';
 import { goBackOrFallback } from '../../../../libs/util';
+import RefundList from '../../../../components/refund/list';
 
 const fetchData = (id: string): Promise<TPaymentIntentExpanded> => {
   return api.get(`/api/payment-intents/${id}`).then((res) => res.data);
@@ -105,7 +106,7 @@ export default function PaymentIntentDetail(props: { id: string }) {
               <Amount amount={received} sx={{ my: 0, fontSize: '2rem', lineHeight: '1rem' }} />
               <Status label={data.status} color={getPaymentIntentStatusColor(data.status)} sx={{ ml: 2 }} />
             </Stack>
-            <PaymentIntentActions data={data} variant="normal" />
+            <PaymentIntentActions data={data} variant="normal" onChange={runAsync} />
           </Stack>
           <Stack
             className="section-body"
@@ -217,6 +218,12 @@ export default function PaymentIntentDetail(props: { id: string }) {
           <PayoutList features={{ toolbar: false }} payment_intent_id={data.id} />
         </Box>
       </Box>
+      <Box className="section">
+        <SectionHeader title={t('admin.refunds')} mb={0} />
+        <Box className="section-body">
+          <RefundList features={{ customer: false, toolbar: false }} invoice_id={data.invoice_id} />
+        </Box>
+      </Box>
       <Box className="section">
         <SectionHeader title={t('admin.events')} />
         <Box className="section-body">

package/src/pages/admin/products/links/index.tsx

@@ -30,10 +30,11 @@ function PaymentLinks() {
   const { settings } = usePaymentContext();
 
   const persisted = getDurableData(listKey);
-  const [search, setSearch] = useState<{ active: string; pageSize: number; page: number }>({
+  const [search, setSearch] = useState<{ active: string; pageSize: number; page: number; donation?: string }>({
     active: '',
     pageSize: persisted.rowsPerPage || 20,
     page: persisted.page ? persisted.page + 1 : 1,
+    donation: 'hide',
   });
 
   const { loading, error, data, refresh } = useRequest(() => fetchData(search));