payment-kit 1.13.278 → 1.13.281

package/README.md

@@ -10,6 +10,16 @@ The decentralized stripe for blocklet platform.
 2. run `make build`
 3. run `cd blocklets/core && blocklet dev`
 
+##### when error
+1. pre-start error component xxx is not running or unreachable
+  - create .env.local file in this root
+    - add BLOCKLET_DEV_APP_DID="did:abt:your payment kit server did"
+    - add BLOCKLET_DEV_MOUNT_POINT="/example"
+  - copy .env.local to be under the /core
+    - edit BLOCKLET_DEV_MOUNT_POINT="/"
+2. Insufficient fund to pay for tx cost from xxx, expected 1.0020909, got 0
+   - copy BLOCKLET_DEV_APP_DID
+   - transfer 2 TBA in your DID Wallet to your copied address
 ### Debug Stripe
 
 1. Install and login with instructions from: https://stripe.com/docs/stripe-cli

package/api/src/libs/logger.ts

@@ -1,4 +1,3 @@
-/* eslint-disable no-console */
 const createLogger = require('@blocklet/logger');
 
 interface Logger {

package/api/src/libs/notification/template/subscription-renewed.ts

@@ -97,10 +97,8 @@ export class SubscriptionRenewedEmailTemplate implements BaseEmailTemplate<Subsc
     const nftMintItem: NftMintItem | undefined = hasNft
       ? checkoutSession?.nft_mint_details?.[checkoutSession?.nft_mint_details?.type as 'arcblock' | 'ethereum']
       : undefined;
-    const amountPaid = +fromUnitToToken(invoice.amount_paid, paymentCurrency.decimal);
-    const paymentInfo: string = `${fromUnitToToken(invoice.amount_paid, paymentCurrency.decimal)} ${
-      paymentCurrency.symbol
-    }`;
+    const amountPaid = +fromUnitToToken(invoice.total, paymentCurrency.decimal);
+    const paymentInfo: string = `${fromUnitToToken(invoice.total, paymentCurrency.decimal)} ${paymentCurrency.symbol}`;
     const currentPeriodStart: string = formatTime(invoice.period_start * 1000);
     const currentPeriodEnd: string = formatTime(invoice.period_end * 1000);
     const duration: string = prettyMsI18n(

package/api/src/queues/notification.ts

@@ -211,6 +211,12 @@ export async function startNotificationQueue() {
 
   events.on('customer.subscription.renew_failed', async (subscription: Subscription) => {
     const invoice = await Invoice.findByPk(subscription.latest_invoice_id);
+
+    logger.info('events.on', 'customer.subscription.renew_failed', {
+      subscriptionId: subscription.id,
+      invoiceId: subscription.latest_invoice_id,
+    });
+
     if (invoice && subscription.metadata.renew_failed_reason) {
       notificationQueue.push({
         id: `customer.subscription.renew_failed.${subscription.id}.${invoice.id}`,

package/api/src/queues/payment.ts

@@ -558,6 +558,9 @@ export const handlePayment = async (job: PaymentJob) => {
 
       // 只有在 第一次重试 或者 重试次数超过阈值 的时候才发送邮件，不然邮件频率太高了
       const minRetryMail = updates.minRetryMail || MIN_RETRY_MAIL;
+
+      logger.warn('catch:PaymentIntent capture failed', { id: paymentIntent.id, attemptCount, minRetryMail, invoice });
+
       if ((attemptCount === 1 || attemptCount >= minRetryMail) && invoice.billing_reason === 'subscription_cycle') {
         const subscription = await Subscription.findByPk(invoice.subscription_id);
         if (subscription) {
@@ -566,6 +569,10 @@ export const handlePayment = async (job: PaymentJob) => {
               renew_failed_reason: result || { sufficient: false, reason: 'TX_SEND_FAILED' },
             }),
           });
+          logger.info('createEvent:customer.subscription.renew_failed', {
+            subscriptionId: subscription.id,
+            invoiceId: invoice.id,
+          });
           createEvent('Subscription', 'customer.subscription.renew_failed', subscription);
         }
       }

package/api/src/routes/subscription-items.ts

@@ -1,3 +1,4 @@
+import dayjs from 'dayjs';
 import { Router } from 'express';
 import Joi from 'joi';
 import pick from 'lodash/pick';
@@ -153,4 +154,25 @@ router.delete('/:id', auth, async (req, res) => {
   return res.json(doc);
 });
 
+router.post('/:id/add-usage-quantity', auth, async (req, res) => {
+  const { livemode } = req;
+  if (livemode) {
+    return res.status(403).json({ error: 'add usage quantity not allowed in livemode' });
+  }
+
+  const subscriptionItem = await SubscriptionItem.findByPk(req.params.id);
+  if (!subscriptionItem) {
+    return res.status(404).json({ error: `SubscriptionItem(${req.params.id}) item not found` });
+  }
+
+  await UsageRecord.create({
+    livemode: Boolean(livemode),
+    subscription_item_id: subscriptionItem.id,
+    quantity: req.body.quantity,
+    timestamp: dayjs().unix(),
+  } as UsageRecord);
+
+  return res.json();
+});
+
 export default router;

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.278
+version: 1.13.281
 logo: logo.png
 files:
   - dist

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "payment-kit",
-  "version": "1.13.278",
+  "version": "1.13.281",
   "scripts": {
     "dev": "blocklet dev --open",
     "eject": "vite eject",
@@ -52,7 +52,7 @@
     "@arcblock/validator": "^1.18.123",
     "@blocklet/js-sdk": "1.16.28",
     "@blocklet/logger": "1.16.28",
-    "@blocklet/payment-react": "1.13.278",
+    "@blocklet/payment-react": "1.13.281",
     "@blocklet/sdk": "1.16.28",
     "@blocklet/ui-react": "^2.10.1",
     "@blocklet/uploader": "^0.1.11",
@@ -78,6 +78,7 @@
     "cors": "^2.8.5",
     "date-fns": "^3.6.0",
     "dayjs": "^1.11.11",
+    "debug": "^4.3.5",
     "dotenv-flow": "^3.3.0",
     "ethers": "^6.13.0",
     "express": "^4.19.2",
@@ -117,9 +118,10 @@
   "devDependencies": {
     "@abtnode/types": "1.16.28",
     "@arcblock/eslint-config-ts": "^0.3.0",
-    "@blocklet/payment-types": "1.13.278",
+    "@blocklet/payment-types": "1.13.281",
     "@types/cookie-parser": "^1.4.7",
     "@types/cors": "^2.8.17",
+    "@types/debug": "^4.1.12",
     "@types/dotenv-flow": "^3.3.3",
     "@types/express": "^4.17.21",
     "@types/node": "^18.19.34",
@@ -156,5 +158,5 @@
       "parser": "typescript"
     }
   },
-  "gitHead": "1d8a1be23706258132357c6443c274e2d5af13ce"
+  "gitHead": "dea66d4a8bbd397b5a8f8235332349aaca0ab72c"
 }

package/src/components/subscription/items/usage-records.tsx

@@ -1,9 +1,10 @@
 /* eslint-disable react/require-default-props */
 import Empty from '@arcblock/ux/lib/Empty';
 import { useLocaleContext } from '@arcblock/ux/lib/Locale/context';
-import { ConfirmDialog, api } from '@blocklet/payment-react';
+import Toast from '@arcblock/ux/lib/Toast';
+import { ConfirmDialog, api, formatError, usePaymentContext } from '@blocklet/payment-react';
 import type { TUsageRecord } from '@blocklet/payment-types';
-import { Alert, Box, Button, CircularProgress } from '@mui/material';
+import { Alert, Box, Button, CircularProgress, TextField } from '@mui/material';
 import { useRequest } from 'ahooks';
 import { useState } from 'react';
 import { Bar, BarChart, Rectangle, Tooltip, XAxis, YAxis } from 'recharts';
@@ -35,6 +36,16 @@ const colors = {
   active: stringToColor('active'),
 };
 
+function addUsageQuantity({
+  subscriptionItemId,
+  params,
+}: {
+  subscriptionItemId: string;
+  params: import('stripe').Stripe.UsageRecordCreateParams;
+}) {
+  return api.post(`api/subscription-items/${subscriptionItemId}/add-usage-quantity`, params).then((res) => res.data);
+}
+
 export function UsageRecordDialog({
   subscriptionId,
   id,
@@ -52,6 +63,8 @@ export function UsageRecordDialog({
   const { loading, error, data } = useRequest(() => fetchData(subscriptionId, id, start, end), {
     refreshDeps: [subscriptionId, id, start, end],
   });
+  const settings = usePaymentContext();
+  const [usageQuantity, setUsageQuantity] = useState(1);
 
   if (error) {
     return (
@@ -79,36 +92,69 @@ export function UsageRecordDialog({
     );
   }
 
+  const handAddUsageQuantity = async () => {
+    try {
+      await addUsageQuantity({
+        subscriptionItemId: id,
+        params: {
+          quantity: usageQuantity,
+        },
+      });
+      Toast.success(t('admin.usageRecord.add.success'));
+      onConfirm();
+    } catch (err) {
+      console.error(err);
+      Toast.error(formatError(err));
+    }
+  };
   return (
     <ConfirmDialog
       title={t('admin.subscription.usage.current')}
       message={
-        data.list.length > 0 ? (
-          <BarChart
-            width={480}
-            height={240}
-            data={data.list.map((item) => ({
-              ...item,
-              date: new Date(item.timestamp * 1000).toLocaleString(),
-            }))}
-            margin={{
-              top: 5,
-              right: 5,
-              left: 0,
-              bottom: 5,
-            }}>
-            <Tooltip />
-            <Bar
-              dataKey="quantity"
-              fill={colors.normal}
-              activeBar={<Rectangle fill={colors.active} strokeWidth={0} />}
-            />
-            <XAxis dataKey="date" />
-            <YAxis mirror />
-          </BarChart>
-        ) : (
-          <Empty>{t('admin.usageRecord.empty')}</Empty>
-        )
+        <>
+          {data.list.length > 0 ? (
+            <BarChart
+              width={480}
+              height={240}
+              data={data.list.map((item) => ({
+                ...item,
+                date: new Date(item.timestamp * 1000).toLocaleString(),
+              }))}
+              margin={{
+                top: 5,
+                right: 5,
+                left: 0,
+                bottom: 5,
+              }}>
+              <Tooltip />
+              <Bar
+                dataKey="quantity"
+                fill={colors.normal}
+                activeBar={<Rectangle fill={colors.active} strokeWidth={0} />}
+              />
+              <XAxis dataKey="date" />
+              <YAxis mirror />
+            </BarChart>
+          ) : (
+            <Empty>{t('admin.usageRecord.empty')}</Empty>
+          )}
+          {!settings.livemode && window.location.pathname.includes('/admin/billing') && (
+            <Box sx={{ display: 'flex', justifyContent: 'center' }} pt={1} pb={1}>
+              <TextField
+                id="add-usage-record"
+                label={t('admin.usageRecord.add.quantity')}
+                type="number"
+                size="small"
+                InputLabelProps={{
+                  shrink: true,
+                }}
+                value={usageQuantity}
+                onChange={(e) => setUsageQuantity(+e.target.value)}
+              />
+              <Button onClick={handAddUsageQuantity}>{t('admin.usageRecord.add.label')}</Button>
+            </Box>
+          )}
+        </>
       }
       onConfirm={onConfirm}
       onCancel={onConfirm}

package/src/locales/en.tsx

@@ -506,6 +506,14 @@ export default flat({
     },
     usageRecord: {
       empty: 'No usage records',
+      add: {
+        label: 'Add usage record',
+        success: 'Successfully added usage record',
+        quantity: 'Quantity',
+      },
     },
   },
+  empty: {
+    image: 'No Image',
+  },
 });

package/src/locales/zh.tsx

@@ -496,6 +496,14 @@ export default flat({
     },
     usageRecord: {
       empty: '用量记录为空',
+      add: {
+        label: '添加用量记录',
+        success: '添加用量记录成功',
+        quantity: '数量',
+      },
     },
   },
+  empty: {
+    image: '无图片',
+  },
 });

package/src/pages/admin/products/products/detail.tsx

@@ -170,7 +170,11 @@ export default function ProductDetail(props: { id: string }) {
             <InfoRow
               label={t('admin.product.image.label')}
               value={
-                data.images.length ? <img src={data.images[0]} width={160} height={160} alt={data.name} /> : 'No Image'
+                data.images.length ? (
+                  <img src={data.images[0]} width={160} height={160} alt={data.name} style={{ objectFit: 'cover' }} />
+                ) : (
+                  t('empty.image')
+                )
               }
             />
           </Grid>