@truworth/twc-auth 3.0.2 → 3.0.3

package/build/src/screens/CreatePassword/hooks/internal/useCreatePassword.js

@@ -4,12 +4,17 @@ import { defaultPolicy } from "../../../../constants/defaultPolicy";
  * @internal
  * Internal hook for managing CreatePassword screen state and auth context integration.
  * Not exposed to package consumers.
+ *
+ * Both web and native use the same pattern:
+ * - Hook manages password state internally
+ * - Use handlePassword/handleConfirmPassword to update state
+ * - Optional initial values for preserving state when navigating back
  */
-const useCreatePassword = () => {
+const useCreatePassword = (props) => {
     const [passwordVisible, setPasswordVisible] = useState(false);
     const [confirmPasswordVisible, setConfirmPasswordVisible] = useState(false);
-    const [password, setPassword] = useState('');
-    const [confirmPassword, setConfirmPassword] = useState('');
+    const [password, setPassword] = useState(props?.initialPassword || '');
+    const [confirmPassword, setConfirmPassword] = useState(props?.initialConfirmPassword || '');
     const [maxLength, setMaxLength] = useState(defaultPolicy.maxLength);
     const [criteria, setCriteria] = useState({});
     const handlePassword = (text) => {
@@ -23,7 +28,9 @@ const useCreatePassword = () => {
         setConfirmPassword('');
         onResult();
     };
-    const isContinueDisabled = !Object.keys(criteria).every(c => criteria[c]) || (password !== confirmPassword);
+    const allCriteriaMet = Object.keys(criteria).length > 0 && Object.keys(criteria).every(c => criteria[c]);
+    const passwordsMatch = password.length > 0 && password === confirmPassword;
+    const isContinueDisabled = !allCriteriaMet || !passwordsMatch;
     return {
         password, setPassword,
         confirmPassword, setConfirmPassword,

package/build/src/screens/CreatePassword/index.js

@@ -1,43 +1,16 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Button, Flex, Form, PasswordInput, Typography, useForm } from "@truworth/twc-web-design";
+import { Button, Flex, PasswordInput, Typography } from "@truworth/twc-web-design";
 import { useCreatePassword } from "./hooks/internal/useCreatePassword";
 import { ScreenLayout } from "../../components/ScreenLayout";
 import { PasswordCriteria } from "../../components/PasswordCriteria";
 const CreatePassword = ({ userDetails, handleBack, onContinue }) => {
     const { countryCode, email } = userDetails;
-    const form = useForm({
-        defaultValues: {
-            password: userDetails.password || '',
-            confirmPassword: userDetails.confirmPassword || '',
-        }
-    });
-    const { password, confirmPassword } = form.watch();
-    const { criteria, setCriteria, maxLength, setMaxLength, handleSkip, isContinueDisabled } = useCreatePassword();
+    const { password, confirmPassword, handlePassword, handleConfirmPassword, passwordVisible, setPasswordVisible, confirmPasswordVisible, setConfirmPasswordVisible, criteria, setCriteria, maxLength, setMaxLength, handleSkip, isContinueDisabled } = useCreatePassword();
     return (_jsx(ScreenLayout, { title: _jsxs(Flex, { justify: "between", align: "center", children: [_jsx(Typography, { type: "heading", size: "h5", children: "Create your Password" }), countryCode == '91' &&
-                    _jsx(Button, { label: "Skip Now", variant: "link", onClick: () => handleSkip({ onResult: onContinue }) })] }), subTitle: "Use a password that's easy to remember and fulfills all the requirements listed below.", buttonProps: {
+                    _jsx(Button, { label: "Skip Now", variant: "link", onClick: () => handleSkip({ onResult: () => onContinue('', '') }) })] }), subTitle: "Use a password that's easy to remember and fulfills all the requirements listed below.", buttonProps: {
             label: 'Continue',
             onClick: () => onContinue(password, confirmPassword),
             disabled: isContinueDisabled
-        }, onPressBack: handleBack, children: _jsxs(Form, { form: form, className: 'w-full', children: [_jsx(Form.Item, { name: "password", label: "Enter Password", normalize: (value) => value.replace(/\s/g, ''), rules: [
-                        {
-                            required: true,
-                            message: 'Please enter your password'
-                        }
-                    ], children: _jsx(PasswordInput, { placeholder: "Enter password", value: password, maxLength: maxLength, showStrengthIndicator: false }) }), _jsx(PasswordCriteria, { email: email, password: password, criteria: criteria, onCriteriaChange: setCriteria, onMaxLengthChange: setMaxLength }), _jsx(Form.Item, { name: "confirmPassword", label: "Confirm Password", className: "mt-6", normalize: (value) => value.replace(/\s/g, ''), rules: [
-                        {
-                            required: true,
-                            message: 'Please confirm your password',
-                        },
-                        {
-                            validator: async (_, value) => {
-                                const password = form.getValues('password');
-                                if (!value)
-                                    return;
-                                if (!value || password !== value) {
-                                    throw new Error('Passwords don’t match');
-                                }
-                            },
-                        },
-                    ], children: _jsx(PasswordInput, { className: "mb-6", value: confirmPassword, placeholder: "Re-enter password", maxLength: maxLength, showStrengthIndicator: false }) })] }) }));
+        }, onPressBack: handleBack, children: _jsxs("div", { style: { width: '100%' }, children: [_jsxs("div", { style: { marginBottom: '8px', width: '100%' }, children: [_jsx(Typography, { type: "body", size: "small", className: "mb-1 font-medium", children: "Enter Password" }), _jsx("div", { style: { width: '100%' }, children: _jsx(PasswordInput, { placeholder: "Enter password", value: password, onChange: (value) => handlePassword(value), maxLength: maxLength, showStrengthIndicator: false, style: { width: '100%' } }) })] }), _jsx(PasswordCriteria, { email: email, password: password, criteria: criteria, onCriteriaChange: setCriteria, onMaxLengthChange: setMaxLength }), _jsxs("div", { style: { marginTop: '24px', marginBottom: '24px', width: '100%' }, children: [_jsx(Typography, { type: "body", size: "small", className: "mb-1 font-medium", children: "Confirm Password" }), _jsx("div", { style: { width: '100%' }, children: _jsx(PasswordInput, { placeholder: "Re-enter password", value: confirmPassword, onChange: (value) => handleConfirmPassword(value), maxLength: maxLength, showStrengthIndicator: false, style: { width: '100%' } }) }), confirmPassword && password !== confirmPassword && (_jsx(Typography, { type: "body", size: "tiny", className: "text-red-500 mt-1", children: "Passwords don't match" }))] })] }) }));
 };
 export default CreatePassword;

