azirid-react 0.10.5 → 0.11.0

package/README.md

@@ -639,9 +639,27 @@ const { data: providers } = usePaymentProviders()
 // [{ provider: 'STRIPE', checkout: true, subscriptions: true }, ...]
 ```
 
+### `useUploadTransferProof`
+
+Upload a file (image or PDF) to S3 via presigned URL for use as transfer proof.
+
+```tsx
+import { useUploadTransferProof } from 'azirid-react'
+
+const { upload, isUploading, publicUrl, error, reset } = useUploadTransferProof({
+  onSuccess: (result) => console.log('Uploaded:', result.publicUrl),
+  onError: (err) => console.error(err),
+})
+
+// Upload a file (returns { uploadUrl, publicUrl })
+const result = await upload(file) // File from <input type="file">
+```
+
+**Accepted file types:** PNG, JPG, WebP, PDF (max 10MB)
+
 ### `useSubmitTransferProof`
 
-Submit proof of a manual bank transfer payment.
+Submit proof of a manual bank transfer payment (requires a pre-uploaded file URL).
 
 ```tsx
 import { useSubmitTransferProof } from 'azirid-react'
@@ -651,9 +669,9 @@ const { submit, isPending } = useSubmitTransferProof({
 })
 
 submit({
-  planId: 'plan_123',
+  intentId: 'intent_123',
   fileUrl: 'https://storage.example.com/receipt.pdf',
-  amount: 9999,
+  amount: 29.99,
   currency: 'USD',
   notes: 'Bank transfer from Account #1234',
 })
@@ -785,28 +803,30 @@ function CheckoutPage({ intentId }: { intentId: string }) {
 
 ### `useTransferPayment`
 
-Hook for manual bank transfer payments. Pass an `intentId` and get a component with bank details + a function to submit proof of payment.
+Hook for manual bank transfer payments. Pass an `intentId` and get a component with bank details + functions to upload and submit proof of payment.
 
 ```tsx
 import { useTransferPayment } from 'azirid-react'
 
 function TransferPage({ intentId }: { intentId: string }) {
-  const { TransferDetails, submitProof, status, error } = useTransferPayment({
+  const {
+    TransferDetails, uploadAndSubmitProof, status, error,
+  } = useTransferPayment({
     intentId,
     onProofSubmitted: (proof) => console.log('Proof sent:', proof.id),
     onError: (err) => console.error(err),
   })
 
+  const handleFileChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+    const file = e.target.files?.[0]
+    if (file) uploadAndSubmitProof(file, 'Transfer ref #123')
+  }
+
   return (
     <div>
       <TransferDetails />
-      {status === 'ready' && (
-        <button onClick={() => submitProof({
-          fileUrl: 'https://...', amount: 29.99, notes: 'Transfer ref #123'
-        })}>
-          Submit proof
-        </button>
-      )}
+      {status === 'ready' && <input type="file" accept="image/*,.pdf" onChange={handleFileChange} />}
+      {status === 'uploading' && <p>Uploading...</p>}
       {status === 'submitting' && <p>Submitting...</p>}
       {status === 'submitted' && <p>Proof submitted!</p>}
       {status === 'error' && <p>Error: {error?.message}</p>}
@@ -825,9 +845,11 @@ function TransferPage({ intentId }: { intentId: string }) {
 | Return | Type | Description |
 |--------|------|-------------|
 | `TransferDetails` | Component | Amount, bank details, and transfer instructions |
-| `submitProof` | `(data) => void` | Submit transfer proof (fileUrl, amount, notes, etc.) |
-| `status` | `TransferPaymentStatus` | `'idle' \| 'loading' \| 'ready' \| 'submitting' \| 'submitted' \| 'error'` |
+| `uploadAndSubmitProof` | `(file: File, notes?: string) => Promise<void>` | Upload file to S3 and submit proof in one step |
+| `submitProof` | `(data) => void` | Submit transfer proof with pre-uploaded file URL |
+| `status` | `TransferPaymentStatus` | `'idle' \| 'loading' \| 'ready' \| 'uploading' \| 'submitting' \| 'submitted' \| 'error'` |
 | `checkoutData` | `CheckoutResponse \| null` | Full checkout response |
+| `isUploading` | `boolean` | File upload in progress |
 | `isSubmitting` | `boolean` | Proof submission in progress |
 | `error` | `Error \| null` | Error details |
 
@@ -894,6 +916,7 @@ import { PayButton } from 'azirid-react'
 | `onSuccess`        | `(data) => void`              | —       | Called on successful checkout. For `MANUAL_TRANSFER` and `PAYPHONE`, deferred until the user closes the modal |
 | `onError`          | `(error) => void`             | —       | Called on error                               |
 | `onProviderSelect` | `(provider: string) => void`  | —       | Called when a provider is selected            |
+| `onProofSubmitted` | `(proof) => void`             | —       | Called when transfer proof is submitted (MANUAL_TRANSFER only) |
 | `children`         | `ReactNode`                   | —       | Button label                                  |
 | `disabled`         | `boolean`                     | —       | Disable the button                            |
 
@@ -1704,8 +1727,10 @@ import type {
 | `BillingInvoice`          | Invoice (`amount`, `currency`, `status`, `paidAt`, `invoiceUrl`, ...)                        |
 | `PaymentProviderType`     | `'STRIPE' \| 'PAYPAL' \| 'PAYPHONE' \| 'NUVEI' \| 'MANUAL_TRANSFER'`                         |
 | `AvailableProvider`       | Provider info (`provider`, `checkout`, `subscriptions`)                                      |
-| `SubmitTransferProofData` | Transfer proof payload (`planId`, `fileUrl`, `amount`, ...)                                  |
+| `SubmitTransferProofData` | Transfer proof payload (`intentId`, `fileUrl`, `amount`, ...)                                |
 | `TransferProof`           | Transfer proof object (`status`: `PENDING_REVIEW \| APPROVED \| REJECTED`, ...)              |
+| `UploadTransferProofRequest` | Upload request (`contentType`, `fileSize`)                                                |
+| `UploadTransferProofResponse` | Upload response (`uploadUrl`, `publicUrl`)                                               |
 | `PayphoneWidgetConfig`    | Payphone widget config (`token`, `storeId`, `amount`, ...)                                   |
 | `PaymentIntent`           | Payment intent (`amount`, `subtotal?`, `taxRate?`, `taxAmount?`, `reference?`, ...)          |