@nibssplc/cams-sdk-react 0.0.1-beta.68 → 0.0.1-beta.70

package/dist/components/MFAOptions.d.ts

@@ -1,6 +1,7 @@
 interface MFAOptionsProps {
     onComplete?: (success: boolean) => void;
+    onAuthFailed?: () => void;
     MFAEndpoint?: string;
 }
-declare const MFAOptions: ({ onComplete, MFAEndpoint }?: MFAOptionsProps) => import("react/jsx-runtime").JSX.Element;
+declare const MFAOptions: ({ onComplete, onAuthFailed, MFAEndpoint }?: MFAOptionsProps) => import("react/jsx-runtime").JSX.Element;
 export default MFAOptions;

package/dist/index.cjs.js

@@ -301,7 +301,6 @@ function useCAMSMSALAuth(options) {
                             setRequiresMFA(true);
                         }
                         console.log("App Code >>>", options.appCode);
-                        console.log("MFA Endpoint >>>", options.MFAEndpoint);
                     }
                     else {
                         localStorage.removeItem(storageKey);
@@ -1739,7 +1738,7 @@ var useOTPHandler = function (_a) {
 };
 
 var MFAOptions = function (_a) {
-    var _b = _a === void 0 ? {} : _a, onComplete = _b.onComplete, MFAEndpoint = _b.MFAEndpoint;
+    var _b = _a === void 0 ? {} : _a, onComplete = _b.onComplete, onAuthFailed = _b.onAuthFailed, MFAEndpoint = _b.MFAEndpoint;
     var _c = React.useState(""), value = _c[0], setValue = _c[1];
     var _d = React.useState(false), otpVisible = _d[0], setOtpVisible = _d[1];
     var _e = React.useState(false), showSuccessAnimation = _e[0], setShowSuccessAnimation = _e[1];
@@ -1748,7 +1747,9 @@ var MFAOptions = function (_a) {
     var context = useCAMSContext();
     var _h = context.authMode === "MSAL" && "sendEmailOTP" in context
         ? context
-        : { sendEmailOTP: null, completeMFA: null }, sendEmailOTP = _h.sendEmailOTP, completeMFA = _h.completeMFA;
+        : { sendEmailOTP: null, completeMFA: null, logout: function () { return __awaiter(void 0, void 0, void 0, function () { return __generator(this, function (_a) {
+                return [2 /*return*/];
+            }); }); } }, sendEmailOTP = _h.sendEmailOTP, completeMFA = _h.completeMFA, logout = _h.logout;
     var accessToken = context.authMode === "MSAL" ? context.accessToken : "";
     var idToken = context.authMode === "MSAL" ? context.idToken : "";
     var _j = useOTPHandler({
@@ -1758,39 +1759,30 @@ var MFAOptions = function (_a) {
         appCode: context.appCode || "",
         authenticationType: authType,
         MFAEndpoint: MFAEndpoint,
-        onAuthComplete: function (state, data) { return __awaiter(void 0, void 0, void 0, function () {
-            var error_1;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        if (!state) return [3 /*break*/, 5];
-                        if (!(completeMFA && authType && lastOTPCode)) return [3 /*break*/, 4];
-                        _a.label = 1;
-                    case 1:
-                        _a.trys.push([1, 3, , 4]);
-                        return [4 /*yield*/, completeMFA(lastOTPCode, authType)];
-                    case 2:
-                        _a.sent();
-                        return [3 /*break*/, 4];
-                    case 3:
-                        error_1 = _a.sent();
-                        console.error("Failed to complete MFA:", error_1);
-                        return [3 /*break*/, 4];
-                    case 4:
-                        setShowSuccessAnimation(true);
-                        sonner.toast.success(jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2 text-sm text-green-600 bg-green-50 p-3 rounded-lg", children: [jsxRuntimeExports.jsx(lucideReact.ShieldCheck, { className: "w-4 h-4" }), jsxRuntimeExports.jsx("span", { children: "Multi-Factor Authentication Successful" })] }));
-                        setTimeout(function () { return onComplete === null || onComplete === void 0 ? void 0 : onComplete(true); }, 2000);
-                        return [3 /*break*/, 6];
-                    case 5:
-                        sonner.toast.error(jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2 text-sm text-red-600 bg-red-50 p-3 rounded-lg", children: [jsxRuntimeExports.jsx(lucideReact.ShieldClose, { className: "w-4 h-4" }), jsxRuntimeExports.jsx("span", { children: (data === null || data === void 0 ? void 0 : data.message) || "Invalid code. Please try again." })] }));
-                        if (isMaxAttemptsReached) {
-                            setTimeout(function () { return onComplete === null || onComplete === void 0 ? void 0 : onComplete(false); }, 1000);
-                        }
-                        _a.label = 6;
-                    case 6: return [2 /*return*/];
+        onAuthComplete: function (state, data) {
+            if (state) {
+                // Call completeMFA to update context state
+                if (completeMFA && authType && lastOTPCode) {
+                    completeMFA(lastOTPCode, authType).catch(function (error) {
+                        console.error("Failed to complete MFA:", error);
+                    });
+                }
+                setShowSuccessAnimation(true);
+                sonner.toast.success(jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2 text-sm text-green-600 bg-green-50 p-3 rounded-lg", children: [jsxRuntimeExports.jsx(lucideReact.ShieldCheck, { className: "w-4 h-4" }), jsxRuntimeExports.jsx("span", { children: "Multi-Factor Authentication Successful" })] }));
+                setTimeout(function () { return onComplete === null || onComplete === void 0 ? void 0 : onComplete(true); }, 2000);
+            }
+            else {
+                sonner.toast.error(jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2 text-sm text-red-600 bg-red-50 p-3 rounded-lg", children: [jsxRuntimeExports.jsx(lucideReact.ShieldClose, { className: "w-4 h-4" }), jsxRuntimeExports.jsx("span", { children: (data === null || data === void 0 ? void 0 : data.message) || "Invalid code. Please try again." })] }));
+                if (isMaxAttemptsReached) {
+                    setTimeout(function () {
+                        logout().then(function () {
+                            onAuthFailed === null || onAuthFailed === void 0 ? void 0 : onAuthFailed();
+                            onComplete === null || onComplete === void 0 ? void 0 : onComplete(false);
+                        });
+                    }, 1000);
                 }
-            });
-        }); },
+            }
+        },
     }), handleSubmitOTP = _j.handleSubmitOTP, loading = _j.loading, setLoading = _j.setLoading, attemptCount = _j.attemptCount, remainingAttempts = _j.remainingAttempts, isMaxAttemptsReached = _j.isMaxAttemptsReached, resetAttempts = _j.resetAttempts;
     var handleGoBack = function () {
         setAuthType(null);
@@ -1838,18 +1830,18 @@ var MFAOptions = function (_a) {
                 setAuthType(null);
                 setOtpVisible(false);
                 setValue("");
-            }, children: jsxRuntimeExports.jsxs(DialogContent, { className: "space-y-2", children: [jsxRuntimeExports.jsx("div", { className: "absolute top-0 left-0 right-0 h-1 bg-gradient-to-r from-lime-400 to-emerald-600" }), jsxRuntimeExports.jsx(DialogHeader, { className: "w-full", children: jsxRuntimeExports.jsx(DialogTitle, { className: "text-center", children: "Email OTP" }) }), jsxRuntimeExports.jsxs("div", { className: "space-y-6", children: [jsxRuntimeExports.jsx(GenericOTPVerifier, { value: value, setValue: setValue, isDisabled: loading || isMaxAttemptsReached, onChangeOTP: function (code) {
+            }, children: jsxRuntimeExports.jsxs(DialogContent, { className: "space-y-2 w-[425px] max-w-[80%]", children: [jsxRuntimeExports.jsx("div", { className: "absolute top-0 left-0 right-0 h-1 bg-gradient-to-r from-lime-400 to-emerald-600" }), jsxRuntimeExports.jsx(DialogHeader, { className: "w-full", children: jsxRuntimeExports.jsx(DialogTitle, { className: "text-center", children: "Email OTP" }) }), jsxRuntimeExports.jsxs("div", { className: "space-y-6", children: [jsxRuntimeExports.jsx(GenericOTPVerifier, { value: value, setValue: setValue, isDisabled: loading || isMaxAttemptsReached, onChangeOTP: function (code) {
                                     setLastOTPCode(code);
                                     return handleSubmitOTP(code);
                                 }, fieldName: "EmailOTP", attemptCount: attemptCount, remainingAttempts: remainingAttempts, isMaxAttemptsReached: isMaxAttemptsReached }), jsxRuntimeExports.jsx(Button, { variant: "ghost", className: "w-full text-sm", onClick: handleGoBack, children: "\u2190 Choose different method" })] })] }) }));
     }
     else if (authType === "AuthenticatorCode") {
-        content = (jsxRuntimeExports.jsx(Dialog, { open: otpVisible, onOpenChange: handleGoBack, children: jsxRuntimeExports.jsxs(DialogContent, { className: "space-y-2", children: [jsxRuntimeExports.jsx("div", { className: "absolute top-0 left-0 right-0 h-1 bg-gradient-to-r from-lime-400 to-emerald-600" }), jsxRuntimeExports.jsx(DialogHeader, { className: "w-full", children: jsxRuntimeExports.jsx(DialogTitle, { className: "text-center", children: "Authenticator App" }) }), loading ? (jsxRuntimeExports.jsx("div", { className: "p-3 h-full flex justify-center items-center", children: jsxRuntimeExports.jsx(LoadingSpinner, {}) })) : (jsxRuntimeExports.jsxs("div", { className: "space-y-6", children: [jsxRuntimeExports.jsx(CardDescription, { className: "text-sm text-gray-600 text-center", children: "Enter the 6-digit Code from your Authenticator app" }), jsxRuntimeExports.jsx(GenericOTPVerifier, { value: value, setValue: setValue, isDisabled: loading || isMaxAttemptsReached, onChangeOTP: function (code) {
+        content = (jsxRuntimeExports.jsx(Dialog, { open: otpVisible, onOpenChange: handleGoBack, children: jsxRuntimeExports.jsxs(DialogContent, { className: "space-y-2 w-[425px] max-w-[80%]", children: [jsxRuntimeExports.jsx("div", { className: "absolute top-0 left-0 right-0 h-1 bg-gradient-to-r from-lime-400 to-emerald-600" }), jsxRuntimeExports.jsx(DialogHeader, { className: "w-full", children: jsxRuntimeExports.jsx(DialogTitle, { className: "text-center", children: "Authenticator App" }) }), loading ? (jsxRuntimeExports.jsx("div", { className: "p-3 h-full flex justify-center items-center", children: jsxRuntimeExports.jsx(LoadingSpinner, {}) })) : (jsxRuntimeExports.jsxs("div", { className: "space-y-6", children: [jsxRuntimeExports.jsx(CardDescription, { className: "text-sm text-gray-600 text-center", children: "Enter the 6-digit Code from your Authenticator app" }), jsxRuntimeExports.jsx(GenericOTPVerifier, { value: value, setValue: setValue, isDisabled: loading || isMaxAttemptsReached, onChangeOTP: function (code) {
                                     setLastOTPCode(code);
                                     return handleSubmitOTP(code);
                                 }, fieldName: "AuthenticatorCode", attemptCount: attemptCount, remainingAttempts: remainingAttempts, isMaxAttemptsReached: isMaxAttemptsReached }), jsxRuntimeExports.jsx(Button, { variant: "ghost", className: "w-full text-sm", onClick: handleGoBack, children: "\u2190 Choose different method" })] }))] }) }));
     }
-    return (jsxRuntimeExports.jsx("div", { className: "flex justify-center items-center h-dvh", children: jsxRuntimeExports.jsxs(Card, { className: "mx-auto sm:max-w-[425px] max-w-[80%] space-y-6 p-6 bg-white rounded-lg shadow-md", children: [jsxRuntimeExports.jsxs(CardHeader, { children: [jsxRuntimeExports.jsx("div", { className: "flex justify-center items", children: jsxRuntimeExports.jsx("img", { src: OTPAuthenticationImg, alt: "NIBSS Logo", width: 365, height: 365 }) }), jsxRuntimeExports.jsx(CardTitle, { className: "text-3xl font-bold mb-6 text-center", children: "Two-Factor Authentication" }), jsxRuntimeExports.jsx(CardTitle, { className: "text-gray-300 text-base -tracking-wide text-center", children: "Your Microsoft account has been validated. Please complete two-factor authentication to continue." })] }), jsxRuntimeExports.jsx(CardContent, { children: content }), jsxRuntimeExports.jsxs(CardFooter, { className: "flex items-center justify-center mt-6 space-x-2 text-gray-400 text-sm", children: [jsxRuntimeExports.jsx(lucideReact.ShieldCheck, { className: "w-4 h-4 text-[#506f4a] pulse-glow" }), jsxRuntimeExports.jsx("span", { children: "Powered By NIBSS" })] })] }) }));
+    return (jsxRuntimeExports.jsx("div", { className: "flex justify-center items-center h-dvh", children: jsxRuntimeExports.jsxs(Card, { className: "space-y-6 p-6 rounded-lg shadow-md", children: [jsxRuntimeExports.jsxs(CardHeader, { children: [jsxRuntimeExports.jsx("div", { className: "flex justify-center items", children: jsxRuntimeExports.jsx("img", { src: OTPAuthenticationImg, alt: "NIBSS Logo", width: 365, height: 365 }) }), jsxRuntimeExports.jsx(CardTitle, { className: "text-3xl font-bold mb-6 text-center", children: "Two-Factor Authentication" }), jsxRuntimeExports.jsx(CardTitle, { className: "text-gray-300 text-base -tracking-wide text-center", children: "Your Microsoft account has been validated. Please complete two-factor authentication to continue." })] }), jsxRuntimeExports.jsx(CardContent, { children: content }), jsxRuntimeExports.jsxs(CardFooter, { className: "flex items-center justify-center mt-6 space-x-2 text-gray-400 text-sm", children: [jsxRuntimeExports.jsx(lucideReact.ShieldCheck, { className: "w-4 h-4 text-[#506f4a] pulse-glow" }), jsxRuntimeExports.jsx("span", { children: "Powered By NIBSS" })] })] }) }));
 };
 
 var LoginButton = function () {
@@ -1875,6 +1867,7 @@ var MFAGate = function (_a) {
     if (!urlValidation.success) {
         throw new Error("Invalid MFAEndpoint: ".concat(urlValidation.error.issues[0].message));
     }
+    console.log("MFA Endpoint >>>", MFAEndpoint);
     // Only apply MFA gate for MSAL mode
     if (context.authMode !== "MSAL") {
         return jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: children });
@@ -1888,7 +1881,16 @@ var MFAGate = function (_a) {
                 if (!success) {
                     console.error("MFA authentication failed");
                 }
-            } }));
+            }, onAuthFailed: function () { return __awaiter(void 0, void 0, void 0, function () {
+                return __generator(this, function (_a) {
+                    switch (_a.label) {
+                        case 0: return [4 /*yield*/, context.logout()];
+                        case 1:
+                            _a.sent();
+                            return [2 /*return*/];
+                    }
+                });
+            }); } }));
     }
     if (!isAuthenticated) {
         return fallback || (LoginComponent ? jsxRuntimeExports.jsx(LoginComponent, {}) : jsxRuntimeExports.jsx(LoginButton, {}));