@hanzo/commerce 2.0.0 → 2.1.0
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.
- package/components/checkout/index.tsx +17 -65
- package/components/checkout/payment/contact-info.tsx +59 -0
- package/components/checkout/payment/index.tsx +117 -0
- package/components/checkout/payment/pay-with-bank-transfer.tsx +106 -0
- package/components/checkout/payment/pay-with-card.tsx +193 -0
- package/components/checkout/{pay-with-crypto.tsx → payment/pay-with-crypto.tsx} +51 -28
- package/components/checkout/payment/payment-methods/amex.tsx +32 -0
- package/components/checkout/payment/payment-methods/diners-club.tsx +13 -0
- package/components/checkout/payment/payment-methods/discover.tsx +25 -0
- package/components/checkout/payment/payment-methods/index.tsx +24 -0
- package/components/checkout/payment/payment-methods/jcb.tsx +26 -0
- package/components/checkout/payment/payment-methods/mastercard.tsx +27 -0
- package/components/checkout/payment/payment-methods/visa.tsx +25 -0
- package/components/checkout/shipping-info.tsx +4 -10
- package/package.json +5 -3
- package/service/impls/standalone/orders/index.ts +42 -20
- package/service/impls/standalone/standalone-service.ts +11 -6
- package/types/checkout.ts +6 -0
- package/types/commerce-service.ts +3 -3
- package/types/index.ts +1 -3
- package/util/index.ts +2 -1
- package/util/square-payment.ts +43 -0
- package/components/checkout/contact-info.tsx +0 -83
- package/components/checkout/pay-by-bank-transfer.tsx +0 -76
|
@@ -1,83 +0,0 @@
|
|
|
1
|
-
'use client'
|
|
2
|
-
|
|
3
|
-
import {
|
|
4
|
-
Form,
|
|
5
|
-
FormControl,
|
|
6
|
-
FormField,
|
|
7
|
-
FormItem,
|
|
8
|
-
FormLabel,
|
|
9
|
-
FormMessage,
|
|
10
|
-
} from '@hanzo/ui/primitives/form'
|
|
11
|
-
import { Input, Button } from '@hanzo/ui/primitives'
|
|
12
|
-
import { User } from 'lucide-react'
|
|
13
|
-
import { EnhHeadingBlockComponent, type EnhHeadingBlock } from '@hanzo/ui/blocks'
|
|
14
|
-
import type { UseFormReturn } from 'react-hook-form'
|
|
15
|
-
|
|
16
|
-
const ContactInfo: React.FC<{
|
|
17
|
-
form: UseFormReturn<{
|
|
18
|
-
name: string;
|
|
19
|
-
email: string;
|
|
20
|
-
}, any, {
|
|
21
|
-
name: string;
|
|
22
|
-
email: string;
|
|
23
|
-
}>,
|
|
24
|
-
selectPaymentMethod: (method: 'crypto' | 'bank') => Promise<void>,
|
|
25
|
-
}> = ({
|
|
26
|
-
form,
|
|
27
|
-
selectPaymentMethod,
|
|
28
|
-
}) => {
|
|
29
|
-
return (
|
|
30
|
-
<Form {...form}>
|
|
31
|
-
<form className='text-left'>
|
|
32
|
-
<div className='flex flex-col gap-4'>
|
|
33
|
-
<div className='flex flex-col sm:flex-row gap-4'>
|
|
34
|
-
<FormField
|
|
35
|
-
control={form.control}
|
|
36
|
-
name='name'
|
|
37
|
-
render={({ field }) => (
|
|
38
|
-
<FormItem className='space-y-1 w-full'>
|
|
39
|
-
<FormLabel>Name</FormLabel>
|
|
40
|
-
<FormControl>
|
|
41
|
-
<Input {...field} />
|
|
42
|
-
</FormControl>
|
|
43
|
-
<FormMessage />
|
|
44
|
-
</FormItem>
|
|
45
|
-
)}
|
|
46
|
-
/>
|
|
47
|
-
<FormField
|
|
48
|
-
control={form.control}
|
|
49
|
-
name='email'
|
|
50
|
-
render={({ field }) => (
|
|
51
|
-
<FormItem className='space-y-1 w-full'>
|
|
52
|
-
<FormLabel>Email</FormLabel>
|
|
53
|
-
<FormControl>
|
|
54
|
-
<Input {...field} />
|
|
55
|
-
</FormControl>
|
|
56
|
-
<FormMessage />
|
|
57
|
-
</FormItem>
|
|
58
|
-
)}
|
|
59
|
-
/>
|
|
60
|
-
</div>
|
|
61
|
-
<div className='flex flex-col sm:flex-row gap-4 items-center'>
|
|
62
|
-
<Button
|
|
63
|
-
type='button'
|
|
64
|
-
onClick={() => selectPaymentMethod('crypto')}
|
|
65
|
-
className='mx-auto w-full'
|
|
66
|
-
>
|
|
67
|
-
Pay with crypto
|
|
68
|
-
</Button>
|
|
69
|
-
<Button
|
|
70
|
-
type='button'
|
|
71
|
-
onClick={() => selectPaymentMethod('bank')}
|
|
72
|
-
className='mx-auto w-full'
|
|
73
|
-
>
|
|
74
|
-
Bank transfer
|
|
75
|
-
</Button>
|
|
76
|
-
</div>
|
|
77
|
-
</div>
|
|
78
|
-
</form>
|
|
79
|
-
</Form>
|
|
80
|
-
)
|
|
81
|
-
}
|
|
82
|
-
|
|
83
|
-
export default ContactInfo
|
|
@@ -1,76 +0,0 @@
|
|
|
1
|
-
'use client'
|
|
2
|
-
|
|
3
|
-
import type { ReactNode } from 'react'
|
|
4
|
-
import { Copy } from 'lucide-react'
|
|
5
|
-
|
|
6
|
-
import { Button, Tabs, TabsContent, TabsList, TabsTrigger, toast } from '@hanzo/ui/primitives'
|
|
7
|
-
import { EnhHeadingBlockComponent, type EnhHeadingBlock, type Block } from '@hanzo/ui/blocks'
|
|
8
|
-
|
|
9
|
-
const InfoField: React.FC<{label: string, value: ReactNode, copyValue: string}> = ({label, value, copyValue}) => {
|
|
10
|
-
const copyToClipboard = (label: string, text: string) => {
|
|
11
|
-
navigator.clipboard.writeText(text)
|
|
12
|
-
toast({title: `${label} copied to clipboard`})
|
|
13
|
-
}
|
|
14
|
-
|
|
15
|
-
return (
|
|
16
|
-
<div className='flex flex-col gap-1'>
|
|
17
|
-
<p className='text-xs'>{label}</p>
|
|
18
|
-
<div className='flex items-center justify-between text-lg border rounded-lg py-2 px-4'>
|
|
19
|
-
{value}
|
|
20
|
-
<Button variant='ghost' size='icon' onClick={() => copyToClipboard(label, copyValue)}>
|
|
21
|
-
<Copy className='h-4 w-4'/>
|
|
22
|
-
</Button>
|
|
23
|
-
</div>
|
|
24
|
-
</div>
|
|
25
|
-
)
|
|
26
|
-
}
|
|
27
|
-
|
|
28
|
-
const PayByBankTransfer: React.FC<{setCurrentStep: (step: number) => void}> = ({setCurrentStep}) => {
|
|
29
|
-
return (<>
|
|
30
|
-
<Tabs defaultValue="usd" className='w-full mx-auto max-w-[50rem]'>
|
|
31
|
-
<TabsList className="grid w-full grid-cols-2 max-w-[15rem] mx-auto bg-level-2">
|
|
32
|
-
<TabsTrigger value="usd">USD</TabsTrigger>
|
|
33
|
-
<TabsTrigger value="eur">EUR/GBP</TabsTrigger>
|
|
34
|
-
</TabsList>
|
|
35
|
-
<TabsContent value="usd">
|
|
36
|
-
<div className='flex flex-col gap-4 w-full'>
|
|
37
|
-
<InfoField
|
|
38
|
-
label='Beneficiary Bank'
|
|
39
|
-
value={<div>Bank of America<br/>NA 222 Broadway<br/>New York, New York. 10038</div>}
|
|
40
|
-
copyValue='Bank of America, NA 222 Broadway, New York, New York. 10038'
|
|
41
|
-
/>
|
|
42
|
-
<InfoField
|
|
43
|
-
label='Beneficiary'
|
|
44
|
-
value={<div>Hanzo, Inc<br/>4811 Mastin Street<br/>Merriam, KS 66203</div>}
|
|
45
|
-
copyValue='Hanzo, Inc, 4811 Mastin Street, Merriam, KS 66203'
|
|
46
|
-
/>
|
|
47
|
-
<InfoField label='Routing Number - ACH' value='113000023 / 111000025' copyValue='113000023 / 111000025'/>
|
|
48
|
-
<InfoField label='Routing Number - Wire' value='026009593' copyValue='026009593'/>
|
|
49
|
-
<InfoField label='Routing Number - SWIFT' value='BOFAUS3N' copyValue='BOFAUS3N'/>
|
|
50
|
-
<InfoField label='Reference' value='Lux' copyValue='Lux'/>
|
|
51
|
-
</div>
|
|
52
|
-
</TabsContent>
|
|
53
|
-
<TabsContent value="eur">
|
|
54
|
-
<div className='flex flex-col gap-4 w-full'>
|
|
55
|
-
<InfoField
|
|
56
|
-
label='Beneficiary Bank'
|
|
57
|
-
value={<div>Clear Junction Limited<br/>4th floor<br/>Imperial House</div>}
|
|
58
|
-
copyValue='Clear Junction Limited, 4th floor, Imperial House'
|
|
59
|
-
/>
|
|
60
|
-
<InfoField label='Account Number (GBP)' value='33781813' copyValue='33781813'/>
|
|
61
|
-
<InfoField label='Account Name' value='AiDLT Global Ltd.' copyValue='AiDLT Global Ltd.'/>
|
|
62
|
-
<InfoField label='SWIFT/BIC' value='CLJUGB21' copyValue='CLJUGB21'/>
|
|
63
|
-
<InfoField label='Sort Code (GBP)' value='041307' copyValue='041307'/>
|
|
64
|
-
<InfoField label='IBAN' value='GB75 CLJU 0413 0733 78181 3' copyValue='GB75 CLJU 0413 0733 78181 3'/>
|
|
65
|
-
<InfoField label='Reference' value='Lux' copyValue='Lux'/>
|
|
66
|
-
</div>
|
|
67
|
-
</TabsContent>
|
|
68
|
-
</Tabs>
|
|
69
|
-
<div className='flex gap-4 items-center mt-6'>
|
|
70
|
-
<Button variant='outline' onClick={() => setCurrentStep(1)} className='mx-auto w-full'>Back</Button>
|
|
71
|
-
<Button onClick={() => setCurrentStep(3)} className='mx-auto w-full'>Continue</Button>
|
|
72
|
-
</div>
|
|
73
|
-
</>)
|
|
74
|
-
}
|
|
75
|
-
|
|
76
|
-
export default PayByBankTransfer
|