@opexa/portal-components 0.0.390 → 0.0.392
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/PortalProvider/PortalProvider.js +2 -2
- package/dist/components/PortalProvider/SocialAccountLinkObserver.d.ts +1 -0
- package/dist/components/PortalProvider/SocialAccountLinkObserver.js +39 -0
- package/dist/components/SignUp/SignUpDefault/SignUpDefaultForm.js +19 -28
- package/package.json +1 -1
|
@@ -7,7 +7,7 @@ import { prefetchSessionQuery } from '../../server/utils/prefetchSessionQuery.js
|
|
|
7
7
|
import { prefetchWalletQuery } from '../../server/utils/prefetchWalletQuery.js';
|
|
8
8
|
import { getQueryClient } from '../../utils/getQueryClient.js';
|
|
9
9
|
import { FeatureFlag } from './FeatureFlag.js';
|
|
10
|
-
import {
|
|
10
|
+
import { SocialAccountLinkObserver } from './SocialAccountLinkObserver.js';
|
|
11
11
|
import { Providers } from './Providers.js';
|
|
12
12
|
import { SessionWatcher } from './SessionWatcher.js';
|
|
13
13
|
import { SetupBtag } from './SetupBtag.js';
|
|
@@ -22,5 +22,5 @@ export async function PortalProvider({ recaptchaSiteKey, children, }) {
|
|
|
22
22
|
prefetchAccountQuery(),
|
|
23
23
|
prefetchWalletQuery(),
|
|
24
24
|
]);
|
|
25
|
-
return (_jsxs(Fragment, { children: [_jsx(Providers, { recaptchaSiteKey: recaptchaSiteKey, children: _jsxs(HydrationBoundary, { state: dehydrate(queryClient), children: [children, _jsx(SessionWatcher, {}), _jsx(Suspense, { children: _jsx(SetupDomain, {}) }), _jsx(Suspense, { children: _jsx(SetupCellxpertCxd, {}) }), _jsx(Suspense, { children: _jsx(SetupBtag, {}) })] }) }), _jsx(Snackbar, {}), _jsx(Suspense, { children: _jsx(
|
|
25
|
+
return (_jsxs(Fragment, { children: [_jsx(Providers, { recaptchaSiteKey: recaptchaSiteKey, children: _jsxs(HydrationBoundary, { state: dehydrate(queryClient), children: [children, _jsx(SessionWatcher, {}), _jsx(Suspense, { children: _jsx(SetupDomain, {}) }), _jsx(Suspense, { children: _jsx(SetupCellxpertCxd, {}) }), _jsx(Suspense, { children: _jsx(SetupBtag, {}) })] }) }), _jsx(Snackbar, {}), _jsx(Suspense, { children: _jsx(SocialAccountLinkObserver, {}) }), _jsx(Suspense, { children: _jsx(FeatureFlag, {}) })] }));
|
|
26
26
|
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function SocialAccountLinkObserver(): null;
|
|
@@ -0,0 +1,39 @@
|
|
|
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 SocialAccountLinkObserver() {
|
|
8
|
+
const searchParams = useSearchParams();
|
|
9
|
+
const code = searchParams.get('message') ?? searchParams.get('status');
|
|
10
|
+
const providerParam = searchParams.get('provider');
|
|
11
|
+
const provider = providerParam === 'facebook' ? 'Facebook' : 'Google';
|
|
12
|
+
const queryClient = getQueryClient();
|
|
13
|
+
useTimeout(() => {
|
|
14
|
+
if (!code)
|
|
15
|
+
return;
|
|
16
|
+
if (code === 'duplicate') {
|
|
17
|
+
if (provider === 'Facebook') {
|
|
18
|
+
return toaster.error({
|
|
19
|
+
title: 'Facebook Account Already Linked',
|
|
20
|
+
description: 'This Facebook account is already linked to another player. Please use a different account or check your player settings.',
|
|
21
|
+
});
|
|
22
|
+
}
|
|
23
|
+
return toaster.error({
|
|
24
|
+
title: 'Duplicate Account',
|
|
25
|
+
description: 'An account with this email already exists. Please try signing in instead.',
|
|
26
|
+
});
|
|
27
|
+
}
|
|
28
|
+
if (code === 'linked') {
|
|
29
|
+
queryClient.invalidateQueries({
|
|
30
|
+
queryKey: getSessionQueryKey(),
|
|
31
|
+
});
|
|
32
|
+
return toaster.success({
|
|
33
|
+
title: `${provider} Account Linked Successfully`,
|
|
34
|
+
description: `Your ${provider} account has been successfully connected.`,
|
|
35
|
+
});
|
|
36
|
+
}
|
|
37
|
+
}, code ? 100 : null);
|
|
38
|
+
return null;
|
|
39
|
+
}
|
|
@@ -85,14 +85,23 @@ export function SignUpDefaultForm() {
|
|
|
85
85
|
});
|
|
86
86
|
}
|
|
87
87
|
}),
|
|
88
|
-
|
|
88
|
+
firstName: z
|
|
89
89
|
.string()
|
|
90
90
|
.transform((val) => val.trim())
|
|
91
91
|
.refine((val) => val.length >= 2, {
|
|
92
|
-
message: '
|
|
92
|
+
message: 'First name must be 2 or more characters',
|
|
93
93
|
})
|
|
94
94
|
.refine((val) => val.length <= 50, {
|
|
95
|
-
message: '
|
|
95
|
+
message: 'First name must not be more than 50 characters',
|
|
96
|
+
}),
|
|
97
|
+
lastName: z
|
|
98
|
+
.string()
|
|
99
|
+
.transform((val) => val.trim())
|
|
100
|
+
.refine((val) => val.length >= 2, {
|
|
101
|
+
message: 'Last name must be 2 or more characters',
|
|
102
|
+
})
|
|
103
|
+
.refine((val) => val.length <= 50, {
|
|
104
|
+
message: 'Last name must not be more than 50 characters',
|
|
96
105
|
}),
|
|
97
106
|
birthDay: z
|
|
98
107
|
.date({
|
|
@@ -127,7 +136,8 @@ export function SignUpDefaultForm() {
|
|
|
127
136
|
mode: 'all',
|
|
128
137
|
resolver: zodResolver(Step1Definition),
|
|
129
138
|
defaultValues: {
|
|
130
|
-
|
|
139
|
+
firstName: '',
|
|
140
|
+
lastName: '',
|
|
131
141
|
mobileNumber: '',
|
|
132
142
|
branchCode: signUpProps?.branches?.length
|
|
133
143
|
? signUpProps.branches[0]?.code
|
|
@@ -169,7 +179,7 @@ export function SignUpDefaultForm() {
|
|
|
169
179
|
}
|
|
170
180
|
}), children: [_jsxs(Field.Root, { invalid: !!step1Form.formState.errors.mobileNumber, children: [_jsx(Field.Label, { children: "Mobile Number" }), _jsxs("div", { className: "relative", children: [_jsxs("div", { className: "-translate-y-1/2 absolute top-1/2 left-3.5 flex shrink-0 items-center gap-md", children: [_jsx(localeInfo.country.flag, { className: "size-5" }), _jsx("span", { className: "text-text-placeholder", children: localeInfo.mobileNumber.areaCode })] }), _jsx(Field.Input, { style: {
|
|
171
181
|
paddingLeft: `calc(2.75rem + ${localeInfo.mobileNumber.areaCode.length}ch)`,
|
|
172
|
-
}, ...step1Form.register('mobileNumber') })] }), _jsx(Field.ErrorText, { children: step1Form.formState.errors.mobileNumber?.message })] }), _jsxs(Field.Root, { invalid: !!step1Form.formState.errors.
|
|
182
|
+
}, ...step1Form.register('mobileNumber') })] }), _jsx(Field.ErrorText, { children: step1Form.formState.errors.mobileNumber?.message })] }), _jsxs(Field.Root, { invalid: !!step1Form.formState.errors.firstName, className: "mt-xl", children: [_jsx(Field.Label, { children: "First Name" }), _jsx(Field.Input, { placeholder: "Enter your real name", ...step1Form.register('firstName') }), _jsx(Field.ErrorText, { children: step1Form.formState.errors.firstName?.message })] }), _jsxs(Field.Root, { invalid: !!step1Form.formState.errors.lastName, className: "mt-xl", children: [_jsx(Field.Label, { children: "Last Name" }), _jsx(Field.Input, { placeholder: "Enter your real name", ...step1Form.register('lastName') }), _jsx(Field.ErrorText, { children: step1Form.formState.errors.lastName?.message })] }), _jsxs(Field.Root, { invalid: !!step1Form.formState.errors.birthDay, className: "mt-xl", children: [_jsx(DateOfBirthField, { value: birthDay, onChange: (value) => {
|
|
173
183
|
if (!value)
|
|
174
184
|
return;
|
|
175
185
|
step1Form.setValue('birthDay', value, {
|
|
@@ -232,11 +242,12 @@ export function SignUpDefaultForm() {
|
|
|
232
242
|
verificationCode: verificationCode.join(''),
|
|
233
243
|
referralCode: search.get('referralCode') ?? undefined,
|
|
234
244
|
//new signup
|
|
235
|
-
...(
|
|
245
|
+
...(signUpProps?.branches &&
|
|
246
|
+
signUpProps.branches.length > 0 && {
|
|
236
247
|
branchCode: step1Form.getValues('branchCode'),
|
|
237
|
-
realName: step1Form.getValues('realName'),
|
|
238
|
-
birthDay: format(step1Form.getValues('birthDay'), 'yyyy-MM-dd'),
|
|
239
248
|
}),
|
|
249
|
+
realName: `${step1Form.getValues('firstName')} ${step1Form.getValues('lastName')}`,
|
|
250
|
+
birthDay: format(step1Form.getValues('birthDay'), 'yyyy-MM-dd'),
|
|
240
251
|
});
|
|
241
252
|
const name = mobileNumberParser.format(mobileNumber);
|
|
242
253
|
const password = `${name}${id}`;
|
|
@@ -261,26 +272,6 @@ export function SignUpDefaultForm() {
|
|
|
261
272
|
globalStore.signIn.setOpen(true);
|
|
262
273
|
return;
|
|
263
274
|
}
|
|
264
|
-
else if (!enabled) {
|
|
265
|
-
const pollUpdateAccount = createPoll(async () => {
|
|
266
|
-
try {
|
|
267
|
-
await updateAccountMutation.mutateAsync({
|
|
268
|
-
branchCode: step1Form.getValues('branchCode'),
|
|
269
|
-
realName: step1Form.getValues('realName'),
|
|
270
|
-
birthDay: format(step1Form.getValues('birthDay'), 'yyyy-MM-dd'),
|
|
271
|
-
});
|
|
272
|
-
return true;
|
|
273
|
-
}
|
|
274
|
-
catch {
|
|
275
|
-
return false;
|
|
276
|
-
}
|
|
277
|
-
}, {
|
|
278
|
-
until: (ok) => ok,
|
|
279
|
-
maxAttempt: 8,
|
|
280
|
-
interval: 250,
|
|
281
|
-
});
|
|
282
|
-
await pollUpdateAccount();
|
|
283
|
-
}
|
|
284
275
|
globalStore.signUp.setOpen(false);
|
|
285
276
|
globalStore.kycReminder.setOpen(true);
|
|
286
277
|
step1Form.reset();
|