payment-kit 1.19.8 → 1.19.10

package/api/src/routes/subscriptions.ts

@@ -1052,10 +1052,11 @@ router.put('/:id', authPortal, async (req, res) => {
           if (due === '0') {
             hasNext = false;
           } else {
+            const payer = getSubscriptionPaymentAddress(subscription, paymentMethod.type);
             const delegation = await isDelegationSufficientForPayment({
               paymentMethod,
               paymentCurrency,
-              userDid: customer.did,
+              userDid: payer,
               amount: setup.amount.setup,
             });
             if (delegation.sufficient) {
@@ -1657,10 +1658,11 @@ router.post('/:id/change-payment', authPortal, async (req, res) => {
       }
     } else {
       // changing from crypto to crypto: just update the subscription
+      const payer = getSubscriptionPaymentAddress(subscription, paymentMethod.type);
       delegation = await isDelegationSufficientForPayment({
         paymentMethod,
         paymentCurrency,
-        userDid: customer!.did,
+        userDid: payer,
         amount: getFastCheckoutAmount(lineItems, 'subscription', paymentCurrency.id, false),
       });
       const noStake = subscription.billing_thresholds?.no_stake;
@@ -1679,7 +1681,10 @@ router.post('/:id/change-payment', authPortal, async (req, res) => {
           default_payment_method_id: paymentMethod.id,
           payment_settings: {
             payment_method_types: [paymentMethod.type],
-            payment_method_options: {},
+            payment_method_options: {
+              ...(subscription.payment_settings?.payment_method_options || {}),
+              [paymentMethod.type]: { payer },
+            },
           },
         });
         logger.info('Subscription payment change done on delegation enough', {

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "payment-kit",
-  "version": "1.19.8",
+  "version": "1.19.10",
   "scripts": {
     "dev": "blocklet dev --open",
     "lint": "tsc --noEmit && eslint src api/src --ext .mjs,.js,.jsx,.ts,.tsx",
@@ -46,17 +46,18 @@
     "@abtnode/cron": "^1.16.46",
     "@arcblock/did": "^1.21.0",
     "@arcblock/did-auth-storage-nedb": "^1.7.1",
-    "@arcblock/did-connect": "^3.0.32",
+    "@arcblock/did-connect": "^3.0.36",
     "@arcblock/did-util": "^1.21.0",
     "@arcblock/jwt": "^1.21.0",
-    "@arcblock/ux": "^3.0.32",
+    "@arcblock/ux": "^3.0.36",
     "@arcblock/validator": "^1.21.0",
-    "@blocklet/did-space-js": "^1.1.8",
+    "@blocklet/did-space-js": "^1.1.10",
+    "@blocklet/error": "^0.2.5",
     "@blocklet/js-sdk": "^1.16.46",
     "@blocklet/logger": "^1.16.46",
-    "@blocklet/payment-react": "1.19.8",
+    "@blocklet/payment-react": "1.19.10",
     "@blocklet/sdk": "^1.16.46",
-    "@blocklet/ui-react": "^3.0.32",
+    "@blocklet/ui-react": "^3.0.36",
     "@blocklet/uploader": "^0.2.4",
     "@blocklet/xss": "^0.2.2",
     "@mui/icons-material": "^7.1.2",
@@ -123,7 +124,7 @@
   "devDependencies": {
     "@abtnode/types": "^1.16.46",
     "@arcblock/eslint-config-ts": "^0.3.3",
-    "@blocklet/payment-types": "1.19.8",
+    "@blocklet/payment-types": "1.19.10",
     "@types/cookie-parser": "^1.4.9",
     "@types/cors": "^2.8.19",
     "@types/debug": "^4.1.12",
@@ -169,5 +170,5 @@
       "parser": "typescript"
     }
   },
-  "gitHead": "59916e7b537b714eb9614365ca144704e7566ad8"
+  "gitHead": "96665501b84f130e074df9a3d70f9b6f48cc3309"
 }

package/src/components/customer/credit-overview.tsx

@@ -1,6 +1,6 @@
 import { formatBNStr, CreditGrantsList, CreditTransactionsList, api } from '@blocklet/payment-react';
 import { useLocaleContext } from '@arcblock/ux/lib/Locale/context';
-import { Avatar, Box, Card, CardContent, Stack, Typography, Tabs, Tab } from '@mui/material';
+import { Box, Card, CardContent, Stack, Typography, Tabs, Tab } from '@mui/material';
 import { useMemo, useState } from 'react';
 import type { TPaymentCurrency } from '@blocklet/payment-types';
 import { useRequest } from 'ahooks';
@@ -103,13 +103,16 @@ export default function CreditOverview({ customerId, settings, mode = 'portal' }
         <CardContent sx={{ flexGrow: 1 }}>
           <Stack spacing={2}>
             {/* 货币信息 */}
+
             <Stack
-              direction="row"
-              spacing={1}
+              direction="column"
+              spacing={0.5}
               sx={{
-                alignItems: 'center',
+                alignItems: 'flex-start',
+                borderBottom: '1px solid',
+                borderColor: 'divider',
+                pb: 2,
               }}>
-              <Avatar src={currency.logo} alt={currency.symbol} sx={{ width: 24, height: 24 }} />
               <Typography variant="h6" component="div">
                 {currency.name}
               </Typography>
@@ -127,11 +130,11 @@ export default function CreditOverview({ customerId, settings, mode = 'portal' }
               </Typography>
               <Typography variant="h5" component="div" sx={{ fontWeight: 'normal' }}>
                 {totalAmount === '0' && remainingAmount === '0' ? (
-                  <>0 {currency.symbol}</>
+                  <>0 </>
                 ) : (
                   <>
                     {formatBNStr(remainingAmount, currency.decimal, 6, true)} /{' '}
-                    {formatBNStr(totalAmount, currency.decimal, 6, true)} {currency.symbol}
+                    {formatBNStr(totalAmount, currency.decimal, 6, true)}
                   </>
                 )}
               </Typography>
@@ -153,7 +156,7 @@ export default function CreditOverview({ customerId, settings, mode = 'portal' }
                   sx={{
                     color: 'error.main',
                   }}>
-                  {formatBNStr(pendingAmount, currency.decimal, 6, true)} {currency.symbol}
+                  {formatBNStr(pendingAmount, currency.decimal, 6, true)}
                 </Typography>
               </Box>
             )}

package/src/components/payment-link/product-select.tsx

@@ -4,10 +4,11 @@ import type { TProductExpanded } from '@blocklet/payment-types';
 import { AddOutlined } from '@mui/icons-material';
 import { Avatar, Box, ListSubheader, MenuItem, Select, Stack, Typography } from '@mui/material';
 import cloneDeep from 'lodash/cloneDeep';
-import { useState } from 'react';
+import { useRef, useState } from 'react';
 import type { LiteralUnion } from 'type-fest';
 
 import Empty from '@arcblock/ux/lib/Empty';
+import useBus, { EventAction } from 'use-bus';
 import { useProductsContext } from '../../contexts/products';
 
 type Props = {
@@ -53,14 +54,26 @@ export default function ProductSelect({
   const { products } = useProductsContext();
   const { settings } = usePaymentContext();
   const [value, setValue] = useState('');
+  const valueRef = useRef(value);
   const size = { width: 16, height: 16 };
 
   const handleSelect = (e: any) => {
     setValue(e.target.value);
+    valueRef.current = e.target.value;
     setMode('waiting');
     onSelect(e.target.value);
   };
 
+  useBus(
+    (event: EventAction) => event.type === 'product.select.price.removed',
+    (event: EventAction) => {
+      if (valueRef.current === event.priceId) {
+        setValue('');
+        valueRef.current = '';
+      }
+    }
+  );
+
   const items = (callback?: any) => {
     const filteredProducts = filterProducts(products, hasSelected, filterPrice);
 

package/src/components/pricing-table/product-item.tsx

@@ -5,6 +5,7 @@ import type { PricingTableItem, TProduct, TProductExpanded } from '@blocklet/pay
 import { Box, Stack } from '@mui/material';
 import { useSetState } from 'ahooks';
 
+import { dispatch } from 'use-bus';
 import { useProductsContext } from '../../contexts/products';
 import { getPriceFromProducts } from '../../libs/util';
 import Actions from '../actions';
@@ -74,7 +75,13 @@ export default function ProductItem({ product, prices, valid, onUpdate, onRemove
             key={x.index}
             prefix={`items.${x.index}`}
             price={getPriceFromProducts(products, x.price_id) as any}
-            onRemove={() => onRemove(x.index)}
+            onRemove={() => {
+              onRemove(x.index);
+              dispatch({
+                type: 'product.select.price.removed',
+                priceId: x.price_id,
+              });
+            }}
           />
         ))}
       </Stack>

package/src/contexts/products.tsx

@@ -33,7 +33,12 @@ const fetchProducts = (forceRefresh = false): Promise<{ list: TProductExpanded[]
 // eslint-disable-next-line react/prop-types
 function ProductsProvider({ children }: { children: any }): JSX.Element {
   const { data, error, run, loading } = useRequest((forceRefresh = false) => fetchProducts(forceRefresh));
-  useBus('project.created', () => run(true), []);
+  useBus('product.created', () => run(true), []);
+  useBus('product.updated', () => run(true), []);
+  useBus('product.deleted', () => run(true), []);
+  useBus('price.created', () => run(true), []);
+  useBus('price.updated', () => run(true), []);
+  useBus('price.deleted', () => run(true), []);
   if (error) {
     return <Alert severity="error">{error.message}</Alert>;
   }

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

@@ -102,6 +102,16 @@ export default function PaymentLinkDetail(props: { id: string }) {
     setState((prev) => ({ editing: { ...prev.editing, metadata: true } }));
   };
 
+  const renderConfirmPage = (record: any) => {
+    if (record.type === 'hosted_confirmation') {
+      return <Typography>{record.hosted_confirmation.custom_message || t('common.none')}</Typography>;
+    }
+    if (record.type === 'redirect' && record.redirect.url) {
+      return <Link to={record.redirect.url}>{record.redirect.url}</Link>;
+    }
+    return t('common.none');
+  };
+
   return (
     <Grid container spacing={4} sx={{ mb: 4 }}>
       <Grid size={12}>
@@ -362,7 +372,10 @@ export default function PaymentLinkDetail(props: { id: string }) {
                     value={data.phone_number_collection?.enabled ? t('common.yes') : t('common.no')}
                   />
 
-                  <InfoRow label={t('admin.paymentLink.showConfirmPage')} value={data.after_completion?.type} />
+                  <InfoRow
+                    label={t('admin.paymentLink.showConfirmPage')}
+                    value={renderConfirmPage(data.after_completion)}
+                  />
                   <InfoRow label={t('admin.paymentLink.mintNft')} value={data.nft_mint_settings?.factory || ''} />
                   <InfoRow label={t('common.createdAt')} value={formatTime(data.created_at)} />
                   <InfoRow label={t('common.updatedAt')} value={formatTime(data.updated_at)} />

package/src/pages/admin/products/prices/actions.tsx

@@ -6,6 +6,7 @@ import { useSetState } from 'ahooks';
 import noop from 'lodash/noop';
 import { useNavigate } from 'react-router-dom';
 
+import { dispatch } from 'use-bus';
 import Actions from '../../../../components/actions';
 import EditPrice from '../../../../components/product/edit-price';
 
@@ -45,6 +46,7 @@ export default function PriceActions({
       setState({ loading: true });
       await api.put(`/api/prices/${data.id}`, updates).then((res) => res.data);
       Toast.success(t('common.saved'));
+      dispatch('price.updated');
       onChange(state.action);
     } catch (err) {
       console.error(err);
@@ -59,6 +61,7 @@ export default function PriceActions({
       setState({ loading: true });
       await api.put(`/api/prices/${data.id}/archive`).then((res) => res.data);
       Toast.success(t('common.saved'));
+      dispatch('price.updated');
       onChange(state.action);
     } catch (err) {
       console.error(err);
@@ -72,6 +75,7 @@ export default function PriceActions({
       setState({ loading: true });
       await api.delete(`/api/prices/${data.id}`).then((res) => res.data);
       Toast.success(t('common.removed'));
+      dispatch('price.deleted');
       onChange(state.action);
     } catch (err) {
       console.error(err);

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

@@ -17,6 +17,7 @@ import { styled } from '@mui/system';
 import { useRequest, useSetState } from 'ahooks';
 import { Link, useNavigate } from 'react-router-dom';
 
+import { dispatch } from 'use-bus';
 import Copyable from '../../../../components/copyable';
 import Currency from '../../../../components/currency';
 import EventList from '../../../../components/event/list';
@@ -68,6 +69,7 @@ export default function PriceDetail(props: { id: string }) {
       setState((prev) => ({ loading: { ...prev.loading, [key]: true } }));
       await api.put(`/api/prices/${props.id}`, updates).then((res) => res.data);
       Toast.success(t('common.saved'));
+      dispatch('price.updated');
       runAsync();
     } catch (err) {
       console.error(err);

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

@@ -159,7 +159,7 @@ export default function ProductsCreate({
         Toast.success(t('admin.product.saved'));
         methods.reset();
         dispatch('drawer.submitted');
-        dispatch('project.created');
+        dispatch('product.created');
         if (onSubmitCallback) {
           onSubmitCallback();
         }

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

@@ -20,6 +20,7 @@ import { useRequest, useSetState } from 'ahooks';
 import { useNavigate } from 'react-router-dom';
 
 import { isEmpty } from 'lodash';
+import { dispatch } from 'use-bus';
 import Copyable from '../../../../components/copyable';
 import EventList from '../../../../components/event/list';
 import InfoMetric from '../../../../components/info-metric';
@@ -78,6 +79,7 @@ export default function ProductDetail(props: { id: string }) {
       setState((prev) => ({ loading: { ...prev.loading, [key]: true } }));
       await api.put(`/api/products/${props.id}`, updates).then((res) => res.data);
       Toast.success(t('common.saved'));
+      dispatch('product.updated');
       runAsync();
     } catch (err) {
       console.error(err);
@@ -92,6 +94,7 @@ export default function ProductDetail(props: { id: string }) {
       setState((prev) => ({ loading: { ...prev.loading, price: true } }));
       await api.post('/api/prices', { ...price, product_id: props.id });
       Toast.success(t('common.saved'));
+      dispatch('price.created');
       runAsync();
     } catch (err) {
       console.error(err);

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

@@ -60,7 +60,9 @@ export default function ProductsList() {
       setData(res);
     });
 
-  useBus('project.created', () => refresh(), []);
+  useBus('product.created', () => refresh(), []);
+  useBus('product.updated', () => refresh(), []);
+  useBus('product.deleted', () => refresh(), []);
 
   useEffect(() => {
     refresh();