@acuteinfo/common-screens 1.0.3 → 1.0.5

package/dist/index.d.ts

@@ -1,3 +1,4 @@
 import "regenerator-runtime/runtime";
 import "buffer";
 export * from "./pages/auth/authController";
+export * from "./pages/auth/forgotPassword";

package/dist/index.js

@@ -13,6 +13,7 @@ import clsx from 'clsx';
 import { useSnackbar } from 'notistack';
 import FingerprintSharpIcon from '@mui/icons-material/FingerprintSharp';
 import CryptoJS from 'crypto-js';
+import { useNavigate } from 'react-router-dom';
 
 const useStyles = makeStyles((theme) => ({
     wrapper: {
@@ -1000,7 +1001,7 @@ const PasswordRotation = ({ classes, ResetPassword, open, username, accessToken,
                                 }, fullWidth: true, disabled: pwdReset.isLoading, onClick: ClickEventHandler, ref: inputButtonRef, className: classes.otpButtons, children: pwdReset.isLoading ? (jsx(CircularProgress, { size: 25, thickness: 4.6 })) : ("Update") })] })] }) }) }));
 };
 
-const inititalState = {
+const inititalState$1 = {
     username: "",
     firstName: "",
     lastName: "",
@@ -1026,7 +1027,7 @@ const inititalState = {
     auth_type: "O",
     otpValidFor: 60,
 };
-const reducer = (state, action) => {
+const reducer$1 = (state, action) => {
     switch (action.type) {
         case "inititateUserFingerVerification":
         case "inititateOTPVerification": {
@@ -1189,7 +1190,7 @@ const reducer = (state, action) => {
         }
         case "backToUsernameVerification": {
             return {
-                ...inititalState,
+                ...inititalState$1,
                 isPasswordError: action?.payload?.isError,
                 userMessageforpassword: action?.payload?.errorMessage,
             };
@@ -1199,11 +1200,11 @@ const reducer = (state, action) => {
         }
     }
 };
-const AuthControllerWrapper = ({ bannerDetails, logoUrl, loginFn, veirfyUsernameandPassword, verifyOTP, OTPResendRequest, ResetPassword, LanguageComponent }) => {
+const AuthControllerWrapper = ({ bannerDetails, logoUrl, loginFn, veirfyUsernameandPassword, verifyOTP, OTPResendRequest, ResetPassword, LanguageComponent, }) => {
     // const { isLoggedIn, login } = useContext(AuthContext);
     const classes = useStyles();
     // const navigate = useNavigate();
-    const [loginState, dispath] = useReducer(reducer, inititalState);
+    const [loginState, dispath] = useReducer(reducer$1, inititalState$1);
     const [openpwdreset, setOpenPwdReset] = useState(false);
     const failureCount = useRef(0);
     const [dashboardLogoURL, setDashboardLogoURL] = useState(null);
@@ -1467,5 +1468,443 @@ const AuthControllerWrapper = ({ bannerDetails, logoUrl, loginFn, veirfyUsername
                                             }, otpresendCount: otpResendRef.current }, "OTPForm")] })) : (jsx(VerifyFinger, { classes: classes, loginState: loginState, verifyFinger: verifyFinger, previousStep: changeUserName }, "biometric")) })) }))] })] }) }));
 };
 
