@opexa/portal-components 0.0.1033 → 0.0.1034

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.
@@ -60,7 +60,10 @@ export function GCashStandardCashInWithdrawal() {
60
60
  const minimumAmount = parseDecimal(gatewaySettings?.minimumAmount, 0);
61
61
  const maximumAmount = parseDecimal(gatewaySettings?.maximumAmount, 0);
62
62
  const definition = z.object({
63
- amount: z.string().superRefine((val, ctx) => {
63
+ amount: z
64
+ .string()
65
+ .regex(/^\d+$/, 'Amount must be a whole number')
66
+ .superRefine((val, ctx) => {
64
67
  const n = parseDecimal(val, 0);
65
68
  if (n < minimumAmount) {
66
69
  ctx.addIssue({
@@ -120,7 +123,11 @@ export function GCashStandardCashInWithdrawal() {
120
123
  });
121
124
  return (_jsxs("form", { onSubmit: handleSubmit, noValidate: true, autoComplete: "off", children: [_jsxs(Field.Root, { invalid: !!form.formState.errors.mobileNumber, children: [_jsx(Field.Label, { children: "Mobile Number" }), _jsxs("div", { className: "relative", children: [_jsx(localeInfo.country.flag, { className: "-translate-y-1/2 pointer-events-none absolute top-1/2 left-3.5 size-5" }), _jsx(Field.Input, { className: "pl-10.5", ...form.register('mobileNumber') })] }), _jsx(Field.ErrorText, { children: form.formState.errors.mobileNumber?.message })] }), _jsx(Controller, { control: form.control, name: "amount", render: (o) => (_jsxs(Field.Root, { invalid: !!form.formState.errors.amount, className: "mt-3xl", children: [_jsxs(NumberInput.Root, { min: 0, step: 1, value: o.field.value, onValueChange: (details) => {
122
125
  o.field.onChange(details.value);
123
- }, allowMouseWheel: true, children: [_jsx(NumberInput.Label, { children: "Enter amount you want to withdraw" }), _jsxs(NumberInput.Control, { children: [_jsx(NumberInput.Input, {}), _jsx(NumberInput.IncrementTrigger, { children: _jsx(ChevronUpIcon, {}) }), _jsx(NumberInput.DecrementTrigger, { children: _jsx(ChevronDownIcon, {}) })] })] }), _jsx(Field.ErrorText, { children: form.formState.errors.amount?.message })] })) }), _jsx(AmountChoices, { value: parseDecimal(form.watch('amount'), 0), onChange: (value) => {
126
+ }, allowMouseWheel: true, children: [_jsx(NumberInput.Label, { children: "Enter amount you want to withdraw" }), _jsxs(NumberInput.Control, { children: [_jsx(NumberInput.Input, { onKeyDown: (e) => {
127
+ if (['e', 'E', '.', '-', '+', ','].includes(e.key)) {
128
+ e.preventDefault();
129
+ }
130
+ } }), _jsx(NumberInput.IncrementTrigger, { children: _jsx(ChevronUpIcon, {}) }), _jsx(NumberInput.DecrementTrigger, { children: _jsx(ChevronDownIcon, {}) })] })] }), _jsx(Field.ErrorText, { children: form.formState.errors.amount?.message })] })) }), _jsx(AmountChoices, { value: parseDecimal(form.watch('amount'), 0), onChange: (value) => {
124
131
  form.setValue('amount', value.toString(), {
125
132
  shouldTouch: true,
126
133
  shouldDirty: true,
@@ -60,7 +60,10 @@ export function GCashWithdrawal() {
60
60
  const minimumAmount = parseDecimal(gatewaySettings?.minimumAmount, 0);
61
61
  const maximumAmount = parseDecimal(gatewaySettings?.maximumAmount, 0);
62
62
  const definition = z.object({
63
- amount: z.string().superRefine((val, ctx) => {
63
+ amount: z
64
+ .string()
65
+ .regex(/^\d+$/, 'Amount must be a whole number')
66
+ .superRefine((val, ctx) => {
64
67
  const n = parseDecimal(val, 0);
65
68
  if (n < minimumAmount) {
66
69
  ctx.addIssue({
@@ -120,7 +123,11 @@ export function GCashWithdrawal() {
120
123
  });
121
124
  return (_jsxs("form", { onSubmit: handleSubmit, noValidate: true, autoComplete: "off", children: [_jsxs(Field.Root, { invalid: !!form.formState.errors.mobileNumber, children: [_jsx(Field.Label, { children: "Mobile Number" }), _jsxs("div", { className: "relative", children: [_jsx(localeInfo.country.flag, { className: "-translate-y-1/2 pointer-events-none absolute top-1/2 left-3.5 size-5" }), _jsx(Field.Input, { className: "pl-10.5", ...form.register('mobileNumber') })] }), _jsx(Field.ErrorText, { children: form.formState.errors.mobileNumber?.message })] }), _jsx(Controller, { control: form.control, name: "amount", render: (o) => (_jsxs(Field.Root, { invalid: !!form.formState.errors.amount, className: "mt-3xl", children: [_jsxs(NumberInput.Root, { min: 0, step: 1, value: o.field.value, onValueChange: (details) => {
122
125
  o.field.onChange(details.value);
123
- }, allowMouseWheel: true, children: [_jsx(NumberInput.Label, { children: "Enter amount you want to withdraw" }), _jsxs(NumberInput.Control, { children: [_jsx(NumberInput.Input, {}), _jsx(NumberInput.IncrementTrigger, { children: _jsx(ChevronUpIcon, {}) }), _jsx(NumberInput.DecrementTrigger, { children: _jsx(ChevronDownIcon, {}) })] })] }), _jsx(Field.ErrorText, { children: form.formState.errors.amount?.message })] })) }), _jsx(AmountChoices, { value: parseDecimal(form.watch('amount'), 0), onChange: (value) => {
126
+ }, allowMouseWheel: true, children: [_jsx(NumberInput.Label, { children: "Enter amount you want to withdraw" }), _jsxs(NumberInput.Control, { children: [_jsx(NumberInput.Input, { onKeyDown: (e) => {
127
+ if (['e', 'E', '.', '-', '+', ','].includes(e.key)) {
128
+ e.preventDefault();
129
+ }
130
+ } }), _jsx(NumberInput.IncrementTrigger, { children: _jsx(ChevronUpIcon, {}) }), _jsx(NumberInput.DecrementTrigger, { children: _jsx(ChevronDownIcon, {}) })] })] }), _jsx(Field.ErrorText, { children: form.formState.errors.amount?.message })] })) }), _jsx(AmountChoices, { value: parseDecimal(form.watch('amount'), 0), onChange: (value) => {
124
131
  form.setValue('amount', value.toString(), {
125
132
  shouldTouch: true,
126
133
  shouldDirty: true,
@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { zodResolver } from '@hookform/resolvers/zod';
3
3
  import Link from 'next/link';
4
4
  import { useEffect, useState } from 'react';
5
- import { useForm } from 'react-hook-form';
5
+ import { Controller, useForm } from 'react-hook-form';
6
6
  import { z } from 'zod';
7
7
  import { useShallow } from 'zustand/shallow';
8
8
  import { useAccountQuery } from '../../../../client/hooks/useAccountQuery.js';
@@ -11,6 +11,8 @@ import { useGlobalStore } from '../../../../client/hooks/useGlobalStore.js';
11
11
  import { usePaymentSettingsQuery } from '../../../../client/hooks/usePaymentSettingsQuery.js';
12
12
  import { useWalletQuery } from '../../../../client/hooks/useWalletQuery.js';
13
13
  import { AlertCircleIcon } from '../../../../icons/AlertCircleIcon.js';
14
+ import { ChevronDownIcon } from '../../../../icons/ChevronDownIcon.js';
15
+ import { ChevronUpIcon } from '../../../../icons/ChevronUpIcon.js';
14
16
  import { EyeIcon } from '../../../../icons/EyeIcon.js';
15
17
  import { EyeOffIcon } from '../../../../icons/EyeOffIcon.js';
16
18
  import { SpinnerIcon } from '../../../../icons/SpinnerIcon.js';
@@ -18,6 +20,7 @@ import { XIcon } from '../../../../icons/XIcon.js';
18
20
  import { AlertDialog } from '../../../../ui/AlertDialog/index.js';
19
21
  import { Button } from '../../../../ui/Button/index.js';
20
22
  import { Field } from '../../../../ui/Field/index.js';
23
+ import { NumberInput } from '../../../../ui/NumberInput/index.js';
21
24
  import { PasswordInput } from '../../../../ui/PasswordInput/index.js';
22
25
  import { Portal } from '../../../../ui/Portal/index.js';
23
26
  import { parseDecimal } from '../../../../utils/parseDecimal.js';
@@ -120,7 +123,13 @@ export function InstapayGCashWithdrawal() {
120
123
  bankCode: 'BNKGCH',
121
124
  });
122
125
  });
123
- return (_jsxs("form", { onSubmit: handleSubmit, noValidate: true, autoComplete: "off", id: "hook-form", children: [_jsxs(Field.Root, { invalid: !!form.formState.errors.accountNumber, children: [_jsx(Field.Label, { children: "Phone Number" }), _jsx(Field.Input, { ...form.register('accountNumber') }), _jsx(Field.ErrorText, { children: form.formState.errors.accountNumber?.message })] }), _jsxs(Field.Root, { invalid: !!form.formState.errors.accountName, className: "mt-3xl", children: [_jsx(Field.Label, { children: "Account name" }), _jsx(Field.Input, { ...form.register('accountName') }), _jsx(Field.ErrorText, { children: form.formState.errors.accountName?.message })] }), _jsxs(Field.Root, { invalid: !!form.formState.errors.amount, className: "mt-3xl", children: [_jsx(Field.Label, { children: "Enter amount you want to withdraw" }), _jsx(Field.Input, { type: "number", ...form.register('amount'), onKeyDown: (e) => {
126
+ return (_jsxs("form", { onSubmit: handleSubmit, noValidate: true, autoComplete: "off", id: "hook-form", children: [_jsx(Controller, { control: form.control, name: "accountNumber", render: (o) => (_jsxs(Field.Root, { invalid: !!form.formState.errors.amount, className: "mt-3xl", children: [_jsxs(NumberInput.Root, { min: 0, step: 1, value: o.field.value, onValueChange: (details) => {
127
+ o.field.onChange(details.value);
128
+ }, allowMouseWheel: true, children: [_jsx(NumberInput.Label, { children: "Phone Number" }), _jsxs(NumberInput.Control, { children: [_jsx(NumberInput.Input, { onKeyDown: (e) => {
129
+ if (['e', 'E', '.', '-', '+', ','].includes(e.key)) {
130
+ e.preventDefault();
131
+ }
132
+ } }), _jsx(NumberInput.IncrementTrigger, { children: _jsx(ChevronUpIcon, {}) }), _jsx(NumberInput.DecrementTrigger, { children: _jsx(ChevronDownIcon, {}) })] })] }), _jsx(Field.ErrorText, { children: form.formState.errors.accountNumber?.message })] })) }), _jsxs(Field.Root, { invalid: !!form.formState.errors.accountName, className: "mt-3xl", children: [_jsx(Field.Label, { children: "Account name" }), _jsx(Field.Input, { ...form.register('accountName') }), _jsx(Field.ErrorText, { children: form.formState.errors.accountName?.message })] }), _jsxs(Field.Root, { invalid: !!form.formState.errors.amount, className: "mt-3xl", children: [_jsx(Field.Label, { children: "Enter amount you want to withdraw" }), _jsx(Field.Input, { type: "number", ...form.register('amount'), onKeyDown: (e) => {
124
133
  if (['e', 'E', '.', '-', '+', ','].includes(e.key)) {
125
134
  e.preventDefault();
126
135
  }
@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { zodResolver } from '@hookform/resolvers/zod';
3
3
  import Link from 'next/link';
4
4
  import { useEffect, useState } from 'react';
5
- import { useForm } from 'react-hook-form';
5
+ import { Controller, useForm } from 'react-hook-form';
6
6
  import { z } from 'zod';
7
7
  import { useShallow } from 'zustand/shallow';
8
8
  import { useAccountQuery } from '../../../../client/hooks/useAccountQuery.js';
@@ -11,6 +11,8 @@ import { useGlobalStore } from '../../../../client/hooks/useGlobalStore.js';
11
11
  import { usePaymentSettingsQuery } from '../../../../client/hooks/usePaymentSettingsQuery.js';
12
12
  import { useWalletQuery } from '../../../../client/hooks/useWalletQuery.js';
13
13
  import { AlertCircleIcon } from '../../../../icons/AlertCircleIcon.js';
14
+ import { ChevronDownIcon } from '../../../../icons/ChevronDownIcon.js';
15
+ import { ChevronUpIcon } from '../../../../icons/ChevronUpIcon.js';
14
16
  import { EyeIcon } from '../../../../icons/EyeIcon.js';
15
17
  import { EyeOffIcon } from '../../../../icons/EyeOffIcon.js';
16
18
  import { SpinnerIcon } from '../../../../icons/SpinnerIcon.js';
@@ -18,6 +20,7 @@ import { XIcon } from '../../../../icons/XIcon.js';
18
20
  import { AlertDialog } from '../../../../ui/AlertDialog/index.js';
19
21
  import { Button } from '../../../../ui/Button/index.js';
20
22
  import { Field } from '../../../../ui/Field/index.js';
23
+ import { NumberInput } from '../../../../ui/NumberInput/index.js';
21
24
  import { PasswordInput } from '../../../../ui/PasswordInput/index.js';
22
25
  import { Portal } from '../../../../ui/Portal/index.js';
23
26
  import { parseDecimal } from '../../../../utils/parseDecimal.js';
@@ -120,7 +123,13 @@ export function InstapayPaymayaWithdrawal() {
120
123
  bankCode: 'BNKMYA',
121
124
  });
122
125
  });
123
- return (_jsxs("form", { onSubmit: handleSubmit, noValidate: true, autoComplete: "off", id: "hook-form", children: [_jsxs(Field.Root, { invalid: !!form.formState.errors.accountNumber, children: [_jsx(Field.Label, { children: "Phone Number" }), _jsx(Field.Input, { ...form.register('accountNumber') }), _jsx(Field.ErrorText, { children: form.formState.errors.accountNumber?.message })] }), _jsxs(Field.Root, { invalid: !!form.formState.errors.accountName, className: "mt-3xl", children: [_jsx(Field.Label, { children: "Account name" }), _jsx(Field.Input, { ...form.register('accountName') }), _jsx(Field.ErrorText, { children: form.formState.errors.accountName?.message })] }), _jsxs(Field.Root, { invalid: !!form.formState.errors.amount, className: "mt-3xl", children: [_jsx(Field.Label, { children: "Enter amount you want to withdraw" }), _jsx(Field.Input, { type: "number", ...form.register('amount'), onKeyDown: (e) => {
126
+ return (_jsxs("form", { onSubmit: handleSubmit, noValidate: true, autoComplete: "off", id: "hook-form", children: [_jsx(Controller, { control: form.control, name: "accountNumber", render: (o) => (_jsxs(Field.Root, { invalid: !!form.formState.errors.amount, className: "mt-3xl", children: [_jsxs(NumberInput.Root, { min: 0, step: 1, value: o.field.value, onValueChange: (details) => {
127
+ o.field.onChange(details.value);
128
+ }, allowMouseWheel: true, children: [_jsx(NumberInput.Label, { children: "Phone Number" }), _jsxs(NumberInput.Control, { children: [_jsx(NumberInput.Input, { onKeyDown: (e) => {
129
+ if (['e', 'E', '.', '-', '+', ','].includes(e.key)) {
130
+ e.preventDefault();
131
+ }
132
+ } }), _jsx(NumberInput.IncrementTrigger, { children: _jsx(ChevronUpIcon, {}) }), _jsx(NumberInput.DecrementTrigger, { children: _jsx(ChevronDownIcon, {}) })] })] }), _jsx(Field.ErrorText, { children: form.formState.errors.accountNumber?.message })] })) }), _jsxs(Field.Root, { invalid: !!form.formState.errors.accountName, className: "mt-3xl", children: [_jsx(Field.Label, { children: "Account name" }), _jsx(Field.Input, { ...form.register('accountName') }), _jsx(Field.ErrorText, { children: form.formState.errors.accountName?.message })] }), _jsxs(Field.Root, { invalid: !!form.formState.errors.amount, className: "mt-3xl", children: [_jsx(Field.Label, { children: "Enter amount you want to withdraw" }), _jsx(Field.Input, { type: "number", ...form.register('amount'), onKeyDown: (e) => {
124
133
  if (['e', 'E', '.', '-', '+', ','].includes(e.key)) {
125
134
  e.preventDefault();
126
135
  }
@@ -69,7 +69,10 @@ export function VentajaWithdrawal() {
69
69
  const accountQuery = useAccountQuery();
70
70
  const account = accountQuery.data;
71
71
  const definition = z.object({
72
- amount: z.string().superRefine((val, ctx) => {
72
+ amount: z
73
+ .string()
74
+ .regex(/^\d+$/, 'Amount must be a whole number')
75
+ .superRefine((val, ctx) => {
73
76
  const n = parseDecimal(val, 0);
74
77
  if (n < minimumAmount) {
75
78
  ctx.addIssue({
@@ -77,7 +80,7 @@ export function VentajaWithdrawal() {
77
80
  code: z.ZodIssueCode.too_small,
78
81
  inclusive: true,
79
82
  minimum: minimumAmount,
80
- message: `Minimum amount is ${minimumAmount.toLocaleString()}`,
83
+ message: `Please enter ${minimumAmount.toLocaleString()} or more to proceed with your withdrawal.`,
81
84
  });
82
85
  }
83
86
  if (n > maximumAmount) {
@@ -194,9 +197,11 @@ export function VentajaWithdrawal() {
194
197
  sameWidth: true,
195
198
  }, value: o.field.value ? [o.field.value] : [], onValueChange: (details) => {
196
199
  o.field.onChange(details.value.at(0) ?? '');
197
- }, children: [_jsx(Select.Label, { children: "Bank" }), _jsx(Select.Control, { children: _jsxs(Select.Trigger, { children: [_jsx(Select.ValueText, {}), _jsx(Select.Indicator, { asChild: true, children: _jsx(ChevronDownIcon, {}) })] }) }), _jsx(Select.Positioner, { children: _jsx(Select.Content, { children: _jsx(Select.ItemGroup, { children: bankCollection.items.map((item) => (_jsxs(Select.Item, { item: item, children: [_jsx(Select.ItemText, { children: item.name }), _jsx(Select.ItemIndicator, { asChild: true, children: _jsx(CheckIcon, {}) })] }, item.code))) }) }) })] }), _jsx(Field.ErrorText, { children: form.formState.errors.bankCode?.message })] })) }), _jsxs(Field.Root, { invalid: !!form.formState.errors.accountName, className: "mt-3xl", children: [_jsx(Field.Label, { children: "Account Name" }), _jsx(Field.Input, { ...form.register('accountName') }), _jsx(Field.ErrorText, { children: form.formState.errors.accountName?.message })] })] })), _jsxs(Field.Root, { invalid: !!form.formState.errors.accountNumber, className: "mt-3xl", children: [_jsx(Field.Label, { children: paymentMethod === 'INSTAPAY'
198
- ? 'Bank account number'
199
- : 'Phone Number' }), _jsx(Field.Input, { ...form.register('accountNumber') }), _jsx(Field.ErrorText, { children: form.formState.errors.accountNumber?.message })] }), _jsx(Controller, { control: form.control, name: "amount", render: (o) => (_jsxs(Field.Root, { invalid: !!form.formState.errors.amount, className: "mt-3xl", children: [_jsxs(NumberInput.Root, { min: 0, step: 1, value: o.field.value, onValueChange: (details) => {
200
+ }, children: [_jsx(Select.Label, { children: "Bank" }), _jsx(Select.Control, { children: _jsxs(Select.Trigger, { children: [_jsx(Select.ValueText, {}), _jsx(Select.Indicator, { asChild: true, children: _jsx(ChevronDownIcon, {}) })] }) }), _jsx(Select.Positioner, { children: _jsx(Select.Content, { children: _jsx(Select.ItemGroup, { children: bankCollection.items.map((item) => (_jsxs(Select.Item, { item: item, children: [_jsx(Select.ItemText, { children: item.name }), _jsx(Select.ItemIndicator, { asChild: true, children: _jsx(CheckIcon, {}) })] }, item.code))) }) }) })] }), _jsx(Field.ErrorText, { children: form.formState.errors.bankCode?.message })] })) }), _jsxs(Field.Root, { invalid: !!form.formState.errors.accountName, className: "mt-3xl", children: [_jsx(Field.Label, { children: "Account Name" }), _jsx(Field.Input, { ...form.register('accountName') }), _jsx(Field.ErrorText, { children: form.formState.errors.accountName?.message })] })] })), _jsx(Controller, { control: form.control, name: "accountNumber", render: (o) => (_jsxs(Field.Root, { invalid: !!form.formState.errors.accountNumber, className: "mt-3xl", children: [_jsxs(NumberInput.Root, { min: 0, step: 1, value: o.field.value, onValueChange: (details) => {
201
+ o.field.onChange(details.value);
202
+ }, allowMouseWheel: true, children: [_jsx(NumberInput.Label, { children: paymentMethod === 'INSTAPAY'
203
+ ? 'Bank account number'
204
+ : 'Phone Number' }), _jsxs(NumberInput.Control, { children: [_jsx(NumberInput.Input, {}), _jsx(NumberInput.IncrementTrigger, { children: _jsx(ChevronUpIcon, {}) }), _jsx(NumberInput.DecrementTrigger, { children: _jsx(ChevronDownIcon, {}) })] })] }), _jsx(Field.ErrorText, { children: form.formState.errors.accountNumber?.message })] })) }), _jsx(Controller, { control: form.control, name: "amount", render: (o) => (_jsxs(Field.Root, { invalid: !!form.formState.errors.amount, className: "mt-3xl", children: [_jsxs(NumberInput.Root, { min: 0, step: 1, value: o.field.value, onValueChange: (details) => {
200
205
  o.field.onChange(details.value);
201
206
  }, allowMouseWheel: true, children: [_jsx(NumberInput.Label, { children: "Enter amount you want to withdraw" }), _jsxs(NumberInput.Control, { children: [_jsx(NumberInput.Input, {}), _jsx(NumberInput.IncrementTrigger, { children: _jsx(ChevronUpIcon, {}) }), _jsx(NumberInput.DecrementTrigger, { children: _jsx(ChevronDownIcon, {}) })] })] }), _jsx(Field.ErrorText, { children: form.formState.errors.amount?.message })] })) }), _jsx(AmountChoices, { value: parseDecimal(form.watch('amount'), 0), onChange: (value) => {
202
207
  form.setValue('amount', value.toString(), {
@@ -57,7 +57,6 @@ export function Withdrawal() {
57
57
  const isMayaSessionValid = isMayaSessionValidQuery.data ?? true;
58
58
  const memberVerificationQuery = useMemberVerificationQuery();
59
59
  const memberVerification = memberVerificationQuery.data;
60
- console.log(account?.status, 'status');
61
60
  const enabledPaymentMethods = (() => {
62
61
  const l = [];
63
62
  if (onMaya) {
@@ -127,6 +126,7 @@ export function Withdrawal() {
127
126
  });
128
127
  return l;
129
128
  })();
129
+ console.log(enabledPaymentMethods, 'payment methods');
130
130
  const [paymentMethod, setPaymentMethod] = useState();
131
131
  useEffect(() => {
132
132
  if (enabledPaymentMethods.length > 0 && !paymentMethod) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@opexa/portal-components",
3
- "version": "0.0.1033",
3
+ "version": "0.0.1034",
4
4
  "exports": {
5
5
  "./ui/*": {
6
6
  "types": "./dist/ui/*/index.d.ts",