awatertrevi/infisical
1
0
Fork 0
mirror of https://github.com/awatertrevi/infisical.git synced 2026-10-17 06:34:57 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: added mfa popup for all select org

Browse Source
This commit is contained in:
Sheen Capadngan
2024-10-17 22:29:38 +08:00
parent bd1ed2614e
commit 7a77dc7343
15 changed files with 223 additions and 472 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/views/Signup/components/UserInfoSSOStep/UserInfoSSOStep.tsx
+42 -12
View File
@@ -11,9 +11,11 @@ import { deriveArgonKey } from "@app/components/utilities/cryptography/crypto";
import { saveTokenToLocalStorage } from "@app/components/utilities/saveTokenToLocalStorage";
import SecurityClient from "@app/components/utilities/SecurityClient";
import { Button, Input } from "@app/components/v2";
import { useToggle } from "@app/hooks";
import { completeAccountSignup, useSelectOrganization } from "@app/hooks/api/auth/queries";
import { fetchOrganizations } from "@app/hooks/api/organization/queries";
import ProjectService from "@app/services/ProjectService";
import { Mfa } from "@app/views/Login/Mfa";
// eslint-disable-next-line new-cap
const client = new jsrp.client();
@@ -54,9 +56,11 @@ export const UserInfoSSOStep = ({
const [organizationName, setOrganizationName] = useState("");
const [organizationNameError, setOrganizationNameError] = useState(false);
const [attributionSource, setAttributionSource] = useState("");
const [shouldShowMfa, toggleShowMfa] = useToggle(false);
const [isLoading, setIsLoading] = useState(false);
const { t } = useTranslation();
const { mutateAsync: selectOrganization } = useSelectOrganization();
const [mfaSuccessCallback, setMfaSuccessCallback] = useState<() => void>(() => {});
useEffect(() => {
const randomPassword = crypto.randomBytes(32).toString("hex");
@@ -172,22 +176,37 @@ export const UserInfoSSOStep = ({
const userOrgs = await fetchOrganizations();
const orgId = userOrgs[0]?.id;
await selectOrganization({
organizationId: orgId
});
const completeSignupFlow = async () => {
try {
const { isMfaEnabled, token } = await selectOrganization({
organizationId: orgId
});
// only create example project if not joining existing org
if (!providerOrganizationName) {
const project = await ProjectService.initProject({
projectName: "Example Project"
});
if (isMfaEnabled) {
SecurityClient.setMfaToken(token);
toggleShowMfa.on();
setMfaSuccessCallback(() => completeSignupFlow);
return;
}
localStorage.setItem("projectData.id", project.id);
}
// only create example project if not joining existing org
if (!providerOrganizationName) {
const project = await ProjectService.initProject({
projectName: "Example Project"
});
localStorage.setItem("orgData.id", orgId);
localStorage.setItem("projectData.id", project.id);
}
setStep(2);
localStorage.setItem("orgData.id", orgId);
setStep(2);
} catch (error) {
setIsLoading(false);
console.error(error);
}
};
await completeSignupFlow();
} catch (error) {
setIsLoading(false);
console.error(error);
@@ -206,6 +225,17 @@ export const UserInfoSSOStep = ({
}
}, [providerOrganizationName, password]);
if (shouldShowMfa) {
return (
<Mfa
hideLogo
email={username}
successCallback={mfaSuccessCallback}
closeMfa={() => toggleShowMfa.off()}
/>
);
}
return (
<div className="mx-auto mb-36 h-full w-max rounded-xl md:mb-16 md:px-8">
<p className="text-medium mx-8 mb-6 flex justify-center bg-gradient-to-b from-white to-bunker-200 bg-clip-text text-xl font-bold text-transparent md:mx-16">