@opexa/portal-components 0.0.1074 → 0.0.1076

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.
@@ -3,6 +3,7 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
3
3
  import { clamp } from 'lodash-es';
4
4
  import Image from 'next/image';
5
5
  import Link from 'next/link';
6
+ import { useMemo } from 'react';
6
7
  import { useBonusQuery } from '../../client/hooks/useBonusQuery.js';
7
8
  import { useLocaleInfo } from '../../client/hooks/useLocaleInfo.js';
8
9
  import { useRemainingTime } from '../../client/hooks/useRemainingTime.js';
@@ -23,7 +24,14 @@ export function Bonus__client(props) {
23
24
  const gameProviders = props.gameProviders ?? [];
24
25
  const enabledGameProviders = bonus?.enabledGameProviders ?? [];
25
26
  const localeInfo = useLocaleInfo();
26
- const remainingTime = useRemainingTime(bonus?.promo.daysToClear ?? new Date());
27
+ const targetDate = useMemo(() => {
28
+ if (!bonus)
29
+ return new Date();
30
+ const date = new Date(bonus.dateTimeLastUpdated);
31
+ date.setDate(date.getDate() + bonus.promo.daysToClear);
32
+ return date;
33
+ }, [bonus]);
34
+ const remainingTime = useRemainingTime(targetDate);
27
35
  if (!bonus)
28
36
  return null;
29
37
  const turnoverRequirement = parseDecimal(bonus.turnoverRequirement, 0);
@@ -26,6 +26,7 @@ import { Checkbox } from '../../../ui/Checkbox/index.js';
26
26
  import { Dialog } from '../../../ui/Dialog/index.js';
27
27
  import { Field } from '../../../ui/Field/index.js';
28
28
  import { Select } from '../../../ui/Select/index.js';
29
+ import { NATIONALITY_OPTIONS } from '../../../utils/countries/getAllCountries.js';
29
30
  import { getQueryClient } from '../../../utils/getQueryClient.js';
30
31
  import { getAccountQueryKey, getMemberVerificationQueryKey, getSessionQueryKey, } from '../../../utils/queryKeys.js';
31
32
  import { useKYCDefaultContext } from './KYCDefaultContext.js';
@@ -58,6 +59,11 @@ const natureOfWorkCollection = createListCollection({
58
59
  itemToValue: (item) => item.value,
59
60
  itemToString: (item) => item.label,
60
61
  });
62
+ const nationalityCollection = createListCollection({
63
+ items: NATIONALITY_OPTIONS,
64
+ itemToValue: (item) => item.value,
65
+ itemToString: (item) => item.label,
66
+ });
61
67
  const definition = z
62
68
  .object({
63
69
  address: z.string().trim().min(1, 'Current address is required'),
@@ -67,7 +73,8 @@ const definition = z
67
73
  natureOfWork: z.string().min(1, 'Nature of Work is required'),
68
74
  natureOfWorkOther: z.string().optional(),
69
75
  placeOfBirth: z.string().trim().min(1, 'Place of Birth is required'),
70
- nationality: z.string().trim().min(1, 'Nationality is required'),
76
+ nationality: z.string().min(1, 'Nationality is required'),
77
+ nationalityOther: z.string().optional(),
71
78
  })
72
79
  .superRefine((data, ctx) => {
73
80
  if (data.sourceOfIncome === 'Others') {
@@ -88,6 +95,15 @@ const definition = z
88
95
  });
89
96
  }
90
97
  }
98
+ if (data.nationality === 'Others') {
99
+ if (!data.nationalityOther?.trim()) {
100
+ ctx.addIssue({
101
+ code: z.ZodIssueCode.custom,
102
+ message: 'Please specify your nationality',
103
+ path: ['nationalityOther'],
104
+ });
105
+ }
106
+ }
91
107
  });