package/build/src/screens/UserConsent/index.js

@@ -7,7 +7,6 @@ import { useAuthPackageContext } from '../../hooks/internal/useAuthPackageContex
 import { CDN_IMAGES_URL } from '../../constants/cdn-url';
 import { useConsent } from './hooks/internal/useConsent';
 import { ScreenLayout } from "../../components/ScreenLayout";
-import { useNavigator } from '../../hooks/useNavigator';
 import VerifyMobile from "../VerifyMobile";
 import VerifyEmail from "../VerifyEmail";
 import redirectHome from '../../../assets/animation/redirect-home.json';
@@ -20,7 +19,6 @@ const UserConsent = ({ userDetails, handleBack }) => {
     const [sessionToken, setSessionToken] = useState('');
     const { onLogin, appConfig: { appName, privacyPolicyUrl }, LogoComponent, onTokenChange } = useAuthPackageContext();
     const { loading, onAgree } = useConsent();
-    const navigator = useNavigator();
     const onAgreeHandler = (res) => {
         const { token, member, emailVerificationRequired, mobileVerificationRequired, sessionToken } = res;
         if (token && member) {
@@ -58,18 +56,25 @@ const UserConsent = ({ userDetails, handleBack }) => {
                                                     source: 'web',
                                                     onResult: onAgreeHandler
                                                 }), className: "w-full lg:!w-auto lg:!mt-0" }), _jsx(Button, { label: "Not Now, I Will Register Later", variant: "link", onClick: () => setRedirectModal(true), className: "w-full lg:!w-auto lg:!mt-0" })] })] }) })] }), subTitle: "", onPressBack: handleBack }), redirectModal &&
-                _jsx(RedirectToHomeModal, { redirectModal: redirectModal, navigator: navigator }), showVerifyMobileModal &&
+                _jsx(RedirectToHomeModal, { redirectModal: redirectModal }), showVerifyMobileModal &&
                 _jsx(VerifyMobileModal, { phone: phone, visible: showVerifyMobileModal, hide: () => setShowVerifyMobileModal(false), sessionToken: sessionToken }), showVerifyEmailModal &&
                 _jsx(VerifyEmailModal, { email: email, visible: showVerifyEmailModal, hide: () => setShowVerifyEmailModal(false), sessionToken: sessionToken, onVerifiedOTP: () => {
                         setShowVerifyEmailModal(false);
                         setShowVerifyMobileModal(true);
                     } })] }));
 };
