payment-kit 1.18.37 → 1.18.39

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.
Files changed (51) hide show
  1. package/api/src/integrations/stripe/handlers/invoice.ts +22 -0
  2. package/api/src/integrations/stripe/handlers/payment-intent.ts +9 -1
  3. package/api/src/integrations/stripe/handlers/subscription.ts +137 -1
  4. package/api/src/queues/payment.ts +4 -0
  5. package/api/src/routes/subscriptions.ts +24 -17
  6. package/blocklet.yml +1 -1
  7. package/package.json +20 -20
  8. package/src/app.tsx +124 -125
  9. package/src/components/chart.tsx +19 -5
  10. package/src/components/customer/notification-preference.tsx +6 -5
  11. package/src/components/date-range-picker.tsx +1 -16
  12. package/src/components/drawer-form.tsx +4 -3
  13. package/src/components/filter-toolbar.tsx +49 -34
  14. package/src/components/info-card.tsx +9 -7
  15. package/src/components/invoice-pdf/pdf.tsx +1 -1
  16. package/src/components/layout/admin.tsx +2 -2
  17. package/src/components/metadata/form.tsx +3 -2
  18. package/src/components/metadata/list.tsx +1 -1
  19. package/src/components/payment-link/chrome.tsx +0 -1
  20. package/src/components/payment-link/item.tsx +1 -1
  21. package/src/components/payment-link/preview.tsx +3 -1
  22. package/src/components/price/currency-select.tsx +1 -1
  23. package/src/components/pricing-table/payment-settings.tsx +1 -1
  24. package/src/components/pricing-table/preview.tsx +3 -1
  25. package/src/components/pricing-table/product-item.tsx +1 -1
  26. package/src/components/subscription/portal/actions.tsx +134 -24
  27. package/src/components/subscription/portal/list.tsx +3 -2
  28. package/src/components/uploader.tsx +2 -1
  29. package/src/components/webhook/attempts.tsx +1 -1
  30. package/src/global.css +0 -7
  31. package/src/pages/admin/developers/webhooks/detail.tsx +2 -2
  32. package/src/pages/admin/index.tsx +2 -2
  33. package/src/pages/admin/overview.tsx +1 -1
  34. package/src/pages/admin/payments/intents/detail.tsx +5 -2
  35. package/src/pages/admin/payments/payouts/detail.tsx +1 -1
  36. package/src/pages/admin/payments/refunds/detail.tsx +1 -1
  37. package/src/pages/admin/products/prices/list.tsx +7 -2
  38. package/src/pages/admin/products/pricing-tables/create.tsx +2 -2
  39. package/src/pages/admin/settings/payment-methods/index.tsx +7 -4
  40. package/src/pages/admin/settings/vault-config/index.tsx +3 -2
  41. package/src/pages/checkout/pricing-table.tsx +1 -1
  42. package/src/pages/customer/index.tsx +4 -3
  43. package/src/pages/customer/invoice/detail.tsx +1 -1
  44. package/src/pages/customer/payout/detail.tsx +1 -1
  45. package/src/pages/customer/recharge/account.tsx +3 -4
  46. package/src/pages/customer/recharge/subscription.tsx +3 -4
  47. package/src/pages/customer/subscription/detail.tsx +4 -1
  48. package/src/pages/customer/subscription/embed.tsx +2 -2
  49. package/src/pages/integrations/donations/preview.tsx +12 -10
  50. package/src/pages/integrations/index.tsx +1 -1
  51. package/src/pages/integrations/overview.tsx +2 -4
@@ -13,7 +13,6 @@ import {
13
13
  Card,
14
14
  CardActionArea,
15
15
  Grid,
16
- Paper,
17
16
  Avatar,
18
17
  } from '@mui/material';
19
18
  import { styled } from '@mui/system';