92
108
  export function PersonalInformation() {
93
109
  const kyc = useKYCDefaultContext();
@@ -177,7 +193,8 @@ export function PersonalInformation() {
177
193
  resolver: zodResolver(definition),
178
194
  defaultValues: {
179
195
  address: '',
180
- nationality: '',
196
+ nationality: 'Filipino',
197
+ nationalityOther: '',
181
198
  placeOfBirth: '',
182
199
  permanentAddress: '',
183
200
  sourceOfIncome: '',
@@ -194,13 +211,16 @@ export function PersonalInformation() {
194
211
  const resolvedNatureOfWork = values.natureOfWork === 'Others'
195
212
  ? (values.natureOfWorkOther ?? '').trim()
196
213
  : values.natureOfWork;
214
+ const resolvedNationality = values.nationality === 'Others'
215
+ ? (values.nationalityOther ?? '').trim()
216
+ : values.nationality;
197
217
  const payload = {
198
218
  address: values.address,
199
219
  permanentAddress: values.permanentAddress,
200
220
  sourceOfIncome: resolvedSourceOfIncome,
201
221
  natureOfWork: resolvedNatureOfWork,
202
222
  placeOfBirth: values.placeOfBirth,
203
- nationality: values.nationality,
223
+ nationality: resolvedNationality,
204
224
  };
205
225
  if (!memberVerificationId) {
206
226
  createMemberVerificationMutation.mutate(payload);
@@ -252,7 +272,16 @@ export function PersonalInformation() {
252
272
  shouldValidate: true,
253
273
  });
254
274
  }
255
- }, positioning: { sameWidth: true, placement: 'bottom' }, lazyMount: true, unmountOnExit: true, children: [_jsxs(Select.Trigger, { children: [_jsx(Select.ValueText, { placeholder: "Select nature of work" }), _jsx(Select.Indicator, { asChild: true, children: _jsx(ChevronDownIcon, {}) })] }), _jsx(Select.Positioner, { children: _jsx(Select.Content, { children: NATURE_OF_WORK_OPTIONS.map((option) => (_jsx(Select.Item, { item: option, children: _jsx(Select.ItemText, { children: option.label }) }, option.value))) }) })] }), _jsx(Field.ErrorText, { children: fieldState.error?.message })] })) }), form.watch('natureOfWork') === 'Others' && (_jsxs(Field.Root, { className: "mt-xl", invalid: !!form.formState.errors.natureOfWorkOther, children: [_jsx(Field.Label, { children: "Please specify your nature of work" }), _jsx(Field.Input, { placeholder: "Please specify your nature of work", ...form.register('natureOfWorkOther') }), _jsx(Field.ErrorText, { children: form.formState.errors.natureOfWorkOther?.message })] })), _jsxs(Field.Root, { className: "mt-2xl", invalid: !!form.formState.errors.placeOfBirth, children: [_jsx(Field.Label, { children: "Place of birth" }), _jsx(Field.Input, { placeholder: "Enter your place of birth", ...form.register('placeOfBirth') }), _jsx(Field.ErrorText, { children: form.formState.errors.placeOfBirth?.message })] }), _jsxs(Field.Root, { className: "mt-2xl", invalid: !!form.formState.errors.nationality, children: [_jsx(Field.Label, { children: "Nationality" }), _jsx(Field.Input, { placeholder: "Enter your nationality", ...form.register('nationality') }), _jsx(Field.ErrorText, { children: form.formState.errors.nationality?.message })] }), _jsx(Button, { type: "submit", className: "mt-4xl", disabled: updateMemberVerificationMutation.isPending ||
275
+ }, positioning: { sameWidth: true, placement: 'bottom' }, lazyMount: true, unmountOnExit: true, children: [_jsxs(Select.Trigger, { children: [_jsx(Select.ValueText, { placeholder: "Select nature of work" }), _jsx(Select.Indicator, { asChild: true, children: _jsx(ChevronDownIcon, {}) })] }), _jsx(Select.Positioner, { children: _jsx(Select.Content, { children: NATURE_OF_WORK_OPTIONS.map((option) => (_jsx(Select.Item, { item: option, children: _jsx(Select.ItemText, { children: option.label }) }, option.value))) }) })] }), _jsx(Field.ErrorText, { children: fieldState.error?.message })] })) }), form.watch('natureOfWork') === 'Others' && (_jsxs(Field.Root, { className: "mt-xl", invalid: !!form.formState.errors.natureOfWorkOther, children: [_jsx(Field.Label, { children: "Please specify your nature of work" }), _jsx(Field.Input, { placeholder: "Please specify your nature of work", ...form.register('natureOfWorkOther') }), _jsx(Field.ErrorText, { children: form.formState.errors.natureOfWorkOther?.message })] })), _jsxs(Field.Root, { className: "mt-2xl", invalid: !!form.formState.errors.placeOfBirth, children: [_jsx(Field.Label, { children: "Place of birth" }), _jsx(Field.Input, { placeholder: "Enter your place of birth", ...form.register('placeOfBirth') }), _jsx(Field.ErrorText, { children: form.formState.errors.placeOfBirth?.message })] }), _jsx(Controller, { control: form.control, name: "nationality", render: ({ field, fieldState }) => (_jsxs(Field.Root, { className: "mt-2xl", invalid: fieldState.invalid, children: [_jsx(Field.Label, { children: "Nationality" }), _jsxs(Select.Root, { collection: nationalityCollection, value: field.value ? [field.value] : [], onValueChange: (details) => {
276
+ const selected = details.value?.[0] ?? '';
277
+ field.onChange(selected);
278
+ if (selected !== 'Others') {
279
+ form.setValue('nationalityOther', '', {
280
+ shouldDirty: true,
281
+ shouldValidate: true,
282
+ });
283
+ }
284
+ }, positioning: { sameWidth: true, placement: 'bottom' }, lazyMount: true, unmountOnExit: true, children: [_jsxs(Select.Trigger, { children: [_jsx(Select.ValueText, { placeholder: "Select nationality" }), _jsx(Select.Indicator, { asChild: true, children: _jsx(ChevronDownIcon, {}) })] }), _jsx(Select.Positioner, { children: _jsx(Select.Content, { children: NATIONALITY_OPTIONS.map((option) => (_jsx(Select.Item, { item: option, children: _jsx(Select.ItemText, { children: option.label }) }, option.value))) }) })] }), _jsx(Field.ErrorText, { children: fieldState.error?.message })] })) }), form.watch('nationality') === 'Others' && (_jsxs(Field.Root, { className: "mt-xl", invalid: !!form.formState.errors.nationalityOther, children: [_jsx(Field.Label, { children: "Please specify your nationality" }), _jsx(Field.Input, { placeholder: "Please specify your nationality", ...form.register('nationalityOther') }), _jsx(Field.ErrorText, { children: form.formState.errors.nationalityOther?.message })] })), _jsx(Button, { type: "submit", className: "mt-4xl", disabled: updateMemberVerificationMutation.isPending ||
256
285
  createMemberVerificationMutation.isPending, children: "Continue" }), kyc.isSkippable && (_jsx(Button, { variant: "outline", colorScheme: "gray", className: twMerge('mt-lg', accountStatus === 'VERIFICATION_LOCKED' && 'hidden'), type: "button", onClick: () => {
257
286
  globalStore.kyc.setOpen(false);
258
287
  }, disabled: updateMemberVerificationMutation.isPending ||
@@ -22,3 +22,7 @@ export declare function getAllUniqueCountries(enabledCountries: CountryCode[]):
22
22
  * Returns all supported country codes.
23
23
  */
24
24
  export declare function getSupportedCountryCodes(): CountryCode[];
25
+ export declare const NATIONALITY_OPTIONS: {
26
+ label: string;
27
+ value: string;
28
+ }[];
@@ -294,3 +294,195 @@ export function getSupportedCountryCodes() {
294
294
  'VN',
295
295
  ];
296
296
  }
297
+ export const NATIONALITY_OPTIONS = [
298
+ { label: 'Afghan', value: 'Afghan' },
299
+ { label: 'Albanian', value: 'Albanian' },
300
+ { label: 'Algerian', value: 'Algerian' },
301
+ { label: 'Andorran', value: 'Andorran' },
302
+ { label: 'Angolan', value: 'Angolan' },
303
+ { label: 'Antiguan and Barbudan', value: 'Antiguan and Barbudan' },
304
+ { label: 'Argentine', value: 'Argentine' },
305
+ { label: 'Armenian', value: 'Armenian' },
306
+ { label: 'Australian', value: 'Australian' },
307
+ { label: 'Austrian', value: 'Austrian' },
308
+ { label: 'Azerbaijani', value: 'Azerbaijani' },
309
+ { label: 'Bahamian', value: 'Bahamian' },
310
+ { label: 'Bahraini', value: 'Bahraini' },
311
+ { label: 'Bangladeshi', value: 'Bangladeshi' },
312
+ { label: 'Barbadian', value: 'Barbadian' },
313
+ { label: 'Belarusian', value: 'Belarusian' },
314
+ { label: 'Belgian', value: 'Belgian' },
315
+ { label: 'Belizean', value: 'Belizean' },
316
+ { label: 'Beninese', value: 'Beninese' },
317
+ { label: 'Bhutanese', value: 'Bhutanese' },
318
+ { label: 'Bolivian', value: 'Bolivian' },
319
+ { label: 'Bosnian and Herzegovinian', value: 'Bosnian and Herzegovinian' },
320
+ { label: 'Botswanan', value: 'Botswanan' },
321
+ { label: 'Brazilian', value: 'Brazilian' },
322
+ { label: 'Bruneian', value: 'Bruneian' },
323
+ { label: 'Bulgarian', value: 'Bulgarian' },
324
+ { label: 'Burkinabe', value: 'Burkinabe' },
325
+ { label: 'Burundian', value: 'Burundian' },
326
+ { label: 'Cabo Verdean', value: 'Cabo Verdean' },
327
+ { label: 'Cambodian', value: 'Cambodian' },
328
+ { label: 'Cameroonian', value: 'Cameroonian' },
329
+ { label: 'Canadian', value: 'Canadian' },
330
+ { label: 'Central African', value: 'Central African' },
331
+ { label: 'Chadian', value: 'Chadian' },
332
+ { label: 'Chilean', value: 'Chilean' },
333
+ { label: 'Chinese', value: 'Chinese' },
334
+ { label: 'Colombian', value: 'Colombian' },
335
+ { label: 'Comorian', value: 'Comorian' },
336
+ { label: 'Congolese', value: 'Congolese' },
337
+ { label: 'Costa Rican', value: 'Costa Rican' },
338
+ { label: 'Croatian', value: 'Croatian' },
339
+ { label: 'Cuban', value: 'Cuban' },
340
+ { label: 'Cypriot', value: 'Cypriot' },
341
+ { label: 'Czech', value: 'Czech' },
342
+ { label: 'Danish', value: 'Danish' },
343
+ { label: 'Djiboutian', value: 'Djiboutian' },
344
+ { label: 'Dominican', value: 'Dominican' },
345
+ { label: 'Dutch', value: 'Dutch' },
346
+ { label: 'East Timorese', value: 'East Timorese' },
347
+ { label: 'Ecuadorian', value: 'Ecuadorian' },
348
+ { label: 'Egyptian', value: 'Egyptian' },
349
+ { label: 'Emirati', value: 'Emirati' },
350
+ { label: 'Equatorial Guinean', value: 'Equatorial Guinean' },
351
+ { label: 'Eritrean', value: 'Eritrean' },
352
+ { label: 'Estonian', value: 'Estonian' },
353
+ { label: 'Eswatini', value: 'Eswatini' },
354
+ { label: 'Ethiopian', value: 'Ethiopian' },
355
+ { label: 'Fijian', value: 'Fijian' },
356
+ { label: 'Finnish', value: 'Finnish' },
357
+ { label: 'Filipino', value: 'Filipino' },
358
+ { label: 'French', value: 'French' },
359
+ { label: 'Gabonese', value: 'Gabonese' },
360
+ { label: 'Gambian', value: 'Gambian' },
361
+ { label: 'Georgian', value: 'Georgian' },
362
+ { label: 'German', value: 'German' },
363
+ { label: 'Ghanaian', value: 'Ghanaian' },
364
+ { label: 'Greek', value: 'Greek' },
365
+ { label: 'Grenadian', value: 'Grenadian' },
366
+ { label: 'Guatemalan', value: 'Guatemalan' },
367
+ { label: 'Guinean', value: 'Guinean' },
368
+ { label: 'Guinea-Bissauan', value: 'Guinea-Bissauan' },
369
+ { label: 'Guyanese', value: 'Guyanese' },
370
+ { label: 'Haitian', value: 'Haitian' },
371
+ { label: 'Honduran', value: 'Honduran' },
372
+ { label: 'Hungarian', value: 'Hungarian' },
373
+ { label: 'Icelandic', value: 'Icelandic' },
374
+ { label: 'Indian', value: 'Indian' },
375
+ { label: 'Indonesian', value: 'Indonesian' },
376
+ { label: 'Iranian', value: 'Iranian' },
377
+ { label: 'Iraqi', value: 'Iraqi' },
378
+ { label: 'Irish', value: 'Irish' },
379
+ { label: 'Israeli', value: 'Israeli' },
380
+ { label: 'Italian', value: 'Italian' },
381
+ { label: 'Ivorian', value: 'Ivorian' },
382
+ { label: 'Jamaican', value: 'Jamaican' },
383
+ { label: 'Japanese', value: 'Japanese' },
384
+ { label: 'Jordanian', value: 'Jordanian' },
385
+ { label: 'Kazakhstani', value: 'Kazakhstani' },
386
+ { label: 'Kenyan', value: 'Kenyan' },
387
+ { label: 'Kiribati', value: 'Kiribati' },
388
+ { label: 'Kuwaiti', value: 'Kuwaiti' },
389
+ { label: 'Kyrgyz', value: 'Kyrgyz' },
390
+ { label: 'Laotian', value: 'Laotian' },
391
+ { label: 'Latvian', value: 'Latvian' },
392
+ { label: 'Lebanese', value: 'Lebanese' },
393
+ { label: 'Lesotho', value: 'Lesotho' },
394
+ { label: 'Liberian', value: 'Liberian' },
395
+ { label: 'Libyan', value: 'Libyan' },
396
+ { label: 'Liechtenstein', value: 'Liechtenstein' },
397
+ { label: 'Lithuanian', value: 'Lithuanian' },
398
+ { label: 'Luxembourgish', value: 'Luxembourgish' },
399
+ { label: 'Malagasy', value: 'Malagasy' },
400
+ { label: 'Malawian', value: 'Malawian' },
401
+ { label: 'Malaysian', value: 'Malaysian' },
402
+ { label: 'Maldivian', value: 'Maldivian' },
403
+ { label: 'Malian', value: 'Malian' },
404
+ { label: 'Maltese', value: 'Maltese' },
405
+ { label: 'Marshallese', value: 'Marshallese' },
406
+ { label: 'Mauritanian', value: 'Mauritanian' },
407
+ { label: 'Mauritian', value: 'Mauritian' },
408
+ { label: 'Mexican', value: 'Mexican' },
409
+ { label: 'Micronesian', value: 'Micronesian' },
410
+ { label: 'Moldovan', value: 'Moldovan' },
411
+ { label: 'Monacan', value: 'Monacan' },
412
+ { label: 'Mongolian', value: 'Mongolian' },
413
+ { label: 'Montenegrin', value: 'Montenegrin' },
414
+ { label: 'Moroccan', value: 'Moroccan' },
415
+ { label: 'Mozambican', value: 'Mozambican' },
416
+ { label: 'Namibian', value: 'Namibian' },
417
+ { label: 'Nauruan', value: 'Nauruan' },
418
+ { label: 'Nepali', value: 'Nepali' },
419
+ { label: 'New Zealander', value: 'New Zealander' },
420
+ { label: 'Nicaraguan', value: 'Nicaraguan' },
421
+ { label: 'Nigerien', value: 'Nigerien' },
422
+ { label: 'Nigerian', value: 'Nigerian' },
423
+ { label: 'North Korean', value: 'North Korean' },
424
+ { label: 'North Macedonian', value: 'North Macedonian' },
425
+ { label: 'Norwegian', value: 'Norwegian' },
426
+ { label: 'Omani', value: 'Omani' },
427
+ { label: 'Pakistani', value: 'Pakistani' },
428
+ { label: 'Palauan', value: 'Palauan' },
429
+ { label: 'Panamanian', value: 'Panamanian' },
430
+ { label: 'Papua New Guinean', value: 'Papua New Guinean' },
431
+ { label: 'Paraguayan', value: 'Paraguayan' },
432
+ { label: 'Peruvian', value: 'Peruvian' },
433
+ { label: 'Polish', value: 'Polish' },
434
+ { label: 'Portuguese', value: 'Portuguese' },
435
+ { label: 'Qatari', value: 'Qatari' },
436
+ { label: 'Romanian', value: 'Romanian' },
437
+ { label: 'Russian', value: 'Russian' },
438
+ { label: 'Rwandan', value: 'Rwandan' },
439
+ { label: 'Saint Kitts and Nevisian', value: 'Saint Kitts and Nevisian' },
440
+ { label: 'Saint Lucian', value: 'Saint Lucian' },
441
+ { label: 'Saint Vincentian', value: 'Saint Vincentian' },
442
+ { label: 'Samoan', value: 'Samoan' },
443
+ { label: 'San Marinese', value: 'San Marinese' },
444
+ { label: 'Sao Tomean', value: 'Sao Tomean' },
445
+ { label: 'Saudi', value: 'Saudi' },
446
+ { label: 'Senegalese', value: 'Senegalese' },
447
+ { label: 'Serbian', value: 'Serbian' },
448
+ { label: 'Seychellois', value: 'Seychellois' },
449
+ { label: 'Sierra Leonean', value: 'Sierra Leonean' },
450
+ { label: 'Singaporean', value: 'Singaporean' },
451
+ { label: 'Slovak', value: 'Slovak' },
452
+ { label: 'Slovenian', value: 'Slovenian' },
453
+ { label: 'Solomon Islander', value: 'Solomon Islander' },
454
+ { label: 'Somali', value: 'Somali' },
455
+ { label: 'South African', value: 'South African' },
456
+ { label: 'South Korean', value: 'South Korean' },
457
+ { label: 'South Sudanese', value: 'South Sudanese' },
458
+ { label: 'Spanish', value: 'Spanish' },
459
+ { label: 'Sri Lankan', value: 'Sri Lankan' },
460
+ { label: 'Sudanese', value: 'Sudanese' },
461
+ { label: 'Surinamese', value: 'Surinamese' },
462
+ { label: 'Swedish', value: 'Swedish' },
463
+ { label: 'Swiss', value: 'Swiss' },
464
+ { label: 'Syrian', value: 'Syrian' },
465
+ { label: 'Taiwanese', value: 'Taiwanese' },
466
+ { label: 'Tajik', value: 'Tajik' },
467
+ { label: 'Tanzanian', value: 'Tanzanian' },
468
+ { label: 'Thai', value: 'Thai' },
469
+ { label: 'Togolese', value: 'Togolese' },
470
+ { label: 'Tongan', value: 'Tongan' },
471
+ { label: 'Trinidadian and Tobagonian', value: 'Trinidadian and Tobagonian' },
472
+ { label: 'Tunisian', value: 'Tunisian' },
473
+ { label: 'Turkish', value: 'Turkish' },
474
+ { label: 'Turkmen', value: 'Turkmen' },
475
+ { label: 'Tuvaluan', value: 'Tuvaluan' },
476
+ { label: 'Ugandan', value: 'Ugandan' },
477
+ { label: 'Ukrainian', value: 'Ukrainian' },
478
+ { label: 'Uruguayan', value: 'Uruguayan' },
479
+ { label: 'Uzbek', value: 'Uzbek' },
480
+ { label: 'Vanuatuan', value: 'Vanuatuan' },
481
+ { label: 'Vatican', value: 'Vatican' },
482
+ { label: 'Venezuelan', value: 'Venezuelan' },
483
+ { label: 'Vietnamese', value: 'Vietnamese' },
484
+ { label: 'Yemeni', value: 'Yemeni' },
485
+ { label: 'Zambian', value: 'Zambian' },
486
+ { label: 'Zimbabwean', value: 'Zimbabwean' },
487
+ { label: 'Others', value: 'Others' },
488
+ ];
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@opexa/portal-components",
3
- "version": "0.0.1074",
3
+ "version": "0.0.1076",
4
4
  "exports": {
5
5
  "./ui/*": {
6
6
  "types": "./dist/ui/*/index.d.ts",