-const RedirectToHomeModal = ({ redirectModal, navigator }) => {
+const RedirectToHomeModal = ({ redirectModal }) => {
+    const [isMounted, setIsMounted] = useState(false);
     useEffect(() => {
-        navigator.pushAbsolute('/login');
+        setIsMounted(true);
+        // Redirect after a short delay to show the modal
+        const timer = setTimeout(() => {
+            // Use window.location for full page navigation to avoid context issues
+            window.location.href = '/login';
+        }, 2000);
+        return () => clearTimeout(timer);
     }, []);
-    return (_jsxs(Modal, { title: "", open: redirectModal, showCloseButton: false, footer: null, children: [_jsx(Suspense, { fallback: _jsx("div", { className: "h-[150px] w-[250px]" }), children: _jsx(Lottie
+    return (_jsxs(Modal, { title: "", open: redirectModal, showCloseButton: false, footer: null, children: [isMounted && (_jsx(Suspense, { fallback: _jsx("div", { className: "h-[150px] w-[250px]" }), children: _jsx(Lottie
                 /* @ts-ignore */
                 , { 
                     /* @ts-ignore */
@@ -77,7 +82,7 @@ const RedirectToHomeModal = ({ redirectModal, navigator }) => {
                         animationData: redirectHome,
                         loop: true,
                         autoplay: true
-                    }, height: 150, width: 250 }) }), _jsxs(Flex, { direction: 'column', style: { marginTop: "-30px" }, children: [_jsx(Typography, { type: 'heading', size: 'h5', className: 'text-center mb-6', color: "text-gray-800", children: "Redirecting to the website homepage" }), _jsxs(Flex, { children: [_jsx(Info, { color: 'blue' }), _jsx(Typography, { type: 'body', size: 'small', className: 'text-center mb-6', color: "text-gray-800", children: "We have not stored any information you shared during registration." })] })] })] }));
+                    }, height: 150, width: 250 }) })), _jsxs(Flex, { direction: 'column', style: { marginTop: isMounted ? "-30px" : "0" }, children: [_jsx(Typography, { type: 'heading', size: 'h5', className: 'text-center mb-6', color: "text-gray-800", children: "Redirecting to the website homepage" }), _jsxs(Flex, { children: [_jsx(Info, { color: 'blue' }), _jsx(Typography, { type: 'body', size: 'small', className: 'text-center mb-6', color: "text-gray-800", children: "We have not stored any information you shared during registration." })] })] })] }));
 };
 const VerifyMobileModal = ({ visible, hide, sessionToken, phone }) => {
     return (_jsx(ResponsiveModal, { title: 'Verify Mobile', open: visible, onClose: hide, onOpenChange: hide, maskClosable: false, showCloseButton: false, children: _jsx(VerifyMobile, { sessionToken: sessionToken, phone: phone }) }));

package/build/types/screens/CreatePassword/hooks/internal/useCreatePassword.d.ts

@@ -1,9 +1,20 @@
+interface UseCreatePasswordProps {
+    /** Initial password value (for preserving state when navigating back) */
+    initialPassword?: string;
+    /** Initial confirm password value (for preserving state when navigating back) */
+    initialConfirmPassword?: string;
+}
 /**
  * @internal
  * Internal hook for managing CreatePassword screen state and auth context integration.
  * Not exposed to package consumers.
+ *
+ * Both web and native use the same pattern:
+ * - Hook manages password state internally
+ * - Use handlePassword/handleConfirmPassword to update state
+ * - Optional initial values for preserving state when navigating back
  */
-declare const useCreatePassword: () => {
+declare const useCreatePassword: (props?: UseCreatePasswordProps) => {
     password: string;
     setPassword: import("react").Dispatch<import("react").SetStateAction<string>>;
     confirmPassword: string;

package/package.json

@@ -4,7 +4,7 @@
     "access": "public"
   },
   "description": "Truworth Auth Package for React Native and Web",
-  "version": "3.0.2",
+  "version": "3.0.3",
   "main": "build/src/index.js",
   "types": "build/types/index.d.ts",
   "files": [