payment-kit 1.13.241 → 1.13.243

package/api/src/routes/usage-records.ts

@@ -154,8 +154,8 @@ export function createUsageRecordQueryFn(doc?: Subscription) {
         where: {
           subscription_item_id: query.subscription_item_id,
           timestamp: {
-            [Op.gte]: query.start || subscription.current_period_start,
-            [Op.lt]: query.end || subscription.current_period_end,
+            [Op.gt]: query.start || subscription.current_period_start,
+            [Op.lte]: query.end || subscription.current_period_end,
           },
         },
         order: [['created_at', 'ASC']],

package/api/src/store/models/usage-record.ts

@@ -112,8 +112,8 @@ export class UsageRecord extends Model<InferAttributes<UsageRecord>, InferCreati
         subscription_item_id: id,
         billed: false,
         timestamp: {
-          [Op.gte]: start,
-          [Op.lt]: end,
+          [Op.gt]: start,
+          [Op.lte]: end,
         },
       },
       order: [['timestamp', 'DESC']],

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "payment-kit",
-  "version": "1.13.241",
+  "version": "1.13.243",
   "scripts": {
     "dev": "cross-env COMPONENT_STORE_URL=https://test.store.blocklet.dev blocklet dev --open",
     "eject": "vite eject",
@@ -51,10 +51,10 @@
     "@arcblock/ux": "^2.9.77",
     "@arcblock/validator": "^1.18.116",
     "@blocklet/logger": "1.16.26",
-    "@blocklet/payment-react": "1.13.241",
+    "@blocklet/payment-react": "1.13.243",
     "@blocklet/sdk": "1.16.26",
     "@blocklet/ui-react": "^2.9.77",
-    "@blocklet/uploader": "^0.1.2",
+    "@blocklet/uploader": "^0.1.6",
     "@mui/icons-material": "^5.15.16",
     "@mui/lab": "^5.0.0-alpha.170",
     "@mui/material": "^5.15.16",
@@ -116,7 +116,7 @@
   "devDependencies": {
     "@abtnode/types": "1.16.26",
     "@arcblock/eslint-config-ts": "^0.3.0",
-    "@blocklet/payment-types": "1.13.241",
+    "@blocklet/payment-types": "1.13.243",
     "@types/cookie-parser": "^1.4.7",
     "@types/cors": "^2.8.17",
     "@types/dotenv-flow": "^3.3.3",
@@ -155,5 +155,5 @@
       "parser": "typescript"
     }
   },
-  "gitHead": "f6d0bd360dc5783230fdc3d1197663a76a837797"
+  "gitHead": "b699d54327e794d3b63e5c217ba5cddf759187b7"
 }

package/src/components/invoice/table.tsx

@@ -211,8 +211,8 @@ export default function InvoiceTable({ invoice, simple }: Props) {
           subscriptionId={state.subscriptionId}
           id={state.subscriptionItemId}
           onConfirm={onCloseUsageRecords}
-          start={invoice.period_start}
-          end={invoice.period_end}
+          start={invoice.metadata?.usage_start || invoice.period_start}
+          end={invoice.metadata?.usage_end || invoice.period_end}
         />
       )}
     </Box>

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

