@nibssplc/cams-sdk-react 0.0.1-beta.103 → 0.0.1-beta.105
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/DefaultLoginPage.d.ts +3 -1
- package/dist/components/MFAGate.d.ts +3 -1
- package/dist/hooks/useOTPHandler.d.ts +1 -1
- package/dist/index.cjs.js +120 -30
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +120 -30
- package/dist/index.esm.js.map +1 -1
- package/package.json +1 -1
package/dist/index.esm.js
CHANGED
|
@@ -1848,6 +1848,81 @@ var useOTPHandler = function (_a) {
|
|
|
1848
1848
|
remainingAttempts: MAX_ATTEMPTS - attemptCount,
|
|
1849
1849
|
};
|
|
1850
1850
|
};
|
|
1851
|
+
var CredentialsHandler = function (credentials, appCode, CredAuthEndpoint, onAuthComplete) {
|
|
1852
|
+
var _a = useState(false), loading = _a[0], setLoading = _a[1];
|
|
1853
|
+
var _b = useState(0), attemptCount = _b[0], setAttemptCount = _b[1];
|
|
1854
|
+
var _c = useState(false), isMaxAttemptsReached = _c[0], setIsMaxAttemptsReached = _c[1];
|
|
1855
|
+
var handleSubmitCredentials = useMemo(function () {
|
|
1856
|
+
return function (_a) { return __awaiter(void 0, [_a], void 0, function (_b) {
|
|
1857
|
+
var currentAttempt, response, error_2, currentAttempt;
|
|
1858
|
+
var username = _b.username, password = _b.password, MFACode = _b.MFACode, appCode = _b.appCode;
|
|
1859
|
+
return __generator(this, function (_c) {
|
|
1860
|
+
switch (_c.label) {
|
|
1861
|
+
case 0:
|
|
1862
|
+
_c.trys.push([0, 2, 3, 4]);
|
|
1863
|
+
setLoading(true);
|
|
1864
|
+
currentAttempt = attemptCount + 1;
|
|
1865
|
+
setAttemptCount(currentAttempt);
|
|
1866
|
+
return [4 /*yield*/, axios.post(CredAuthEndpoint, {
|
|
1867
|
+
username: username,
|
|
1868
|
+
password: password,
|
|
1869
|
+
MFACode: MFACode,
|
|
1870
|
+
appCode: appCode,
|
|
1871
|
+
}, {
|
|
1872
|
+
headers: {
|
|
1873
|
+
"X-Device-ID": GenerateDeviceId(),
|
|
1874
|
+
},
|
|
1875
|
+
timeout: 605000,
|
|
1876
|
+
})];
|
|
1877
|
+
case 1:
|
|
1878
|
+
response = (_c.sent()).data;
|
|
1879
|
+
if (response) {
|
|
1880
|
+
onAuthComplete(true, response);
|
|
1881
|
+
return [2 /*return*/, true];
|
|
1882
|
+
}
|
|
1883
|
+
else {
|
|
1884
|
+
if (currentAttempt >= MAX_ATTEMPTS) {
|
|
1885
|
+
setIsMaxAttemptsReached(true);
|
|
1886
|
+
onAuthComplete(false, {
|
|
1887
|
+
message: "Maximum attempts reached",
|
|
1888
|
+
});
|
|
1889
|
+
}
|
|
1890
|
+
else {
|
|
1891
|
+
onAuthComplete(false, response.response.data);
|
|
1892
|
+
}
|
|
1893
|
+
return [2 /*return*/, false];
|
|
1894
|
+
}
|
|
1895
|
+
case 2:
|
|
1896
|
+
error_2 = _c.sent();
|
|
1897
|
+
console.error(error_2);
|
|
1898
|
+
currentAttempt = attemptCount + 1;
|
|
1899
|
+
if (currentAttempt >= MAX_ATTEMPTS) {
|
|
1900
|
+
setIsMaxAttemptsReached(true);
|
|
1901
|
+
onAuthComplete(false, error_2.response.data);
|
|
1902
|
+
}
|
|
1903
|
+
else {
|
|
1904
|
+
onAuthComplete(false, error_2.response.data);
|
|
1905
|
+
}
|
|
1906
|
+
onAuthComplete(false, error_2.response.data);
|
|
1907
|
+
return [2 /*return*/, false];
|
|
1908
|
+
case 3:
|
|
1909
|
+
setLoading(false);
|
|
1910
|
+
return [7 /*endfinally*/];
|
|
1911
|
+
case 4: return [2 /*return*/];
|
|
1912
|
+
}
|
|
1913
|
+
});
|
|
1914
|
+
}); };
|
|
1915
|
+
}, [credentials.username, credentials.password, credentials.MFACode]);
|
|
1916
|
+
return {
|
|
1917
|
+
handleSubmitCredentials: handleSubmitCredentials,
|
|
1918
|
+
loading: loading,
|
|
1919
|
+
setLoading: setLoading,
|
|
1920
|
+
attemptCount: attemptCount,
|
|
1921
|
+
isMaxAttemptsReached: isMaxAttemptsReached,
|
|
1922
|
+
// resetAttempts,
|
|
1923
|
+
remainingAttempts: MAX_ATTEMPTS - attemptCount,
|
|
1924
|
+
};
|
|
1925
|
+
};
|
|
1851
1926
|
|
|
1852
1927
|
var MFAOptions = function (_a) {
|
|
1853
1928
|
var onComplete = _a.onComplete, onAuthFailed = _a.onAuthFailed, MFAEndpoints = _a.MFAEndpoints, usePassKey = _a.usePassKey;
|
|
@@ -1866,11 +1941,10 @@ var MFAOptions = function (_a) {
|
|
|
1866
1941
|
var authenticate = useWebAuthn().authenticate;
|
|
1867
1942
|
var handleFIDOLogin = function () { return __awaiter(void 0, void 0, void 0, function () {
|
|
1868
1943
|
var options, assertionResponse, error_1;
|
|
1869
|
-
|
|
1870
|
-
|
|
1871
|
-
switch (_g.label) {
|
|
1944
|
+
return __generator(this, function (_a) {
|
|
1945
|
+
switch (_a.label) {
|
|
1872
1946
|
case 0:
|
|
1873
|
-
|
|
1947
|
+
_a.trys.push([0, 4, , 5]);
|
|
1874
1948
|
// 1. Fetch authentication challenge from your server
|
|
1875
1949
|
console.log("Requesting authentication challenge from server...");
|
|
1876
1950
|
return [4 /*yield*/, axios.post(MFAEndpoints.RetrieveAuthChallenge, {}, {
|
|
@@ -1880,16 +1954,13 @@ var MFAOptions = function (_a) {
|
|
|
1880
1954
|
},
|
|
1881
1955
|
})];
|
|
1882
1956
|
case 1:
|
|
1883
|
-
options = (
|
|
1957
|
+
options = (_a.sent()).data;
|
|
1884
1958
|
console.log("Received challenge:", options);
|
|
1885
1959
|
// 2. Call the SDK to trigger the browser's passkey authentication UI
|
|
1886
1960
|
console.log("Calling SDK authenticate function...");
|
|
1887
|
-
return [4 /*yield*/, authenticate(__assign(__assign({}, options), {
|
|
1888
|
-
type: "public-key",
|
|
1889
|
-
alg: param.alg
|
|
1890
|
-
}); }), attestation: ((_b = options.attestation) === null || _b === void 0 ? void 0 : _b.toLowerCase()) || "none", authenticatorSelection: __assign(__assign({}, options.authenticatorSelection), { residentKey: ((_d = (_c = options.authenticatorSelection) === null || _c === void 0 ? void 0 : _c.residentKey) === null || _d === void 0 ? void 0 : _d.toLowerCase()) || "discouraged", userVerification: ((_f = (_e = options.authenticatorSelection) === null || _e === void 0 ? void 0 : _e.userVerification) === null || _f === void 0 ? void 0 : _f.toLowerCase()) || "preferred" }) }))];
|
|
1961
|
+
return [4 /*yield*/, authenticate(__assign(__assign({}, options), { userVerification: "discouraged" }))];
|
|
1891
1962
|
case 2:
|
|
1892
|
-
assertionResponse =
|
|
1963
|
+
assertionResponse = _a.sent();
|
|
1893
1964
|
console.log("Authentication assertion received from client:", assertionResponse);
|
|
1894
1965
|
// 3. Send the assertion back to the server for verification
|
|
1895
1966
|
console.log("Sending assertion to server for verification...");
|
|
@@ -1901,11 +1972,11 @@ var MFAOptions = function (_a) {
|
|
|
1901
1972
|
withCredentials: true, // credentials: 'include'
|
|
1902
1973
|
})];
|
|
1903
1974
|
case 3:
|
|
1904
|
-
|
|
1975
|
+
_a.sent();
|
|
1905
1976
|
toast.success("🔑 Sign-in successful!");
|
|
1906
1977
|
return [3 /*break*/, 5];
|
|
1907
1978
|
case 4:
|
|
1908
|
-
error_1 =
|
|
1979
|
+
error_1 = _a.sent();
|
|
1909
1980
|
console.error("Authentication failed:", error_1);
|
|
1910
1981
|
toast.error("❌ Could not sign in.");
|
|
1911
1982
|
return [3 /*break*/, 5];
|
|
@@ -2081,17 +2152,27 @@ var ADLoginModal = function (_a) {
|
|
|
2081
2152
|
form.reset();
|
|
2082
2153
|
setMfaCode("");
|
|
2083
2154
|
};
|
|
2084
|
-
return (jsxRuntimeExports.jsx(Dialog, { open: open, onOpenChange: handleClose, children: jsxRuntimeExports.jsxs(DialogContent, { className: "sm:max-w-[
|
|
2155
|
+
return (jsxRuntimeExports.jsx(Dialog, { open: open, onOpenChange: handleClose, children: jsxRuntimeExports.jsxs(DialogContent, { className: "sm:max-w-[75%] max-w-[400px]", children: [jsxRuntimeExports.jsx(DialogHeader, { children: jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2", children: [jsxRuntimeExports.jsx(KeyIcon, { className: "w-8 h-8 text-[#506f4a]" }), jsxRuntimeExports.jsx(DialogTitle, { className: "text-2xl", children: "Sign in with AD" })] }) }), step === "credentials" ? (jsxRuntimeExports.jsx(Form, __assign({}, form, { children: jsxRuntimeExports.jsxs("form", { onSubmit: form.handleSubmit(handleCredentialsSubmit), className: "space-y-4", children: [jsxRuntimeExports.jsx(FormField, { control: form.control, name: "username", render: function (_a) {
|
|
2085
2156
|
var field = _a.field;
|
|
2086
|
-
return (jsxRuntimeExports.jsxs(FormItem, { children: [jsxRuntimeExports.jsx(FormLabel, { children: "Username" }), jsxRuntimeExports.jsx(FormControl, { children: jsxRuntimeExports.jsx(Input, __assign({ placeholder: "Enter your username" }, field)) }), jsxRuntimeExports.jsx(FormMessage, {})] }));
|
|
2157
|
+
return (jsxRuntimeExports.jsxs(FormItem, { children: [jsxRuntimeExports.jsx(FormLabel, { children: "Username" }), jsxRuntimeExports.jsx(FormControl, { children: jsxRuntimeExports.jsx(Input, __assign({ className: "h-12", placeholder: "Enter your username" }, field)) }), jsxRuntimeExports.jsx(FormMessage, {})] }));
|
|
2087
2158
|
} }), jsxRuntimeExports.jsx(FormField, { control: form.control, name: "password", render: function (_a) {
|
|
2088
2159
|
var field = _a.field;
|
|
2089
|
-
return (jsxRuntimeExports.jsxs(FormItem, { children: [jsxRuntimeExports.jsx(FormLabel, { children: "Password" }), jsxRuntimeExports.jsx(FormControl, { children: jsxRuntimeExports.jsx(Input, __assign({ type: "password", placeholder: "Enter your password" }, field)) }), jsxRuntimeExports.jsx(FormMessage, {})] }));
|
|
2160
|
+
return (jsxRuntimeExports.jsxs(FormItem, { children: [jsxRuntimeExports.jsx(FormLabel, { children: "Password" }), jsxRuntimeExports.jsx(FormControl, { children: jsxRuntimeExports.jsx(Input, __assign({ className: "h-12", type: "password", placeholder: "Enter your password" }, field)) }), jsxRuntimeExports.jsx(FormMessage, {})] }));
|
|
2090
2161
|
} }), jsxRuntimeExports.jsx(Button, { type: "submit", className: "w-full bg-[#506f4a] hover:bg-[#506f4a]/90", children: "Continue" })] }) }))) : (jsxRuntimeExports.jsxs("div", { className: "space-y-4", children: [jsxRuntimeExports.jsx(GenericOTPVerifier, { value: mfaCode, setValue: setMfaCode, setLoading: setIsLoading, isDisabled: isLoading, onChangeOTP: handleMFASubmit, fieldName: "AuthenticatorCode" }), isLoading && (jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-center gap-2 text-sm text-muted-foreground", children: [jsxRuntimeExports.jsx(Loader2, { className: "w-4 h-4 animate-spin" }), jsxRuntimeExports.jsx("span", { children: "Verifying..." })] }))] }))] }) }));
|
|
2091
2162
|
};
|
|
2092
2163
|
|
|
2093
2164
|
var DefaultLoginPage = function (_a) {
|
|
2094
|
-
var usePassKey = _a.usePassKey, MFAEndpoints = _a.MFAEndpoints, PassKeysRegisterProps = _a.PassKeysRegisterProps;
|
|
2165
|
+
var usePassKey = _a.usePassKey, useADLogin = _a.useADLogin, MFAEndpoints = _a.MFAEndpoints, CredentialsAuthEndpoint = _a.CredentialsAuthEndpoint, PassKeysRegisterProps = _a.PassKeysRegisterProps;
|
|
2166
|
+
var cardVariants = {
|
|
2167
|
+
hidden: { opacity: 0, scale: 0.8, y: 50 },
|
|
2168
|
+
visible: {
|
|
2169
|
+
opacity: 1,
|
|
2170
|
+
scale: 1,
|
|
2171
|
+
y: 0,
|
|
2172
|
+
transition: { type: "spring", duration: 0.6 },
|
|
2173
|
+
},
|
|
2174
|
+
exit: { opacity: 0, scale: 0.8, y: -50, transition: { duration: 0.3 } },
|
|
2175
|
+
};
|
|
2095
2176
|
var context = useCAMSContext();
|
|
2096
2177
|
var login = context.login, isLoading = context.isLoading, authMode = context.authMode;
|
|
2097
2178
|
var _b = useState(false), showADModal = _b[0], setShowADModal = _b[1];
|
|
@@ -2105,16 +2186,6 @@ var DefaultLoginPage = function (_a) {
|
|
|
2105
2186
|
console.warn("Regular CAMS login requires configuration");
|
|
2106
2187
|
}
|
|
2107
2188
|
};
|
|
2108
|
-
var cardVariants = {
|
|
2109
|
-
hidden: { opacity: 0, scale: 0.8, y: 50 },
|
|
2110
|
-
visible: {
|
|
2111
|
-
opacity: 1,
|
|
2112
|
-
scale: 1,
|
|
2113
|
-
y: 0,
|
|
2114
|
-
transition: { type: "spring", duration: 0.6 },
|
|
2115
|
-
},
|
|
2116
|
-
exit: { opacity: 0, scale: 0.8, y: -50, transition: { duration: 0.3 } },
|
|
2117
|
-
};
|
|
2118
2189
|
var handleRegister = function (data) { return __awaiter(void 0, void 0, void 0, function () {
|
|
2119
2190
|
var options, attestationResponse, error_1;
|
|
2120
2191
|
return __generator(this, function (_a) {
|
|
@@ -2164,11 +2235,28 @@ var DefaultLoginPage = function (_a) {
|
|
|
2164
2235
|
// variant="outline"
|
|
2165
2236
|
, {
|
|
2166
2237
|
// variant="outline"
|
|
2167
|
-
className: "w-full flex items-center justify-center cursor-pointer bg-[#506f4a] hover:bg-[#506f4a] rounded-lg border border-transparent px-5 py-8 text-base font-medium transition-colors duration-250", onClick: handleMSALLogin, disabled: isLoading, children: [jsxRuntimeExports.jsx("img", { src: MicrosoftLogo, alt: "Microsoft Logo", width: 35, height: 35 }), jsxRuntimeExports.jsx("span", { className: "ml-2", children: isLoading ? "Logging in..." : "Sign in with Microsoft" })] }),
|
|
2238
|
+
className: "w-full flex items-center justify-center cursor-pointer bg-[#506f4a] hover:bg-[#506f4a] rounded-lg border border-transparent px-5 py-8 text-base font-medium transition-colors duration-250", onClick: handleMSALLogin, disabled: isLoading, children: [jsxRuntimeExports.jsx("img", { src: MicrosoftLogo, alt: "Microsoft Logo", width: 35, height: 35 }), jsxRuntimeExports.jsx("span", { className: "ml-2", children: isLoading ? "Logging in..." : "Sign in with Microsoft" })] }), useADLogin && (jsxRuntimeExports.jsxs(Button, { className: "w-full flex items-center justify-center cursor-pointer bg-[#506f4a] hover:bg-[#506f4a] rounded-lg border border-transparent px-5 py-8 text-base font-medium transition-colors duration-250", onClick: function () { return setShowADModal(true); }, disabled: isLoading, children: [jsxRuntimeExports.jsx(KeyIcon, { className: "w-24 h-24 text-[#506f4a]" }), jsxRuntimeExports.jsx("span", { children: isLoading
|
|
2239
|
+
? "Logging in..."
|
|
2240
|
+
: "Sign in with ActiveDirectory" })] })), usePassKey && (jsxRuntimeExports.jsxs(Button, { className: "w-full flex items-center justify-center cursor-pointer bg-[#506f4a] hover:bg-[#506f4a] rounded-lg border border-transparent px-5 py-8 text-base font-medium transition-colors duration-250", onClick: function () { return handleRegister(PassKeysRegisterProps); }, disabled: isLoading, children: [jsxRuntimeExports.jsx(KeyIcon, { className: "w-12 h-12 text-[#506f4a]" }), jsxRuntimeExports.jsx("span", { children: "Create a Passkey" })] }))] }), jsxRuntimeExports.jsxs(CardFooter, { className: "flex items-center justify-center mt-6 space-x-2 text-gray-400 text-sm", children: [jsxRuntimeExports.jsx(ShieldCheck, { className: "w-4 h-4 text-[#506f4a] pulse-glow" }), jsxRuntimeExports.jsx("span", { children: "Powered By NIBSS" })] })] }) }) }, "landing"), jsxRuntimeExports.jsx(ADLoginModal, { open: showADModal, onOpenChange: setShowADModal, onLogin: function (_a) { return __awaiter(void 0, [_a], void 0, function (_b) {
|
|
2168
2241
|
var username = _b.username, password = _b.password, MFACode = _b.MFACode;
|
|
2169
2242
|
return __generator(this, function (_c) {
|
|
2170
2243
|
// Implement your AD login logic here
|
|
2171
2244
|
console.log("AD Login:", { username: username, password: password, MFACode: MFACode });
|
|
2245
|
+
// Example: await adLoginService(username, password, mfaCode);
|
|
2246
|
+
CredentialsHandler({ username: username, password: password, MFACode: MFACode }, context.appCode, CredentialsAuthEndpoint !== null && CredentialsAuthEndpoint !== void 0 ? CredentialsAuthEndpoint : "/api/auth/validate", function (state, data) { return __awaiter(void 0, void 0, void 0, function () {
|
|
2247
|
+
return __generator(this, function (_a) {
|
|
2248
|
+
console.log(data);
|
|
2249
|
+
if (state && data) {
|
|
2250
|
+
context.isAuthenticated = true;
|
|
2251
|
+
context.requiresMFA = false;
|
|
2252
|
+
context.setUserProfile({
|
|
2253
|
+
type: "AUTH_SUCCESS",
|
|
2254
|
+
userProfile: __assign({}, data),
|
|
2255
|
+
});
|
|
2256
|
+
}
|
|
2257
|
+
return [2 /*return*/];
|
|
2258
|
+
});
|
|
2259
|
+
}); });
|
|
2172
2260
|
return [2 /*return*/];
|
|
2173
2261
|
});
|
|
2174
2262
|
}); } })] }));
|
|
@@ -2191,7 +2279,7 @@ var MFAGate = function (_a) {
|
|
|
2191
2279
|
// loginComponent: LoginComponent = DefaultLoginPage,
|
|
2192
2280
|
_c = _a.usePassKey,
|
|
2193
2281
|
// loginComponent: LoginComponent = DefaultLoginPage,
|
|
2194
|
-
usePassKey = _c === void 0 ? false : _c, PassKeysRegisterProps = _a.PassKeysRegisterProps, MFAEndpoints = _a.MFAEndpoints;
|
|
2282
|
+
usePassKey = _c === void 0 ? false : _c, _d = _a.useADLogin, useADLogin = _d === void 0 ? false : _d, CredentialsAuthEndpoint = _a.CredentialsAuthEndpoint, PassKeysRegisterProps = _a.PassKeysRegisterProps, MFAEndpoints = _a.MFAEndpoints;
|
|
2195
2283
|
var context = useCAMSContext();
|
|
2196
2284
|
var validatedMFAEndpoints = useMemo(function () {
|
|
2197
2285
|
var parsed = MFAEndpointsSchema.safeParse(MFAEndpoints);
|
|
@@ -2216,8 +2304,10 @@ var MFAGate = function (_a) {
|
|
|
2216
2304
|
});
|
|
2217
2305
|
}); }, [context.logout]);
|
|
2218
2306
|
Logger.debug("MFA Endpoint >>>", { MFAEndpoints: MFAEndpoints });
|
|
2307
|
+
if (useADLogin && !CredentialsAuthEndpoint)
|
|
2308
|
+
return jsxRuntimeExports.jsx(ErrorFallback, { message: "Invalid AD Login Configuration." });
|
|
2219
2309
|
if (!validatedMFAEndpoints)
|
|
2220
|
-
return jsxRuntimeExports.jsx(ErrorFallback, { message: "Invalid MFA
|
|
2310
|
+
return jsxRuntimeExports.jsx(ErrorFallback, { message: "Invalid MFA Configuration." });
|
|
2221
2311
|
if (context.authMode !== "MSAL")
|
|
2222
2312
|
return jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: children });
|
|
2223
2313
|
if (context.isLoading)
|
|
@@ -2226,7 +2316,7 @@ var MFAGate = function (_a) {
|
|
|
2226
2316
|
return (jsxRuntimeExports.jsx(MFAOptions, { MFAEndpoints: validatedMFAEndpoints, usePassKey: usePassKey, onComplete: handleComplete, onAuthFailed: handleAuthFailed }));
|
|
2227
2317
|
}
|
|
2228
2318
|
if (!context.isAuthenticated) {
|
|
2229
|
-
return (jsxRuntimeExports.jsx(DefaultLoginPage, { usePassKey: usePassKey, MFAEndpoints: MFAEndpoints, PassKeysRegisterProps: PassKeysRegisterProps }));
|
|
2319
|
+
return (jsxRuntimeExports.jsx(DefaultLoginPage, { usePassKey: usePassKey, useADLogin: useADLogin, MFAEndpoints: MFAEndpoints, PassKeysRegisterProps: PassKeysRegisterProps, CredentialsAuthEndpoint: CredentialsAuthEndpoint }));
|
|
2230
2320
|
}
|
|
2231
2321
|
return jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: children });
|
|
2232
2322
|
};
|