@opexa/portal-components 0.0.492 → 0.0.493
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/dist/components/Banner/Banner.client.d.ts +12 -0
- package/dist/components/Banner/Banner.client.js +49 -0
- package/dist/components/DigitainLauncher/Loading.d.ts +1 -0
- package/dist/components/DigitainLauncher/Loading.js +5 -0
- package/dist/components/Jackpots/JackpotsCarousel/JackpotsCarouselItem.module.css +184 -0
- package/dist/components/Jackpots/JackpotsList/JackpotsListItem.module.css +184 -0
- package/dist/components/KYC/BasicInformation.d.ts +1 -0
- package/dist/components/KYC/BasicInformation.js +101 -0
- package/dist/components/KYC/IdentityVerification.d.ts +1 -0
- package/dist/components/KYC/IdentityVerification.js +120 -0
- package/dist/components/KYC/Indicator.d.ts +1 -0
- package/dist/components/KYC/Indicator.js +8 -0
- package/dist/components/KYC/KYC.lazy.d.ts +6 -0
- package/dist/components/KYC/KYC.lazy.js +45 -0
- package/dist/components/KYC/KYCContext.d.ts +6 -0
- package/dist/components/KYC/KYCContext.js +2 -0
- package/dist/components/KYC/KYCReminder.lazy.js +2 -4
- package/dist/components/KYC/KYCSumsub.d.ts +1 -1
- package/dist/components/KYC/KYCSumsub.js +7 -2
- package/dist/components/KYC/PersonalInformation.d.ts +1 -0
- package/dist/components/KYC/PersonalInformation.js +122 -0
- package/dist/components/KYC/useKYC.d.ts +25 -0
- package/dist/components/KYC/useKYC.js +38 -0
- package/dist/components/PortalProvider/LinkGoogleAccountObserver.d.ts +1 -0
- package/dist/components/PortalProvider/LinkGoogleAccountObserver.js +29 -0
- package/dist/components/SessionWatcher/SessionWatcher.d.ts +1 -0
- package/dist/components/SessionWatcher/SessionWatcher.js +20 -0
- package/dist/components/SessionWatcher/index.d.ts +1 -0
- package/dist/components/SessionWatcher/index.js +1 -0
- package/dist/components/SignIn/utils.d.ts +8 -0
- package/dist/components/SignIn/utils.js +26 -0
- package/dist/constants/Branches.d.ts +2 -0
- package/dist/constants/Branches.js +42 -0
- package/dist/images/responsible-gaming-yellow.png +0 -0
- package/dist/third-parties/FacebookPixel/FacebookPixel.d.ts +4 -0
- package/dist/third-parties/FacebookPixel/FacebookPixel.js +4 -0
- package/dist/third-parties/FacebookPixel/api.d.ts +0 -0
- package/dist/third-parties/FacebookPixel/api.js +1 -0
- package/dist/third-parties/FacebookPixel/index.d.ts +1 -0
- package/dist/third-parties/FacebookPixel/index.js +1 -0
- package/dist/third-parties/GoogleRecaptcha/GoogleRecaptcha.d.ts +4 -0
- package/dist/third-parties/GoogleRecaptcha/GoogleRecaptcha.js +4 -0
- package/dist/third-parties/GoogleRecaptcha/api.d.ts +0 -0
- package/dist/third-parties/GoogleRecaptcha/api.js +1 -0
- package/dist/third-parties/GoogleRecaptcha/index.d.ts +1 -0
- package/dist/third-parties/GoogleRecaptcha/index.js +1 -0
- package/dist/third-parties/index.d.ts +2 -0
- package/dist/third-parties/index.js +2 -0
- package/dist/ui/Badge/Badge.d.ts +12 -12
- package/dist/ui/Badge/badge.anatomy.d.ts +1 -1
- package/dist/ui/Badge/badge.recipe.d.ts +3 -3
- package/dist/ui/Carousel/Carousel.d.ts +99 -99
- package/dist/ui/Carousel/carousel.recipe.d.ts +11 -11
- package/dist/ui/Checkbox/Checkbox.d.ts +23 -23
- package/dist/ui/Checkbox/checkbox.recipe.d.ts +3 -3
- package/dist/ui/Clipboard/Clipboard.d.ts +18 -18
- package/dist/ui/Clipboard/clipboard.recipe.d.ts +3 -3
- package/dist/ui/Combobox/Combobox.d.ts +42 -42
- package/dist/ui/Combobox/combobox.recipe.d.ts +3 -3
- package/dist/ui/DatePicker/DatePicker.d.ts +72 -72
- package/dist/ui/DatePicker/datePicker.recipe.d.ts +3 -3
- package/dist/ui/Menu/Menu.d.ts +252 -252
- package/dist/ui/Menu/menu.recipe.d.ts +14 -14
- package/dist/ui/PasswordInput/PasswordInput.d.ts +18 -18
- package/dist/ui/PasswordInput/passwordInput.recipe.d.ts +3 -3
- package/dist/ui/SegmentGroup/SegmentGroup.d.ts +18 -18
- package/dist/ui/SegmentGroup/segmentGroup.recipe.d.ts +3 -3
- package/dist/ui/Select/Select.d.ts +45 -45
- package/dist/ui/Select/select.recipe.d.ts +3 -3
- package/dist/ui/Tabs/Tabs.d.ts +15 -15
- package/dist/ui/Tabs/tabs.recipe.d.ts +3 -3
- package/package.json +1 -1
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import type { ImageProps } from 'next/image';
|
|
2
|
+
import { type KYCReminderProps } from './KYCReminder.lazy';
|
|
3
|
+
export interface KYCProps extends KYCReminderProps {
|
|
4
|
+
logo: ImageProps['src'];
|
|
5
|
+
}
|
|
6
|
+
export declare function KYC(props: KYCProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
|
+
import Image from 'next/image';
|
|
3
|
+
import { useEffect } from 'react';
|
|
4
|
+
import { useShallow } from 'zustand/shallow';
|
|
5
|
+
import { useAccountQuery } from '../../client/hooks/useAccountQuery.js';
|
|
6
|
+
import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
|
|
7
|
+
import { useMemberVerificationQuery } from '../../client/hooks/useMemberVerificationQuery.js';
|
|
8
|
+
import { XIcon } from '../../icons/XIcon.js';
|
|
9
|
+
import { Dialog } from '../../ui/Dialog/index.js';
|
|
10
|
+
import { Portal } from '../../ui/Portal/index.js';
|
|
11
|
+
import { BasicInformation } from './BasicInformation.js';
|
|
12
|
+
import { IdentityVerification } from './IdentityVerification.js';
|
|
13
|
+
import { Indicator } from './Indicator.js';
|
|
14
|
+
import { KYCContext } from './KYCContext.js';
|
|
15
|
+
import { KYCReminder } from './KYCReminder.lazy.js';
|
|
16
|
+
import { PersonalInformation } from './PersonalInformation.js';
|
|
17
|
+
import { useKYC } from './useKYC.js';
|
|
18
|
+
export function KYC(props) {
|
|
19
|
+
const globalStore = useGlobalStore(useShallow((ctx) => ({ kyc: ctx.kyc })));
|
|
20
|
+
const kyc = useKYC();
|
|
21
|
+
const { data: account } = useAccountQuery();
|
|
22
|
+
const { data: verification } = useMemberVerificationQuery();
|
|
23
|
+
const isBasicInfoCompleted = account?.realName !== null && account?.birthDay !== null;
|
|
24
|
+
const isUploadCompleted = Boolean(verification?.idFrontImage) && Boolean(verification?.selfieImage);
|
|
25
|
+
const isVerified = Boolean(verification?.status === 'VERIFIED') ||
|
|
26
|
+
Boolean(verification?.status === 'PENDING') ||
|
|
27
|
+
Boolean(verification?.status === 'APPROVED');
|
|
28
|
+
const isRejected = Boolean(verification?.status === 'REJECTED');
|
|
29
|
+
const hasMissingData = !isBasicInfoCompleted || !isUploadCompleted || !isVerified;
|
|
30
|
+
const steps = !isBasicInfoCompleted
|
|
31
|
+
? 1
|
|
32
|
+
: !isUploadCompleted
|
|
33
|
+
? 2
|
|
34
|
+
: isRejected
|
|
35
|
+
? 2
|
|
36
|
+
: 3;
|
|
37
|
+
useEffect(() => {
|
|
38
|
+
if (steps) {
|
|
39
|
+
kyc.setStep(steps);
|
|
40
|
+
}
|
|
41
|
+
}, [steps, kyc]);
|
|
42
|
+
return (_jsxs(_Fragment, { children: [_jsx(KYCContext, { value: kyc, children: _jsx(Dialog.Root, { open: globalStore.kyc.open && hasMissingData, onOpenChange: (details) => {
|
|
43
|
+
globalStore.kyc.setOpen(details.open);
|
|
44
|
+
}, lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, onExitComplete: kyc.reset, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { children: _jsx(Dialog.Content, { className: "mx-auto min-h-full w-full overflow-y-auto bg-bg-primary-alt lg:min-h-auto lg:w-fit", children: _jsxs("div", { className: "flex h-dvh w-full flex-col overflow-y-auto p-3xl sm:h-fit sm:overflow-auto lg:w-[400px]", children: [_jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsx(Image, { src: props.logo, alt: "", width: 200, height: 100, className: "mx-auto mb-5 block h-7.5 w-auto", draggable: false }), _jsx(Indicator, {}), kyc.step === 1 && _jsx(BasicInformation, {}), kyc.step === 2 && _jsx(IdentityVerification, {}), kyc.step === 3 && _jsx(PersonalInformation, {})] }) }) })] }) }) }), _jsx(KYCReminder, { ...props })] }));
|
|
45
|
+
}
|
|
@@ -33,7 +33,7 @@ export function KYCReminder(props) {
|
|
|
33
33
|
const now = new Date();
|
|
34
34
|
return differenceInCalendarDays(now, creationDate);
|
|
35
35
|
}, [account?.dateTimeCreated]);
|
|
36
|
-
const hasMissingData = account?.verified
|
|
36
|
+
const hasMissingData = account?.verified || verification?.sumsubVerified
|
|
37
37
|
? false
|
|
38
38
|
: isNil(account?.realName) ||
|
|
39
39
|
isEmpty(account?.realName) ||
|
|
@@ -48,9 +48,7 @@ export function KYCReminder(props) {
|
|
|
48
48
|
!accountLoading &&
|
|
49
49
|
!verificationLoading &&
|
|
50
50
|
globalStore.kycReminder.open &&
|
|
51
|
-
(enabled
|
|
52
|
-
? true
|
|
53
|
-
: !isVerificationLocked && !globalStore.kyc.open) &&
|
|
51
|
+
(enabled ? true : !isVerificationLocked && !globalStore.kyc.open) &&
|
|
54
52
|
session?.status === 'authenticated' &&
|
|
55
53
|
hasMissingData, onOpenChange: (details) => {
|
|
56
54
|
globalStore.kycReminder.setOpen(details.open);
|
|
@@ -4,4 +4,4 @@ export interface KYCSumsubProps extends KYCReminderProps {
|
|
|
4
4
|
provider: 'sumsub';
|
|
5
5
|
logo: ImageProps['src'];
|
|
6
6
|
}
|
|
7
|
-
export declare function KYCSumsub(props: KYCSumsubProps): import("react/jsx-runtime").JSX.Element
|
|
7
|
+
export declare function KYCSumsub(props: KYCSumsubProps): Promise<import("react/jsx-runtime").JSX.Element>;
|
|
@@ -6,15 +6,17 @@ import { useShallow } from 'zustand/shallow';
|
|
|
6
6
|
import { useGenerateSumsubVerificationTokenMutation } from '../../client/hooks/useGenerateSumsubVerificationTokenMutation.js';
|
|
7
7
|
import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
|
|
8
8
|
import { useMemberVerificationQuery } from '../../client/hooks/useMemberVerificationQuery.js';
|
|
9
|
+
import { useSessionQuery } from '../../client/hooks/useSessionQuery.js';
|
|
9
10
|
import { Spinner02Icon } from '../../icons/Spinner02Icon.js';
|
|
10
11
|
import { Dialog } from '../../ui/Dialog/index.js';
|
|
11
12
|
import { Portal } from '../../ui/Portal/index.js';
|
|
12
13
|
import { getQueryClient } from '../../utils/getQueryClient.js';
|
|
13
14
|
import { getAccountQueryKey, getMemberVerificationQueryKey, getProfileCompletionQueryKey, } from '../../utils/queryKeys.js';
|
|
14
15
|
import { KYCReminder } from './KYCReminder.js';
|
|
15
|
-
export function KYCSumsub(props) {
|
|
16
|
+
export async function KYCSumsub(props) {
|
|
16
17
|
const [open, setOpen] = useGlobalStore(useShallow((ctx) => [ctx.kyc.open, ctx.kyc.setOpen]));
|
|
17
18
|
const memberVerification = useMemberVerificationQuery();
|
|
19
|
+
const { data: session, isLoading: sessionLoading } = useSessionQuery();
|
|
18
20
|
const isVerified = memberVerification.data?.status === 'VERIFIED' ||
|
|
19
21
|
memberVerification.data?.sumsubVerified === true ||
|
|
20
22
|
memberVerification.data?.status === 'APPROVED' ||
|
|
@@ -36,7 +38,10 @@ export function KYCSumsub(props) {
|
|
|
36
38
|
isIdle,
|
|
37
39
|
mutate,
|
|
38
40
|
]);
|
|
39
|
-
return (_jsxs(_Fragment, { children: [_jsx(Dialog.Root, { open: open &&
|
|
41
|
+
return (_jsxs(_Fragment, { children: [_jsx(Dialog.Root, { open: open &&
|
|
42
|
+
!isVerified &&
|
|
43
|
+
!sessionLoading &&
|
|
44
|
+
session?.status === 'authenticated', onOpenChange: (details) => {
|
|
40
45
|
setOpen(details.open);
|
|
41
46
|
}, lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, onExitComplete: () => {
|
|
42
47
|
reset();
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function PersonalInformation(): import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1,122 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { zodResolver } from '@hookform/resolvers/zod';
|
|
3
|
+
import { useForm } from 'react-hook-form';
|
|
4
|
+
import { z } from 'zod';
|
|
5
|
+
import { useShallow } from 'zustand/shallow';
|
|
6
|
+
import { useApproveMemberVerification } from '../../client/hooks/useApproveMemberVerification.js';
|
|
7
|
+
import { useCreateMemberVerificationMutation } from '../../client/hooks/useCreateMemberVerificationMutation.js';
|
|
8
|
+
import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
|
|
9
|
+
import { useMemberVerificationQuery } from '../../client/hooks/useMemberVerificationQuery.js';
|
|
10
|
+
import { useUpdateMemberVerificationMutation } from '../../client/hooks/useUpdateMemberVerificationMutation.js';
|
|
11
|
+
import { toaster } from '../../client/utils/toaster.js';
|
|
12
|
+
import { CheckIcon } from '../../icons/CheckIcon.js';
|
|
13
|
+
import { Button } from '../../ui/Button/index.js';
|
|
14
|
+
import { Checkbox } from '../../ui/Checkbox/index.js';
|
|
15
|
+
import { Dialog } from '../../ui/Dialog/index.js';
|
|
16
|
+
import { Field } from '../../ui/Field/index.js';
|
|
17
|
+
import { getQueryClient } from '../../utils/getQueryClient.js';
|
|
18
|
+
import { getMemberVerificationQueryKey } from '../../utils/queryKeys.js';
|
|
19
|
+
import { useKYCContext } from './KYCContext.js';
|
|
20
|
+
const definition = z.object({
|
|
21
|
+
address: z.string().trim().min(1, 'Current address is required'),
|
|
22
|
+
permanentAddress: z.string().trim().min(1, 'Permanent address is required'),
|
|
23
|
+
sourceOfIncome: z.string().trim().min(1, 'Source of Income is required'),
|
|
24
|
+
natureOfWork: z.string().trim().min(1, 'Nature of Work is required'),
|
|
25
|
+
placeOfBirth: z.string().trim().min(1, 'Place of Birth is required'),
|
|
26
|
+
nationality: z.string().trim().min(1, 'Nationality is required'),
|
|
27
|
+
});
|
|
28
|
+
export function PersonalInformation() {
|
|
29
|
+
const kyc = useKYCContext();
|
|
30
|
+
const globalStore = useGlobalStore(useShallow((ctx) => ({
|
|
31
|
+
kyc: ctx.kyc,
|
|
32
|
+
})));
|
|
33
|
+
const memberVerificationQuery = useMemberVerificationQuery();
|
|
34
|
+
const memberVerificationId = memberVerificationQuery.data?.id;
|
|
35
|
+
const approveMemberVerificationMutation = useApproveMemberVerification();
|
|
36
|
+
const updateMemberVerificationMutation = useUpdateMemberVerificationMutation({
|
|
37
|
+
onError(error) {
|
|
38
|
+
toaster.error({
|
|
39
|
+
description: error.message,
|
|
40
|
+
});
|
|
41
|
+
},
|
|
42
|
+
onSuccess() {
|
|
43
|
+
const queryClient = getQueryClient();
|
|
44
|
+
queryClient.setQueryData(getMemberVerificationQueryKey(), (prev) => {
|
|
45
|
+
if (!prev)
|
|
46
|
+
return prev;
|
|
47
|
+
return {
|
|
48
|
+
...prev,
|
|
49
|
+
status: 'PENDING',
|
|
50
|
+
};
|
|
51
|
+
});
|
|
52
|
+
kyc.setDone(true);
|
|
53
|
+
globalStore.kyc.setOpen(false);
|
|
54
|
+
toaster.success({
|
|
55
|
+
title: 'Success',
|
|
56
|
+
description: 'Personal information has been set successfully.',
|
|
57
|
+
});
|
|
58
|
+
},
|
|
59
|
+
});
|
|
60
|
+
const createMemberVerificationMutation = useCreateMemberVerificationMutation({
|
|
61
|
+
onError(error) {
|
|
62
|
+
toaster.error({
|
|
63
|
+
description: error.message,
|
|
64
|
+
});
|
|
65
|
+
},
|
|
66
|
+
onSuccess() {
|
|
67
|
+
kyc.setDone(true);
|
|
68
|
+
globalStore.kyc.setOpen(false);
|
|
69
|
+
toaster.success({
|
|
70
|
+
title: 'Success',
|
|
71
|
+
description: 'Personal information has been set successfully.',
|
|
72
|
+
});
|
|
73
|
+
},
|
|
74
|
+
});
|
|
75
|
+
const form = useForm({
|
|
76
|
+
resolver: zodResolver(definition),
|
|
77
|
+
defaultValues: {
|
|
78
|
+
address: '',
|
|
79
|
+
nationality: '',
|
|
80
|
+
natureOfWork: '',
|
|
81
|
+
placeOfBirth: '',
|
|
82
|
+
permanentAddress: '',
|
|
83
|
+
},
|
|
84
|
+
mode: 'all',
|
|
85
|
+
});
|
|
86
|
+
async function onSubmit(values) {
|
|
87
|
+
if (!memberVerificationId) {
|
|
88
|
+
createMemberVerificationMutation.mutate({
|
|
89
|
+
...values,
|
|
90
|
+
});
|
|
91
|
+
}
|
|
92
|
+
else {
|
|
93
|
+
await updateMemberVerificationMutation.mutateAsync({
|
|
94
|
+
id: memberVerificationId,
|
|
95
|
+
data: {
|
|
96
|
+
...values,
|
|
97
|
+
},
|
|
98
|
+
});
|
|
99
|
+
//approve status of member to be pending
|
|
100
|
+
await approveMemberVerificationMutation.mutateAsync({
|
|
101
|
+
id: memberVerificationId,
|
|
102
|
+
});
|
|
103
|
+
}
|
|
104
|
+
}
|
|
105
|
+
const address = form.watch('address');
|
|
106
|
+
const permanentAddress = form.watch('permanentAddress');
|
|
107
|
+
return (_jsxs("div", { children: [_jsx(Dialog.Title, { className: "text-center font-semibold text-lg", children: "Personal Information" }), _jsx(Dialog.Description, { className: "mt-xs text-center text-sm text-text-secondary-700", children: "Provide your basic details and work info." }), _jsxs("form", { className: "mt-7", onSubmit: form.handleSubmit(onSubmit), children: [_jsxs(Field.Root, { invalid: !!form.formState.errors.permanentAddress, children: [_jsx(Field.Label, { children: "Permanent address" }), _jsx(Field.Input, { placeholder: "Enter your permanent address", ...form.register('permanentAddress') }), _jsx(Field.ErrorText, { children: form.formState.errors.permanentAddress?.message })] }), _jsxs(Field.Root, { className: "mt-2xl", invalid: !!form.formState.errors.address, children: [_jsx(Field.Label, { children: "Current address" }), _jsx(Field.Input, { placeholder: "Enter your current address", ...form.register('address') }), _jsx(Field.ErrorText, { children: form.formState.errors.address?.message })] }), _jsxs(Checkbox.Root, { className: "mt-md", checked: address !== '' &&
|
|
108
|
+
permanentAddress !== '' &&
|
|
109
|
+
address === permanentAddress, onCheckedChange: (details) => {
|
|
110
|
+
if (details.checked === true) {
|
|
111
|
+
form.setValue('address', form.getValues('permanentAddress'), {
|
|
112
|
+
shouldDirty: true,
|
|
113
|
+
shouldTouch: true,
|
|
114
|
+
shouldValidate: true,
|
|
115
|
+
});
|
|
116
|
+
}
|
|
117
|
+
}, disabled: !permanentAddress, children: [_jsx(Checkbox.Control, { children: _jsx(Checkbox.Indicator, { asChild: true, children: _jsx(CheckIcon, {}) }) }), _jsx(Checkbox.Label, { children: "Use permanent address as current address" }), _jsx(Checkbox.HiddenInput, {})] }), _jsxs(Field.Root, { className: "mt-2xl", invalid: !!form.formState.errors.sourceOfIncome, children: [_jsx(Field.Label, { children: "Source of income" }), _jsx(Field.Input, { placeholder: "Enter your source of income", ...form.register('sourceOfIncome') }), _jsx(Field.ErrorText, { children: form.formState.errors.sourceOfIncome?.message })] }), _jsxs(Field.Root, { className: "mt-2xl", invalid: !!form.formState.errors.natureOfWork, children: [_jsx(Field.Label, { children: "Work Description" }), _jsx(Field.Input, { placeholder: "Enter your work description", ...form.register('natureOfWork') }), _jsx(Field.ErrorText, { children: form.formState.errors.natureOfWork?.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 ||
|
|
118
|
+
createMemberVerificationMutation.isPending, children: "Continue" }), _jsx(Button, { variant: "outline", colorScheme: "gray", className: "mt-lg", onClick: () => {
|
|
119
|
+
globalStore.kyc.setOpen(false);
|
|
120
|
+
}, disabled: updateMemberVerificationMutation.isPending ||
|
|
121
|
+
createMemberVerificationMutation.isPending, children: "Skip for now" })] })] }));
|
|
122
|
+
}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
type EventDetail = {
|
|
2
|
+
type: 'SELFIE_CAPTURED';
|
|
3
|
+
data: string;
|
|
4
|
+
} | {
|
|
5
|
+
type: 'ID_DOCUMENT_CAPTURED';
|
|
6
|
+
data: string;
|
|
7
|
+
};
|
|
8
|
+
type UnsubscribeFn = () => void;
|
|
9
|
+
type Subscriber = (detail: EventDetail) => UnsubscribeFn;
|
|
10
|
+
export type CaptureSubject = 'SELFIE' | 'ID_DOCUMENT';
|
|
11
|
+
export interface UseKYCReturn {
|
|
12
|
+
step: number;
|
|
13
|
+
setStep: (step: number) => void;
|
|
14
|
+
done: boolean;
|
|
15
|
+
setDone: (done: boolean) => void;
|
|
16
|
+
subscribe: (subscriber: Subscriber) => UnsubscribeFn;
|
|
17
|
+
triggerEvent: (detail: EventDetail) => void;
|
|
18
|
+
idFrontImageId: string | null;
|
|
19
|
+
setFrontImageId: (id: string | null) => void;
|
|
20
|
+
selfieImageId: string | null;
|
|
21
|
+
setSelfieImageId: (id: string | null) => void;
|
|
22
|
+
reset: () => void;
|
|
23
|
+
}
|
|
24
|
+
export declare function useKYC(): UseKYCReturn;
|
|
25
|
+
export {};
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import { useRef, useState } from 'react';
|
|
2
|
+
export function useKYC() {
|
|
3
|
+
const [step, setStep] = useState(2);
|
|
4
|
+
const [done, setDone] = useState(false);
|
|
5
|
+
const [idFrontImageId, setFrontImageId] = useState(null);
|
|
6
|
+
const [selfieImageId, setSelfieImageId] = useState(null);
|
|
7
|
+
const subscribers = useRef([]);
|
|
8
|
+
const subscribe = (subscriber) => {
|
|
9
|
+
subscribers.current.push(subscriber);
|
|
10
|
+
return () => {
|
|
11
|
+
subscribers.current = subscribers.current.filter((item) => item !== subscriber);
|
|
12
|
+
};
|
|
13
|
+
};
|
|
14
|
+
const triggerEvent = (detail) => {
|
|
15
|
+
subscribers.current.forEach((subscriber) => {
|
|
16
|
+
subscriber(detail);
|
|
17
|
+
});
|
|
18
|
+
};
|
|
19
|
+
const reset = () => {
|
|
20
|
+
setStep(1);
|
|
21
|
+
setDone(false);
|
|
22
|
+
setFrontImageId(null);
|
|
23
|
+
setSelfieImageId(null);
|
|
24
|
+
};
|
|
25
|
+
return {
|
|
26
|
+
step,
|
|
27
|
+
setStep,
|
|
28
|
+
done,
|
|
29
|
+
setDone,
|
|
30
|
+
idFrontImageId,
|
|
31
|
+
setFrontImageId,
|
|
32
|
+
selfieImageId,
|
|
33
|
+
setSelfieImageId,
|
|
34
|
+
subscribe,
|
|
35
|
+
triggerEvent,
|
|
36
|
+
reset,
|
|
37
|
+
};
|
|
38
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function LinkGoogleAccountObserver(): null;
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { useSearchParams } from 'next/navigation';
|
|
3
|
+
import { useTimeout } from 'usehooks-ts';
|
|
4
|
+
import { toaster } from '../../client/utils/toaster.js';
|
|
5
|
+
import { getQueryClient } from '../../utils/getQueryClient.js';
|
|
6
|
+
import { getSessionQueryKey } from '../../utils/queryKeys.js';
|
|
7
|
+
export function LinkGoogleAccountObserver() {
|
|
8
|
+
const searchParams = useSearchParams();
|
|
9
|
+
const code = searchParams.get('message') ?? searchParams.get('status');
|
|
10
|
+
const queryClient = getQueryClient();
|
|
11
|
+
useTimeout(() => {
|
|
12
|
+
if (code === 'duplicate') {
|
|
13
|
+
return toaster.error({
|
|
14
|
+
title: 'Duplicate Account',
|
|
15
|
+
description: 'An account with this email already exists. Please try signing in instead.',
|
|
16
|
+
});
|
|
17
|
+
}
|
|
18
|
+
if (code === 'linked') {
|
|
19
|
+
queryClient.invalidateQueries({
|
|
20
|
+
queryKey: getSessionQueryKey(),
|
|
21
|
+
});
|
|
22
|
+
return toaster.success({
|
|
23
|
+
title: 'Google Account Linked Successfully',
|
|
24
|
+
description: 'Your Google account has been successfully connected.',
|
|
25
|
+
});
|
|
26
|
+
}
|
|
27
|
+
}, code ? 100 : null);
|
|
28
|
+
return null;
|
|
29
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function SessionWatcher(): null;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { useRouter } from 'next/navigation';
|
|
3
|
+
import { useCallback, useEffect } from 'react';
|
|
4
|
+
import { useSessionHealthQuery } from '../../client/hooks/useSessionHealthQuery.js';
|
|
5
|
+
import { useSignOutMutation } from '../../client/hooks/useSignOutMutation.js';
|
|
6
|
+
export function SessionWatcher() {
|
|
7
|
+
const router = useRouter();
|
|
8
|
+
const query = useSessionHealthQuery({ refetchInterval: 1000 * 5 });
|
|
9
|
+
const healthy = query.data ?? true;
|
|
10
|
+
const mutation = useSignOutMutation();
|
|
11
|
+
const signOut = useCallback(async () => {
|
|
12
|
+
await mutation.mutateAsync();
|
|
13
|
+
router.refresh();
|
|
14
|
+
}, [mutation, router]);
|
|
15
|
+
useEffect(() => {
|
|
16
|
+
if (!healthy)
|
|
17
|
+
signOut();
|
|
18
|
+
}, [healthy, signOut]);
|
|
19
|
+
return null;
|
|
20
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './SessionWatcher';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './SessionWatcher.js';
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
type Options = {
|
|
2
|
+
accountName?: string;
|
|
3
|
+
siteName?: string;
|
|
4
|
+
signInOptions?: 'MOBILE_NUMBER' | 'NAME_AND_PASSWORD';
|
|
5
|
+
};
|
|
6
|
+
export type ErrorCode = 'MEMBER_ACCOUNT_BLACKLISTED' | 'MEMBER_ACCOUNT_SUSPENDED' | 'INVALID_RECAPTCHA_RESPONSE' | 'MEMBER_NOT_FOUND' | 'RATE_LIMIT_REACH' | 'NOT_READY_TO_SEND_VERIFICATION_ERROR' | 'Forbidden';
|
|
7
|
+
export declare function getFriendlyErrorMessage(code: ErrorCode, options?: Options): string;
|
|
8
|
+
export {};
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
export function getFriendlyErrorMessage(code, options) {
|
|
2
|
+
const accountName = options?.accountName ?? '';
|
|
3
|
+
const siteName = options?.siteName ?? '';
|
|
4
|
+
const signInOptions = options?.signInOptions ?? 'NAME_AND_PASSWORD';
|
|
5
|
+
switch (code) {
|
|
6
|
+
case 'MEMBER_ACCOUNT_BLACKLISTED':
|
|
7
|
+
return `Your account ${accountName} has been blacklisted due to a serious violation of our policies. For more information or to appeal, please contact the ${siteName} Chat Support team.`;
|
|
8
|
+
case 'MEMBER_ACCOUNT_SUSPENDED':
|
|
9
|
+
return `Your account ${accountName} has been temporarily suspended. Please reach out to the ${siteName} Chat Support team to learn more and get help with resolving the issue.`;
|
|
10
|
+
case 'INVALID_RECAPTCHA_RESPONSE':
|
|
11
|
+
return 'Invalid reCAPTCHA response';
|
|
12
|
+
case 'MEMBER_NOT_FOUND':
|
|
13
|
+
return 'Account not found. Please check your username and try again.';
|
|
14
|
+
case 'RATE_LIMIT_REACH':
|
|
15
|
+
return 'Rate limit exceeded';
|
|
16
|
+
case 'NOT_READY_TO_SEND_VERIFICATION_ERROR':
|
|
17
|
+
return 'Your account is not ready to send verification requests. Please try again later.';
|
|
18
|
+
case 'Forbidden':
|
|
19
|
+
if (signInOptions === 'MOBILE_NUMBER') {
|
|
20
|
+
return 'Invalid verification code. Please check the code and try again.';
|
|
21
|
+
}
|
|
22
|
+
return 'Invalid username or password, please try again.';
|
|
23
|
+
default:
|
|
24
|
+
return 'Something went wrong. Please try again later.';
|
|
25
|
+
}
|
|
26
|
+
}
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
export const BRANCHES = [
|
|
2
|
+
{
|
|
3
|
+
code: 'BRCAL',
|
|
4
|
+
name: 'Bingo Republic 2nd floor Primark Center Deparo St., Caloocan City',
|
|
5
|
+
},
|
|
6
|
+
{
|
|
7
|
+
code: 'BRNAG',
|
|
8
|
+
name: 'Bingo Republic 3rd floor Robinsons Mall, Naga City, Camarines Sur',
|
|
9
|
+
},
|
|
10
|
+
{
|
|
11
|
+
code: 'BRANT',
|
|
12
|
+
name: 'Bingo Republic 2nd floor Robinsons Mall, San Vicente,Antique',
|
|
13
|
+
},
|
|
14
|
+
{
|
|
15
|
+
code: 'BRCLA',
|
|
16
|
+
name: 'Clark',
|
|
17
|
+
},
|
|
18
|
+
{
|
|
19
|
+
code: 'BRLAG',
|
|
20
|
+
name: 'Laguna',
|
|
21
|
+
},
|
|
22
|
+
{
|
|
23
|
+
code: 'BREAS',
|
|
24
|
+
name: 'Eastwood City, Quezon City',
|
|
25
|
+
},
|
|
26
|
+
{
|
|
27
|
+
code: 'BRMAR',
|
|
28
|
+
name: 'Bingo ng Bayan 4th floor Marikina Public Market, Marikina City',
|
|
29
|
+
},
|
|
30
|
+
{
|
|
31
|
+
code: 'BRILO',
|
|
32
|
+
name: 'Iloilo',
|
|
33
|
+
},
|
|
34
|
+
{
|
|
35
|
+
code: 'BRFIM',
|
|
36
|
+
name: 'Fisher Mall,Quezon City',
|
|
37
|
+
},
|
|
38
|
+
{
|
|
39
|
+
code: 'BRCAC',
|
|
40
|
+
name: 'Villa Caceres Hotel, Naga City,Camsur',
|
|
41
|
+
},
|
|
42
|
+
];
|
|
Binary file
|
|
File without changes
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './FacebookPixel';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './FacebookPixel.js';
|
|
File without changes
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './GoogleRecaptcha';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './GoogleRecaptcha.js';
|
package/dist/ui/Badge/Badge.d.ts
CHANGED
|
@@ -37,7 +37,7 @@ export declare const Root: import("react").ComponentType<import("@ark-ui/react")
|
|
|
37
37
|
root: string;
|
|
38
38
|
};
|
|
39
39
|
};
|
|
40
|
-
}, Record<"label" | "root" | "
|
|
40
|
+
}, Record<"label" | "root" | "indicator" | "icon", string | string[]>, undefined, {
|
|
41
41
|
size: {
|
|
42
42
|
md: {
|
|
43
43
|
root: string;
|
|
@@ -72,7 +72,7 @@ export declare const Root: import("react").ComponentType<import("@ark-ui/react")
|
|
|
72
72
|
root: string;
|
|
73
73
|
};
|
|
74
74
|
};
|
|
75
|
-
}, Record<"label" | "root" | "
|
|
75
|
+
}, Record<"label" | "root" | "indicator" | "icon", string | string[]>, import("tailwind-variants").TVReturnType<{
|
|
76
76
|
size: {
|
|
77
77
|
md: {
|
|
78
78
|
root: string;
|
|
@@ -107,7 +107,7 @@ export declare const Root: import("react").ComponentType<import("@ark-ui/react")
|
|
|
107
107
|
root: string;
|
|
108
108
|
};
|
|
109
109
|
};
|
|
110
|
-
}, Record<"label" | "root" | "
|
|
110
|
+
}, Record<"label" | "root" | "indicator" | "icon", string | string[]>, undefined, unknown, unknown, undefined>>>>>;
|
|
111
111
|
interface BadgeLabelProps extends ComponentPropsWithRef<'span'> {
|
|
112
112
|
asChild?: boolean;
|
|
113
113
|
}
|
|
@@ -146,7 +146,7 @@ export declare const Label: import("react").ComponentType<import("@ark-ui/react"
|
|
|
146
146
|
root: string;
|
|
147
147
|
};
|
|
148
148
|
};
|
|
149
|
-
}, Record<"label" | "root" | "
|
|
149
|
+
}, Record<"label" | "root" | "indicator" | "icon", string | string[]>, undefined, {
|
|
150
150
|
size: {
|
|
151
151
|
md: {
|
|
152
152
|
root: string;
|
|
@@ -181,7 +181,7 @@ export declare const Label: import("react").ComponentType<import("@ark-ui/react"
|
|
|
181
181
|
root: string;
|
|
182
182
|
};
|
|
183
183
|
};
|
|
184
|
-
}, Record<"label" | "root" | "
|
|
184
|
+
}, Record<"label" | "root" | "indicator" | "icon", string | string[]>, import("tailwind-variants").TVReturnType<{
|
|
185
185
|
size: {
|
|
186
186
|
md: {
|
|
187
187
|
root: string;
|
|
@@ -216,7 +216,7 @@ export declare const Label: import("react").ComponentType<import("@ark-ui/react"
|
|
|
216
216
|
root: string;
|
|
217
217
|
};
|
|
218
218
|
};
|
|
219
|
-
}, Record<"label" | "root" | "
|
|
219
|
+
}, Record<"label" | "root" | "indicator" | "icon", string | string[]>, undefined, unknown, unknown, undefined>>>>>;
|
|
220
220
|
interface BadgeIndicatorProps extends ComponentPropsWithRef<'svg'> {
|
|
221
221
|
asChild?: boolean;
|
|
222
222
|
}
|
|
@@ -255,7 +255,7 @@ export declare const Indicator: import("react").ComponentType<import("@ark-ui/re
|
|
|
255
255
|
root: string;
|
|
256
256
|
};
|
|
257
257
|
};
|
|
258
|
-
}, Record<"label" | "root" | "
|
|
258
|
+
}, Record<"label" | "root" | "indicator" | "icon", string | string[]>, undefined, {
|
|
259
259
|
size: {
|
|
260
260
|
md: {
|
|
261
261
|
root: string;
|
|
@@ -290,7 +290,7 @@ export declare const Indicator: import("react").ComponentType<import("@ark-ui/re
|
|
|
290
290
|
root: string;
|
|
291
291
|
};
|
|
292
292
|
};
|
|
293
|
-
}, Record<"label" | "root" | "
|
|
293
|
+
}, Record<"label" | "root" | "indicator" | "icon", string | string[]>, import("tailwind-variants").TVReturnType<{
|
|
294
294
|
size: {
|
|
295
295
|
md: {
|
|
296
296
|
root: string;
|
|
@@ -325,7 +325,7 @@ export declare const Indicator: import("react").ComponentType<import("@ark-ui/re
|
|
|
325
325
|
root: string;
|
|
326
326
|
};
|
|
327
327
|
};
|
|
328
|
-
}, Record<"label" | "root" | "
|
|
328
|
+
}, Record<"label" | "root" | "indicator" | "icon", string | string[]>, undefined, unknown, unknown, undefined>>>>>;
|
|
329
329
|
interface BadgeIconProps extends ComponentPropsWithRef<'svg'> {
|
|
330
330
|
asChild?: boolean;
|
|
331
331
|
}
|
|
@@ -364,7 +364,7 @@ export declare const Icon: import("react").ComponentType<import("@ark-ui/react")
|
|
|
364
364
|
root: string;
|
|
365
365
|
};
|
|
366
366
|
};
|
|
367
|
-
}, Record<"label" | "root" | "
|
|
367
|
+
}, Record<"label" | "root" | "indicator" | "icon", string | string[]>, undefined, {
|
|
368
368
|
size: {
|
|
369
369
|
md: {
|
|
370
370
|
root: string;
|
|
@@ -399,7 +399,7 @@ export declare const Icon: import("react").ComponentType<import("@ark-ui/react")
|
|
|
399
399
|
root: string;
|
|
400
400
|
};
|
|
401
401
|
};
|
|
402
|
-
}, Record<"label" | "root" | "
|
|
402
|
+
}, Record<"label" | "root" | "indicator" | "icon", string | string[]>, import("tailwind-variants").TVReturnType<{
|
|
403
403
|
size: {
|
|
404
404
|
md: {
|
|
405
405
|
root: string;
|
|
@@ -434,5 +434,5 @@ export declare const Icon: import("react").ComponentType<import("@ark-ui/react")
|
|
|
434
434
|
root: string;
|
|
435
435
|
};
|
|
436
436
|
};
|
|
437
|
-
}, Record<"label" | "root" | "
|
|
437
|
+
}, Record<"label" | "root" | "indicator" | "icon", string | string[]>, undefined, unknown, unknown, undefined>>>>>;
|
|
438
438
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const badgeAnatomy: import("@ark-ui/react/anatomy").AnatomyInstance<"label" | "root" | "
|
|
1
|
+
export declare const badgeAnatomy: import("@ark-ui/react/anatomy").AnatomyInstance<"label" | "root" | "indicator" | "icon">;
|