@opexa/portal-components 0.0.477 → 0.0.478

package/dist/components/KYC/KYCDefault/IdentityVerification.js

@@ -19,12 +19,14 @@ import { IdFrontImageField } from '../../shared/IdFrontImageField/index.js';
 import { SelfieImageField } from '../../shared/SelfieImageField/index.js';
 import { useKYCDefaultContext } from './KYCDefaultContext.js';
 import { useAccountQuery } from '../../../client/hooks/useAccountQuery.js';
+import { useFeatureFlag } from '../../../client/hooks/useFeatureFlag.js';
 const formSchema = z.object({
     selfieImage: z.string().min(1, 'Selfie image is required.'),
     idFrontImage: z.string().min(1, 'Front image of ID is required.'),
 });
 export function IdentityVerification() {
     const kyc = useKYCDefaultContext();
+    const featureFlag = useFeatureFlag();
     const { data: account, isLoading: accountLoading } = useAccountQuery();
     const isVerificationLocked = account?.status === 'VERIFICATION_LOCKED';
     const { mutate: createMemberVerification, isPending: createPending } = useCreateMemberVerificationMutation({
@@ -117,7 +119,7 @@ export function IdentityVerification() {
                                             type: 'validate',
                                             message: error.message,
                                         });
-                                    } }), _jsx(Field.ErrorText, { children: o.fieldState.error?.message })] })) }), _jsx(Button, { type: "submit", className: "mt-6", disabled: createPending || updatePending, children: "Continue" }), !isVerificationLocked && (_jsx(Button, { variant: "outline", colorScheme: "gray", className: "mt-lg", type: "button", onClick: () => {
+                                    } }), _jsx(Field.ErrorText, { children: o.fieldState.error?.message })] })) }), _jsx(Button, { type: "submit", className: "mt-6", disabled: createPending || updatePending, children: "Continue" }), !(featureFlag.enabled && isVerificationLocked) && (_jsx(Button, { variant: "outline", colorScheme: "gray", className: "mt-lg", type: "button", onClick: () => {
                             globalStore.kyc.setOpen(false);
                         }, children: "Skip for now" }))] })] }));
 }

package/dist/components/KYC/KYCDefault/KYCDefault.js

@@ -15,8 +15,10 @@ import { Indicator } from './Indicator.js';
 import { KYCDefaultContext } from './KYCDefaultContext.js';
 import { PersonalInformation } from './PersonalInformation.js';
 import { useKYCDefault } from './useKYCDefault.js';
+import { useFeatureFlag } from '../../../client/hooks/useFeatureFlag.js';
 export function KYCDefault(props) {
-    const globalStore = useGlobalStore(useShallow((ctx) => ({ kyc: ctx.kyc })));
+    const globalStore = useGlobalStore(useShallow((ctx) => ({ kyc: ctx.kyc, kycReminder: ctx.kycReminder })));
+    const featureFlag = useFeatureFlag();
     const kyc = useKYCDefault();
     const { data: account } = useAccountQuery();
     const { data: verification } = useMemberVerificationQuery();
@@ -40,7 +42,7 @@ export function KYCDefault(props) {
             kyc.setStep(steps);
         }
     }, [steps, kyc]);