@@ -1,4 +1,5 @@
 /* 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 type { TUsageRecord } from '@blocklet/payment-types';
@@ -82,24 +83,32 @@ export function UsageRecordDialog({
     <ConfirmDialog
       title={t('admin.subscription.usage.current')}
       message={
-        <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>
+        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>
+        )
       }
       onConfirm={onConfirm}
       onCancel={onConfirm}

package/src/components/uploader.tsx

@@ -9,10 +9,11 @@ type Props = {
   onUploaded: (result: any) => void;
   preview?: string;
   maxFileSize?: number;
-  allowedFileTypes?: string[];
+  maxNumberOfFiles?: number;
+  allowedFileExts?: string[];
 };
 
-export default function Uploader({ onUploaded, preview, maxFileSize, allowedFileTypes }: Props) {
+export default function Uploader({ onUploaded, preview, maxFileSize, maxNumberOfFiles, allowedFileExts }: Props) {
   const uploaderRef = useRef<any>(null);
   const handleOpen = useCallback(() => {
     if (!uploaderRef.current) return;
@@ -37,6 +38,7 @@ export default function Uploader({ onUploaded, preview, maxFileSize, allowedFile
           backgroundImage: preview ? `url(${preview})` : 'none',
           backgroundRepeat: 'no-repeat',
           backgroundSize: 'contain',
+          backgroundPosition: 'center',
         }}>
         <Button fullWidth variant={preview ? 'contained' : 'text'} color="inherit" size="small">
           <UploadFileOutlined sx={{ mr: 1 }} fontSize="small" />
@@ -50,8 +52,9 @@ export default function Uploader({ onUploaded, preview, maxFileSize, allowedFile
         onUploadFinish={(result: any) => onUploaded({ url: result.data.url })}
         coreProps={{
           restrictions: {
-            allowedFileTypes,
+            allowedFileExts,
             maxFileSize,
+            maxNumberOfFiles,
           },
         }}
         apiPathProps={{
@@ -66,7 +69,8 @@ export default function Uploader({ onUploaded, preview, maxFileSize, allowedFile
 Uploader.defaultProps = {
   preview: '',
   maxFileSize: undefined,
-  allowedFileTypes: ['image/png', 'image/jpeg', 'image/webp'],
+  maxNumberOfFiles: 1,
+  allowedFileExts: ['.png', '.jpeg', '.webp'],
 };
 
 const Div = styled(Box)`

package/src/locales/en.tsx

@@ -360,6 +360,7 @@ export default flat({
       from: 'Billed from',
       empty: 'No invoice',
       number: 'Invoice Number',
+      description: 'Billing Description',
       dueDate: 'Due',
       finalizedAt: 'Finalized At',
       paidAt: 'Payment Date',
@@ -501,5 +502,8 @@ export default flat({
       view: 'View refund detail',
       attention: 'Failed refunds',
     },
+    usageRecord: {
+      empty: 'No usage records',
+    },
   },
 });

package/src/locales/zh.tsx

@@ -351,6 +351,7 @@ export default flat({
       from: '账单来自',
       empty: '没有账单',
       number: '账单编号',
+      description: '账单说明',
       dueDate: '截止日期',
       finalizedAt: '已完成时间',
       paidAt: '支付日期',
@@ -491,5 +492,8 @@ export default flat({
       attention: '失败的退款',
       view: '查看退款详情',
     },
+    usageRecord: {
+      empty: '用量记录为空',
+    },
   },
 });

package/src/pages/admin/billing/invoices/detail.tsx

@@ -116,6 +116,7 @@ export default function InvoiceDetail(props: { id: string }) {
         <SectionHeader title={t('admin.details')} />
         <Stack>
           <InfoRow label={t('admin.invoice.number')} value={data.number} />
+          <InfoRow label={t('admin.invoice.description')} value={data.description} />
           <InfoRow label={t('admin.invoice.billTo')} value={<CustomerLink customer={data.customer} />} />
           <InfoRow
             label={t('admin.subscription.currentPeriod')}

package/src/pages/customer/invoice/detail.tsx

@@ -124,6 +124,7 @@ export default function CustomerInvoiceDetail() {
         <Stack className="invoice-summary-wrapper">
           <InfoRow label={t('admin.invoice.from')} value={data.statement_descriptor || blocklet.appName} />
           <InfoRow label={t('admin.invoice.number')} value={data.number} />
+          <InfoRow label={t('admin.invoice.description')} value={data.description} />
           <InfoRow
             label={t('common.status')}
             value={<Status label={data.status} color={getInvoiceStatusColor(data.status)} />}