@opexa/portal-components 0.1.25 → 0.1.26

package/dist/components/UpdateMobilePhoneNumber/UpdateMobilePhoneNumber.js

@@ -17,7 +17,7 @@ export function UpdateMobilePhoneNumber({ shouldOnlyShow = 'MobileVerified', } =
         updateMobilePhoneNumber: ctx.updateMobilePhoneNumber,
         kyc: ctx.kyc,
     })));
-    const { step, step1Form, step2Form, cooldown, formRef, mobileNumberParser, submitStep1, submitStep2, resend, goBackToStep1, } = useUpdateMobileFlow();
+    const { step, step1Form, step2Form, cooldown, formRef, mobileNumberParser, submitStep1, submitStep2, resend, goBackToStep1, } = useUpdateMobileFlow(shouldOnlyShow);
     const isOpen = globalStore.updateMobilePhoneNumber.open && !globalStore.kyc.open;
     return (_jsx(Dialog.Root, { open: isOpen, lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { className: "flex items-center", children: _jsxs(Dialog.Content, { className: "flex w-[375px] flex-col items-center space-y-4 rounded-xl bg-[#111827] p-6 text-center", style: {
                             backgroundImage: `url(${lightBg.src})`,

package/dist/components/UpdateMobilePhoneNumber/hooks/useUpdateMobileFlow.d.ts

@@ -1,3 +1,4 @@
+import type { UpdateMobilePhoneNumberShouldOnlyShow } from './useAutoOpen';
 /**
  * Encapsulates the entire two-step mobile number update flow:
  *  - step state
@@ -8,7 +9,7 @@
  *  - resend cooldown
  *  - helpers used by the two step components
  */
-export declare function useUpdateMobileFlow(): {
+export declare function useUpdateMobileFlow(shouldOnlyShow?: UpdateMobilePhoneNumberShouldOnlyShow): {
     step: number;
     step1Form: import("react-hook-form").UseFormReturn<{
         mobileNumber: string;

package/dist/components/UpdateMobilePhoneNumber/hooks/useUpdateMobileFlow.js

@@ -2,10 +2,12 @@
 import { zodResolver } from '@hookform/resolvers/zod';
 import { useRef, useState } from 'react';
 import { useForm } from 'react-hook-form';
+import { useTimeout } from 'usehooks-ts';
 import { useShallow } from 'zustand/shallow';
 import { useAccountQuery } from '../../../client/hooks/useAccountQuery.js';
 import { useCooldown } from '../../../client/hooks/useCooldown.js';
 import { useGlobalStore } from '../../../client/hooks/useGlobalStore.js';
+import { useSessionQuery } from '../../../client/hooks/useSessionQuery.js';
 import { useMobileNumberParser } from '../../../client/hooks/useMobileNumberParser.js';
 import { useSendVerificationCodeMutation } from '../../../client/hooks/useSendVerificationCodeMutation.js';
 import { useUpdateMobileNumber } from '../../../client/hooks/useUpdateMobileNumber.js';
@@ -22,12 +24,34 @@ import { useMobileNumberSchemas } from './useMobileNumberSchemas.js';
  *  - resend cooldown
  *  - helpers used by the two step components
  */
-export function useUpdateMobileFlow() {
+export function useUpdateMobileFlow(shouldOnlyShow = 'MobileVerified') {
     const globalStore = useGlobalStore(useShallow((ctx) => ({
         updateMobilePhoneNumber: ctx.updateMobilePhoneNumber,
         kyc: ctx.kyc,
     })));
-    const accountQuery = useAccountQuery();
+    const pollForMobileVerified = shouldOnlyShow === 'MobileVerified';
+    const sessionQuery = useSessionQuery();
+    const accountQuery = useAccountQuery(pollForMobileVerified
+        ? {
+            enabled: sessionQuery.data?.status === 'authenticated' &&
+                globalStore.updateMobilePhoneNumber.open,
+            refetchInterval: (ctx) => {
+                if (ctx.state.data?.mobileNumberVerified === true) {
+                    return false;
+                }
+                if (ctx.state.dataUpdateCount > 5) {
+                    return false;
+                }
+                return 1000;
+            },
+        }
+        : undefined);
+    useTimeout(() => {
+        globalStore.updateMobilePhoneNumber.setOpen(false);
+    }, pollForMobileVerified &&
+        accountQuery.data?.mobileNumberVerified === true
+        ? 1
+        : null);
     const mobileNumberParser = useMobileNumberParser();
     const { Step1Definition, Step2Definition } = useMobileNumberSchemas();
     const [step, setStep] = useState(1);

package/dist/services/httpRequest.js

@@ -150,7 +150,7 @@ function getErrorMessage(code) {
         case 'MEMBER_ACCOUNT_SUSPENDED':
             return 'Your account has been temporarily suspended. Please reach out to the Chat Support team to learn more and get help with resolving the issue.';
         case 'MEMBER_ACCOUNT_DISABLED':
-            return 'Your account is being created. Please try again later.';
+            return 'Your account is being created. It may take a few minutes to complete. Please try again later.';
         case 'INVALID_RECAPTCHA_RESPONSE':
             return 'Invalid reCAPTCHA response';
         case 'MEMBER_NOT_FOUND':

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opexa/portal-components",
-  "version": "0.1.25",
+  "version": "0.1.26",
   "exports": {
     "./ui/*": {
       "types": "./dist/ui/*/index.d.ts",