-    return (_jsxs(_Fragment, { children: [_jsx(KYCDefaultContext, { value: kyc, children: _jsx(Dialog.Root, { open: globalStore.kyc.open && hasMissingData, onOpenChange: (details) => {
+    return (_jsxs(_Fragment, { children: [_jsx(KYCDefaultContext, { value: kyc, children: _jsx(Dialog.Root, { open: featureFlag.enabled ? !globalStore.kycReminder.open && globalStore.kyc.open && hasMissingData : globalStore.kyc.open && hasMissingData, onOpenChange: (details) => {
                         globalStore.kyc.setOpen(details.open);
-                    }, 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: [!isVerificationLocked && (_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 })] }));
+                    }, 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: [!(featureFlag.enabled && isVerificationLocked) && (_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 })] }));
 }

package/dist/components/KYC/KYCDefault/PersonalInformation.js

@@ -17,6 +17,8 @@ import { Field } from '../../../ui/Field/index.js';
 import { getQueryClient } from '../../../utils/getQueryClient.js';
 import { getMemberVerificationQueryKey } from '../../../utils/queryKeys.js';
 import { useKYCDefaultContext } from './KYCDefaultContext.js';
+import { useAccountQuery } from '../../../client/hooks/useAccountQuery.js';
+import { useFeatureFlag } from '../../../client/hooks/useFeatureFlag.js';
 const definition = z.object({
     address: z.string().trim().min(1, 'Current address is required'),
     permanentAddress: z.string().trim().min(1, 'Permanent address is required'),
@@ -27,11 +29,14 @@ const definition = z.object({
 });
 export function PersonalInformation() {
     const kyc = useKYCDefaultContext();
+    const featureFlag = useFeatureFlag();
     const globalStore = useGlobalStore(useShallow((ctx) => ({
         kyc: ctx.kyc,
     })));
     const memberVerificationQuery = useMemberVerificationQuery();
     const memberVerificationId = memberVerificationQuery.data?.id;
+    const { data: account, isLoading: accountLoading } = useAccountQuery();
+    const isVerificationLocked = account?.status === 'VERIFICATION_LOCKED';
     const approveMemberVerificationMutation = useApproveMemberVerification();
     const updateMemberVerificationMutation = useUpdateMemberVerificationMutation({
         onError(error) {
@@ -112,8 +117,8 @@ export function PersonalInformation() {
                                 });
                             }
                         }, 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 ||
-                            createMemberVerificationMutation.isPending, children: "Continue" }), _jsx(Button, { variant: "outline", colorScheme: "gray", className: "mt-lg", onClick: () => {
+                            createMemberVerificationMutation.isPending, children: "Continue" }), !(featureFlag.enabled && isVerificationLocked) && (_jsx(Button, { variant: "outline", colorScheme: "gray", className: "mt-lg", onClick: () => {
                             globalStore.kyc.setOpen(false);
                         }, disabled: updateMemberVerificationMutation.isPending ||
-                            createMemberVerificationMutation.isPending, children: "Skip for now" })] })] }));
+                            createMemberVerificationMutation.isPending, children: "Skip for now" }))] })] }));
 }

package/dist/components/KYC/KYCReminder.lazy.js

@@ -48,8 +48,7 @@ export function KYCReminder(props) {
             !verificationLoading &&
             globalStore.kycReminder.open &&
             session?.status === 'authenticated' &&
-            hasMissingData ||
-            isVerificationLocked, onOpenChange: (details) => {
+            hasMissingData, onOpenChange: (details) => {
             globalStore.kycReminder.setOpen(details.open);
         }, closeOnEscape: false, closeOnInteractOutside: false, lazyMount: true, unmountOnExit: true, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "!z-[calc(var(--z-dialog)+3)]" }), _jsx(Dialog.Positioner, { className: "!z-[calc(var(--z-dialog)+4)] flex items-center justify-center", children: _jsx(Dialog.Content, { className: "mx-auto h-fit max-w-[calc(100dvw-1rem)] overflow-y-auto rounded-lg bg-bg-primary-alt lg:max-w-[400px]", children: isVerificationLocked && enabled ? (_jsxs("div", { className: "p-3xl text-center", children: [_jsx("div", { className: "mx-auto w-fit rounded-full bg-bg-warning-secondary p-2 mb-4", children: _jsx(Image, { src: props.logo, alt: `${props.siteName} logo`, width: 200, height: 100, className: "mx-auto h-auto w-[120px]", draggable: false }) }), _jsx("h2", { className: "mt-4 text-lg", children: "Temporarily Locked" }), _jsx("p", { className: "mt-xs text-sm text-text-tertiary-600", children: "Your account has been locked due to incomplete verification. Please complete your verification to restore full access." }), _jsxs("div", { className: "flex w-full items-center justify-center gap-3xl mt-6", children: [_jsx(Image, { src: pagcorLogo, alt: "PAGCOR logo", height: 43, width: 88, className: "h-[43px] w-auto shrink-0", draggable: false, unoptimized: true }), _jsx(Image, { src: responsibleGamingLogo, alt: "Responsible Gaming logo", height: 50, width: 186, className: "h-[50px] w-auto shrink-0", draggable: false, unoptimized: true })] }), _jsx(Dialog.Context, { children: (api) => (_jsx("div", { className: "mt-6 space-y-lg", children: _jsx(Button, { onClick: () => {
                                                 api.setOpen(false);