-export { AuthControllerWrapper };
+const ForgotPasswordFields = ({ classes, loginState, onSubmit }) => {
+    const [input, setInput] = useState({
+        userName: loginState.workingState === 1 ? loginState?.username : "",
+        mobileno: "",
+        password: "",
+        confirmpassword: "",
+    });
+    const inputRef = useRef(null);
+    const inputPassRef = useRef(null);
+    const inputButtonRef = useRef(null);
+    const [showPasswordTime, setShowPasswordTime] = useState(0);
+    const [showConfirmPasswordTime, setShowConfirmPasswordTime] = useState(0);
+    const showPassword = Date.now() < showPasswordTime;
+    const showConfirmPassword = Date.now() < showConfirmPasswordTime;
+    const [, forceUpdate] = useState();
+    const timerRef = useRef(null);
+    useEffect(() => {
+        return () => clearTimeout(timerRef.current);
+    }, []);
+    const navigate = useNavigate();
+    const { t } = useTranslation();
+    const handleChange = (event) => {
+        const name = event.target.name;
+        let value = event.target.value;
+        if (name === "userName" && value) {
+            loginState.isUsernameError = false;
+        }
+        if (name === "mobileno" && value) {
+            value = value.replace(/\D/g, "");
+            if (Boolean(value)) {
+                loginState.isMobileError = false;
+            }
+        }
+        setInput((values) => ({ ...values, [name]: value }));
+    };
+    useEffect(() => {
+        if (loginState.workingState === 1) {
+            setTimeout(() => {
+                inputPassRef?.current?.focus?.();
+            }, 2000);
+        }
+    }, [loginState.workingState]);
+    return (jsx(Fragment, { children: jsxs("div", { className: classes.formWrap, children: [jsx(TextField, { autoFocus: true, label: t("UserID"), placeholder: String(t("UserID")), fullWidth: true, type: "text", name: "userName", value: input.userName || "", onChange: handleChange, error: loginState.isUsernameError, helperText: loginState.isUsernameError
+                        ? t(loginState.userMessageforusername)
+                        : "", InputLabelProps: { shrink: true }, disabled: loginState.loading
+                        ? true
+                        : loginState.workingState === 0
+                            ? false
+                            : true, autoComplete: "off", ref: inputRef, inputProps: { maxLength: 16 }, onKeyDown: (e) => {
+                        if (e.key === "Enter") {
+                            inputButtonRef?.current?.click?.();
+                        }
+                    }, style: { paddingBottom: "8px" } }), loginState.workingState === 0 ? (jsx(TextField, { label: t("MobileNo"), placeholder: "Enter Mobile No.", 
+                    // placeholder={String(t("EnterMobileNo"))}
+                    fullWidth: true, type: "text", name: "mobileno", value: input.mobileno || "", onChange: handleChange, error: loginState.isMobileError, helperText: loginState.isMobileError
+                        ? t(loginState.userMessageforMobileno)
+                        : "", InputLabelProps: { shrink: true }, disabled: loginState.loading
+                        ? true
+                        : loginState.workingState === 0
+                            ? false
+                            : true, autoComplete: "off", onKeyDown: (e) => {
+                        if (e.key === "Enter") {
+                            inputButtonRef?.current?.click?.();
+                        }
+                    }, inputProps: { maxLength: 13 }, style: { paddingBottom: "8px" } })) : null, loginState.workingState === 1 ? (jsxs(Fragment$1, { children: [jsx(TextField, { autoFocus: true, label: t("Password"), placeholder: "Enter Password", fullWidth: true, type: showPassword ? "text" : "password", name: "password", value: input.password || "", onChange: handleChange, error: loginState.isPasswordError, helperText: loginState.isPasswordError
+                                ? t(loginState.userMessageforPassword)
+                                : "", InputLabelProps: { shrink: true }, disabled: loginState.loading, autoComplete: "off", ref: inputPassRef, onKeyDown: (e) => {
+                                if (e.key === "Enter") {
+                                    inputButtonRef?.current?.click?.();
+                                }
+                            }, InputProps: {
+                                endAdornment: (jsx(InputAdornment, { position: "end", children: jsx(IconButton, { "aria-label": "toggle password visibility", onClick: () => {
+                                            if (!showPassword) {
+                                                setShowPasswordTime(Date.now() + 5000);
+                                                timerRef.current = setTimeout(() => forceUpdate(Date.now()), 5000);
+                                            }
+                                            else if (showPassword)
+                                                setShowPasswordTime(0);
+                                        }, onMouseDown: (e) => e.preventDefault(), disabled: loginState.loading, children: showPassword ? jsx(Visibility, {}) : jsx(VisibilityOff, {}) }) })),
+                            }, inputProps: { maxLength: 16 }, style: { paddingBottom: "8px" } }), jsx(TextField, { label: t("ConfirmPassword"), placeholder: String(t("EnterConfirmPassword")), fullWidth: true, type: showConfirmPassword ? "text" : "password", name: "confirmpassword", value: input.confirmpassword || "", onChange: handleChange, error: loginState.isConfirmPasswordError, helperText: loginState.isConfirmPasswordError
+                                ? t(loginState.userMessageforconfirmPassword)
+                                : "", InputLabelProps: { shrink: true }, disabled: loginState.loading, autoComplete: "off", onKeyDown: (e) => {
+                                if (e.key === "Enter") {
+                                    inputButtonRef?.current?.click?.();
+                                }
+                            }, InputProps: {
+                                endAdornment: (jsx(InputAdornment, { position: "end", children: jsx(IconButton, { "aria-label": "toggle password visibility", onClick: () => {
+                                            if (!showConfirmPassword) {
+                                                setShowConfirmPasswordTime(Date.now() + 5000);
+                                                timerRef.current = setTimeout(() => forceUpdate(Date.now()), 5000);
+                                            }
+                                            else if (showConfirmPassword)
+                                                setShowConfirmPasswordTime(0);
+                                        }, onMouseDown: (e) => e.preventDefault(), disabled: loginState.loading, children: showConfirmPassword ? jsx(Visibility, {}) : jsx(VisibilityOff, {}) }) })),
+                            }, inputProps: { maxLength: 16 }, style: { paddingBottom: "8px" } })] })) : null, loginState.isApiError ? (jsx(FormHelperText, { style: { color: "red" }, children: loginState.apierrorMessage })) : null, jsx("div", { style: {
+                        marginTop: "20px",
+                        display: "flex",
+                        flexDirection: "row-reverse",
+                    }, children: jsx("div", { style: {
+                            flex: "auto",
+                            textAlign: "center",
+                            marginTop: "5px",
+                            marginBottom: "17px",
+                        }, children: jsxs("div", { children: [jsx(GradientButton, { style: { borderRadius: "10px", marginRight: "5px" }, 
+                                    // fullWidth
+                                    disabled: loginState.loading, onClick: () => {
+                                        navigate("login");
+                                    }, children: t("backtologin") }), jsx(GradientButton, { style: { borderRadius: "10px" }, disabled: loginState.loading, onClick: () => {
+                                        onSubmit(input, loginState.workingState);
+                                    }, ref: inputButtonRef, children: loginState.loading ? (jsx(CircularProgress, { size: 25, thickness: 4.6 })) : (t("Next")) })] }) }) })] }) }));
+};
+
+// import { MultiLanguages } from "./multiLanguages";
+const inititalState = {
+    isUsernameError: false,
+    userMessageforusername: "",
+    loading: false,
+    isMobileError: false,
+    userMessageforMobileno: "",
+    isPasswordError: false,
+    userMessageforPassword: "",
+    isConfirmPasswordError: false,
+    userMessageforconfirmPassword: "",
+    workingState: 0,
+    isApiError: false,
+    apierrorMessage: "",
+    otploading: false,
+    OtpuserMessage: "",
+    otpmodelClose: false,
+    requestCd: "",
+    username: "",
+    auth_type: "O",
+    transactionID: "",
+};
+const reducer = (state, action) => {
+    switch (action.type) {
+        case "verifyUserNameandMobileNoFailed": {
+            return {
+                ...state,
+                loading: false,
+                isUsernameError: action?.payload?.isUsernameError ?? false,
+                isMobileError: action?.payload?.isMobileError ?? false,
+                userMessageforusername: action?.payload?.userMessageforusername ?? "",
+                userMessageforMobileno: action?.payload?.userMessageforMobileno ?? "",
+                isApiError: action?.payload?.isApiError ?? false,
+                apierrorMessage: action?.payload?.apierrorMessage ?? "",
+                requestCd: "",
+                username: "",
+            };
+        }
+        case "initverifyUserNameandMobileNo": {
+            return {
+                ...state,
+                loading: true,
+                isUsernameError: false,
+                isMobileError: false,
+                requestCd: "",
+                username: "",
+            };
+        }
+        case "verifyUserNameandMobileNoSuccess": {
+            return {
+                ...state,
+                loading: false,
+                isUsernameError: false,
+                isMobileError: false,
+                workingState: 0,
+                isApiError: false,
+                apierrorMessage: "",
+                requestCd: action?.payload?.requestCd ?? "",
+                username: action?.payload?.username ?? "",
+                auth_type: action?.payload?.auth_type,
+                company_ID: action?.payload?.company_ID,
+                branch_cd: action?.payload?.branch_cd,
+                otpValidFor: action?.payload?.otpValidFor,
+            };
+        }
+        case "inititateOTPVerification": {
+            return {
+                ...state,
+                loading: false,
+                otploading: true,
+                OtpuserMessage: "",
+                otpmodelClose: false,
+            };
+        }
+        case "OTPVerificationComplate": {
+            return {
+                ...state,
+                loading: false,
+                otploading: false,
+                OtpuserMessage: "",
+                workingState: 1,
+                otpmodelClose: Boolean(action?.payload?.otpmodelclose),
+            };
+        }
+        case "OTPVerificationFailed": {
+            return {
+                ...state,
+                otploading: false,
+                OtpuserMessage: action?.payload?.error,
+                otpmodelClose: Boolean(action?.payload?.otpmodelclose),
+            };
+        }
+        case "verifyPasswordFailed": {
+            return {
+                ...state,
+                loading: false,
+                isPasswordError: action?.payload?.isPasswordError ?? false,
+                isConfirmPasswordError: action?.payload?.isConfirmPasswordError ?? false,
+                userMessageforPassword: action?.payload?.userMessageforPassword ?? "",
+                userMessageforconfirmPassword: action?.payload?.userMessageforconfirmPassword ?? "",
+                isApiError: false,
+                apierrorMessage: "",
+            };
+        }
+        case "initverifyPasswordSetReq": {
+            return {
+                ...state,
+                loading: true,
+                isPasswordError: false,
+                isConfirmPasswordError: false,
+            };
+        }
+        case "passwordRegistaredSuccess": {
+            return {
+                ...state,
+                loading: false,
+                isPasswordError: false,
+                isConfirmPasswordError: false,
+            };
+        }
+        case "OTPResendSuccess": {
+            return {
+                ...state,
+                requestCd: action?.payload?.requestCd,
+            };
+        }
+        default: {
+            return state;
+        }
+    }
+};
+const ForgotPasswordControllerWrapper = ({ screenFlag, updatenewPassword, veirfyUsernameandMobileNo, verifyOTPForPWDReset, logoUrl, LanguageComponent, bannerDetails }) => {
+    const classes = useStyles();
+    const navigate = useNavigate();
+    const [loginState, dispath] = useReducer(reducer, inititalState);
+    const [open, setOpen] = useState(false);
+    const { enqueueSnackbar } = useSnackbar();
+    const otpResendRef = useRef(1);
+    const { t } = useTranslation();
+    // const {
+    //   data: imageData,
+    //   isLoading,
+    //   isFetching,
+    //   isError,
+    //   error,
+    //   refetch,
+    // } = useQuery<any, any>(["getLoginImageData"], () =>
+    //   API.getLoginImageData({ APP_TRAN_CD: "51" })
+    // );
+    const onSubmitHandel = async (data, flag) => {
+        if (verifyRequestData(data, flag)) {
+            if (flag === 0) {
+                dispath({ type: "initverifyUserNameandMobileNo" });
+                const { status, data: resdata, message, } = await veirfyUsernameandMobileNo(data?.userName.toLowerCase(), data?.mobileno, screenFlag);
+                if (status === "0") {
+                    dispath({
+                        type: "verifyUserNameandMobileNoSuccess",
+                        payload: {
+                            requestCd: String(resdata?.TRAN_CD ?? ""),
+                            username: data?.userName,
+                            auth_type: resdata?.AUTH_TYPE,
+                            company_ID: resdata?.COMP_CD,
+                            branch_cd: resdata?.BRANCH_CD,
+                            otpValidFor: resdata?.OTP_VALID,
+                        },
+                    });
+                    setOpen(true);
+                }
+                else {
+                    dispath({
+                        type: "verifyUserNameandMobileNoFailed",
+                        payload: {
+                            isApiError: true,
+                            apierrorMessage: message,
+                        },
+                    });
+                }
+            }
+            else if (flag === 1) {
+                dispath({ type: "initverifyPasswordSetReq" });
+                const { status, data: resdata, message, } = await updatenewPassword(loginState?.requestCd, loginState?.username, data?.password);
+                if (status === "0") {
+                    dispath({ type: "passwordRegistaredSuccess" });
+                    enqueueSnackbar("Password successfully reset", {
+                        variant: "success",
+                    });
+                    navigate("login");
+                }
+                else if (status === "99") {
+                    dispath({
+                        type: "verifyPasswordFailed",
+                        payload: {
+                            isApiError: true,
+                            apierrorMessage: message,
+                        },
+                    });
+                }
+                else {
+                    enqueueSnackbar(message, {
+                        variant: "error",
+                    });
+                    navigate("login");
+                }
+            }
+        }
+    };
+    const verifyRequestData = (data, flag) => {
+        if (flag === 0) {
+            let validationData = {
+                isUsernameError: false,
+                isMobileError: false,
+                userMessageforusername: "",
+                userMessageforMobileno: "",
+            };
+            if (!Boolean(data.userName)) {
+                validationData.isUsernameError = true;
+                validationData.userMessageforusername = "UsernameisRequired";
+            }
+            if (!Boolean(data.mobileno)) {
+                validationData.isMobileError = true;
+                validationData.userMessageforMobileno = "MobileNoisRequired";
+            }
+            else if (isNaN(data.mobileno) ||
+                (data.mobileno.length !== 10 && data.mobileno.length !== 13)) {
+                validationData.isMobileError = true;
+                validationData.userMessageforMobileno = "Please enter valid Mobile No.";
+            }
+            dispath({
+                type: "verifyUserNameandMobileNoFailed",
+                payload: validationData,
+            });
+            return !(validationData.isMobileError || validationData.isUsernameError);
+        }
+        else if (flag === 1) {
+            let validationData = {
+                isPasswordError: false,
+                userMessageforPassword: "",
+                isConfirmPasswordError: false,
+                userMessageforconfirmPassword: "",
+            };
+            let pwdverify = utilFunction.ValidatePassword(data.password);
+            if (Boolean(pwdverify)) {
+                validationData.isPasswordError = true;
+                validationData.userMessageforPassword = pwdverify;
+            }
+            if (!Boolean(data.confirmpassword)) {
+                validationData.isConfirmPasswordError = true;
+                validationData.userMessageforconfirmPassword =
+                    "Confirmpasswordisrequired";
+            }
+            else if (Boolean(data.password) &&
+                data.password !== data.confirmpassword) {
+                validationData.isConfirmPasswordError = true;
+                validationData.userMessageforconfirmPassword =
+                    "New Password and Confirm Password did not matched";
+            }
+            dispath({
+                type: "verifyPasswordFailed",
+                payload: validationData,
+            });
+            return !(validationData.isConfirmPasswordError || validationData.isPasswordError);
+        }
+        return true;
+    };
+    const handleClose = () => {
+        setOpen(false);
+    };
+    const VerifyOTP = async (OTPNumber) => {
+        if (Boolean(OTPNumber) && OTPNumber.toString().length === 6) {
+            dispath({ type: "inititateOTPVerification" });
+            const { status, data: resdata, message, } = await verifyOTPForPWDReset(loginState?.requestCd, loginState?.username, OTPNumber, loginState?.auth_type, screenFlag);
+            if (status === "0") {
+                if (screenFlag === "totp") {
+                    enqueueSnackbar(message, {
+                        variant: "success",
+                    });
+                    navigate("login");
+                }
+                else {
+                    dispath({
+                        type: "OTPVerificationComplate",
+                        payload: { otpmodelclose: true },
+                    });
+                }
+            }
+            else if (status === "99") {
+                dispath({
+                    type: "OTPVerificationFailed",
+                    payload: { error: message },
+                });
+            }
+            else {
+                enqueueSnackbar(message, {
+                    variant: "error",
+                });
+                navigate("login");
+            }
+        }
+        else {
+            dispath({
+                type: "OTPVerificationFailed",
+                payload: { error: "Please enter a 6 digit OTP number" },
+            });
+        }
+    };
+    // useEffect(() => {
+    //   GeneralAPI.setDocumentName("Password Reset");
+    // }, []);
+    return (jsx(Fragment$1, { children: jsxs(Grid, { container: true, style: { height: "100vh", overflow: "hidden" }, children: [jsx(BankDetails, { bannerDetails: bannerDetails }), jsxs(Grid, { item: true, xs: 6, md: 6, lg: 6, sm: 6, children: [jsx(Grid, { container: true, direction: "row", justifyContent: "flex-end", alignItems: "center", padding: "31px", children: jsx("img", { src: logoUrl, alt: "Logo" }) }), jsx(Grid, { container: true, direction: "row", justifyContent: "flex-end", alignItems: "center", padding: "0 35px 0 0", children: jsx(LanguageComponent, {}) }), jsx(Container, { maxWidth: "xs", children: jsxs(Grid, { alignItems: "center", style: { paddingTop: "20px" }, children: [jsx("h2", { style: { margin: "10px 0" }, children: loginState.workingState === 1
+                                            ? t("Setnewpassword")
+                                            : screenFlag === "totp"
+                                                ? "Forgot TOTP"
+                                                : t("ForgotPassword") }), open ? (jsx(OTPModelForm, { classes: classes, handleClose: handleClose, loginState: loginState, VerifyOTP: VerifyOTP, OTPError: t(loginState?.OtpuserMessage ?? ""), setOTPError: (error) => {
+                                            dispath({
+                                                type: "OTPVerificationFailed",
+                                                payload: { error: error },
+                                            });
+                                        }, resendFlag: "FORGET_PW", setNewRequestID: (newRequestID) => {
+                                            dispath({
+                                                type: "OTPResendSuccess",
+                                                payload: { requestCd: newRequestID },
+                                            });
+                                            otpResendRef.current = otpResendRef.current + 1;
+                                        }, otpresendCount: otpResendRef.current, OTPResendRequest: undefined })) : (jsx(ForgotPasswordFields, { classes: classes, loginState: loginState, onSubmit: onSubmitHandel }))] }) })] })] }) }));
+};
+
+export { AuthControllerWrapper, ForgotPasswordControllerWrapper };
 //# sourceMappingURL=index.js.map