@@ -373,7 +372,7 @@ export default function BalanceRechargePage() {
373
372
  onClick={() => balanceLink && window.open(balanceLink, '_blank')}
374
373
  sx={{
375
374
  color: 'text.primary',
376
- borderRadius: 'var(--radius-m, 8px)',
375
+ borderRadius: 1,
377
376
  transition: 'all 0.2s ease-in-out',
378
377
  cursor: balanceLink ? 'pointer' : 'default',
379
378
  position: 'relative',
@@ -415,7 +414,7 @@ export default function BalanceRechargePage() {
415
414
  </BalanceCard>
416
415
  </Box>
417
416
 
418
- <Paper elevation={0} sx={{ mb: 3, backgroundColor: 'background.default', borderRadius: '16px' }}>
417
+ <Stack sx={{ mb: 3, backgroundColor: 'background.default', borderRadius: '16px' }}>
419
418
  <Grid container spacing={2}>
420
419
  {presetAmounts.map(({ amount: presetAmount, label, multiplier }) => (
421
420
  <Grid item xs={6} sm={3} key={presetAmount}>
@@ -498,7 +497,7 @@ export default function BalanceRechargePage() {
498
497
  </Card>
499
498
  </Grid>
500
499
  </Grid>
501
- </Paper>
500
+ </Stack>
502
501
 
503
502
  {customAmount && (
504
503
  <Box sx={{ mb: 3 }}>
@@ -13,7 +13,6 @@ import {
13
13
  Card,
14
14
  CardActionArea,
15
15
  Grid,
16
- Paper,
17
16
  } from '@mui/material';
18
17
  import { styled } from '@mui/system';
19
18
  import { useLocaleContext } from '@arcblock/ux/lib/Locale/context';
@@ -358,7 +357,7 @@ export default function RechargePage() {
358
357
  onClick={() => balanceLink && window.open(balanceLink, '_blank')}
359
358
  sx={{
360
359
  color: 'text.primary',
361
- borderRadius: 'var(--radius-m, 8px)',
360
+ borderRadius: 1,
362
361
  transition: 'all 0.2s ease-in-out',
363
362
  cursor: balanceLink ? 'pointer' : 'default',
364
363
  position: 'relative',
@@ -397,7 +396,7 @@ export default function RechargePage() {
397
396
  </Stack>
398
397
  </BalanceCard>
399
398
 
400
- <Paper elevation={0} sx={{ mb: 2, mt: 2, backgroundColor: 'background.default' }}>
399
+ <Stack sx={{ mb: 2, mt: 2, backgroundColor: 'background.default' }}>
401
400
  <Grid container spacing={2}>
402
401
  {presetAmounts.map(({ amount: presetAmount, cycles }) => (
403
402
  <Grid item xs={6} sm={4} key={presetAmount}>
@@ -464,7 +463,7 @@ export default function RechargePage() {
464
463
  </Card>
465
464
  </Grid>
466
465
  </Grid>
467
- </Paper>
466
+ </Stack>
468
467
 
469
468
  {customAmount && (
470
469
  <Box>
@@ -74,12 +74,14 @@ export default function CustomerSubscriptionDetail() {
74
74
  const { session } = useSessionContext();
75
75
  const { loading, error, data, refresh } = useRequest(() => fetchData(id));
76
76
  const { hasUnpaid, checkUnpaidInvoices } = useUnpaidInvoicesCheckForSubscription(id);
77
+ const overdraftProtectionReady =
78
+ ['active', 'trialing', 'past_due'].includes(data?.status || '') && data?.paymentMethod?.type === 'arcblock';
77
79
  const {
78
80
  data: overdraftProtection = null,
79
81
  loading: overdraftProtectionLoading,
80
82
  run: refreshOverdraftProtection,
81
83
  } = useRequest(() => fetchOverdraftProtection(id), {
82
- ready: ['active', 'trialing', 'past_due'].includes(data?.status || '') && data?.paymentMethod?.type === 'arcblock',
84
+ ready: overdraftProtectionReady,
83
85
  });
84
86
 
85
87
  const {
@@ -94,6 +96,7 @@ export default function CustomerSubscriptionDetail() {
94
96
  }),
95
97
  {
96
98
  refreshDeps: [id],
99
+ ready: overdraftProtectionReady,
97
100
  }
98
101
  );
99
102
 
@@ -329,7 +329,7 @@ export default function SubscriptionEmbed() {
329
329
  ))}
330
330
  <Button
331
331
  variant="contained"
332
- sx={{ color: '#fff!important', width: subscription.service_actions?.length ? 'auto' : '100%' }}
332
+ sx={{ width: subscription.service_actions?.length ? 'auto' : '100%' }}
333
333
  target="_blank"
334
334
  href={subscriptionPageUrl}>
335
335
  {t('payment.customer.subscriptions.view')}
@@ -374,7 +374,7 @@ function Position({ children }: any) {
374
374
  padding: '8px',
375
375
  width: '100%',
376
376
  maxWidth: '500px',
377
- background: '#fff',
377
+ backgroundColor: 'background.paper',
378
378
  margin: '0 auto',
379
379
  height: '100vh',
380
380
  }}>
@@ -18,8 +18,9 @@ function PreviewAvatars({ count }: { count: number }) {
18
18
  width: '24px',
19
19
  height: '24px',
20
20
  borderRadius: '50%',
21
- bgcolor: '#e0e0e0',
22
- border: '2px solid #fff',
21
+ bgcolor: 'grey.200',
22
+ border: '2px solid',
23
+ borderColor: 'grey.100',
23
24
  position: 'relative',
24
25
  marginLeft: i === 0 ? 0 : '-8px',
25
26
  zIndex: count - i,
@@ -37,7 +38,7 @@ function PreviewAvatars({ count }: { count: number }) {
37
38
  pr: 1,
38
39
  ml: -1,
39
40
  borderRadius: '8px',
40
- backgroundColor: '#f4f4f5',
41
+ backgroundColor: 'background.paper',
41
42
  height: '24px',
42
43
  display: 'flex',
43
44
  alignItems: 'center',
@@ -123,8 +124,9 @@ export default function DonationPreview({ config }: { config: TSetting['settings
123
124
  width: '16px',
124
125
  height: '16px',
125
126
  borderRadius: '50%',
126
- bgcolor: '#e0e0e0',
127
- border: '2px solid #fff',
127
+ bgcolor: 'grey.200',
128
+ border: '2px solid',
129
+ borderColor: 'grey.100',
128
130
  position: 'relative',
129
131
  }}
130
132
  />
@@ -133,7 +135,7 @@ export default function DonationPreview({ config }: { config: TSetting['settings
133
135
  width: '100%',
134
136
  height: 8,
135
137
  borderRadius: 1,
136
- bgcolor: '#e0e0e0',
138
+ bgcolor: 'grey.200',
137
139
  }}
138
140
  />
139
141
  </Box>
@@ -143,7 +145,7 @@ export default function DonationPreview({ config }: { config: TSetting['settings
143
145
  width: '25%',
144
146
  height: 8,
145
147
  borderRadius: 1,
146
- bgcolor: '#e0e0e0',
148
+ bgcolor: 'grey.200',
147
149
  }}
148
150
  />
149
151
  </Box>
@@ -175,7 +177,7 @@ export default function DonationPreview({ config }: { config: TSetting['settings
175
177
  variant="outlined"
176
178
  size="small"
177
179
  sx={{
178
- borderColor: selectedAmount === amount ? 'primary.main' : 'divider',
180
+ borderColor: selectedAmount === amount ? 'primary.main' : 'grey.100',
179
181
  borderWidth: selectedAmount === amount ? 2 : 1,
180
182
  color: selectedAmount === amount ? 'primary.main' : 'text.primary',
181
183
  }}
@@ -188,7 +190,7 @@ export default function DonationPreview({ config }: { config: TSetting['settings
188
190
  variant="outlined"
189
191
  size="small"
190
192
  sx={{
191
- borderColor: showCustom ? 'primary.main' : 'divider',
193
+ borderColor: showCustom ? 'primary.main' : 'grey.100',
192
194
  borderWidth: showCustom ? 2 : 1,
193
195
  color: showCustom ? 'primary.main' : 'text.primary',
194
196
  }}
@@ -226,7 +228,7 @@ export default function DonationPreview({ config }: { config: TSetting['settings
226
228
  sx={{
227
229
  px: 2,
228
230
  py: 0.5,
229
- bgcolor: '#f5f5f5',
231
+ bgcolor: 'grey.200',
230
232
  borderRadius: 1,
231
233
  width: 40,
232
234
  height: 24,
@@ -50,7 +50,7 @@ function Integrations() {
50
50
  fontWeight: '500',
51
51
  color: 'text.lighter',
52
52
  '&.Mui-selected': {
53
- color: 'text.primary',
53
+ color: 'primary.main',
54
54
  },
55
55
  },
56
56
  '.MuiTouchRipple-root': {
@@ -89,8 +89,7 @@ export default function Overview() {
89
89
  height: '100%',
90
90
  cursor: 'pointer',
91
91
  '&:hover': {
92
- boxShadow:
93
- '0px 0px 0px 1px var(--shadows-card-hover-1, rgba(2, 7, 19, 0.08)), 0px 1px 2px -1px var(--shadows-card-hover-2, rgba(2, 7, 19, 0.08)), 0px 2px 8px 0px var(--shadows-card-hover-3, rgba(2, 7, 19, 0.10))',
92
+ boxShadow: 2,
94
93
  },
95
94
  }}>
96
95
  <Box mb={1}>
@@ -122,8 +121,7 @@ export default function Overview() {
122
121
  height: '100%',
123
122
  cursor: 'pointer',
124
123
  '&:hover': {
125
- boxShadow:
126
- '0px 0px 0px 1px var(--shadows-card-hover-1, rgba(2, 7, 19, 0.08)), 0px 1px 2px -1px var(--shadows-card-hover-2, rgba(2, 7, 19, 0.08)), 0px 2px 8px 0px var(--shadows-card-hover-3, rgba(2, 7, 19, 0.10))',
124
+ boxShadow: 2,
127
125
  },
128
126
  }}>
129
127
  <Box mb={1}>