Removed disableDevtools from the security features because it was redundant with the popup feature, which caused the authentication popup to always close.
54 lines
1.7 KiB
TypeScript
54 lines
1.7 KiB
TypeScript
"use client";
|
|
|
|
import { redirect } from "next/navigation";
|
|
import React, { useEffect, useState } from "react";
|
|
import SecurityCheckup from "@/shared/auth/ui/SecurityCheckup";
|
|
import SecurityCheckupFailed from "@/shared/auth/ui/SecurityCheckupFailed";
|
|
import Signup from "../ui/Signup";
|
|
|
|
const SignupPage = () => {
|
|
/**
|
|
* Create a lit component that will be used in popp, consisting of 3 component flows:
|
|
* 1. When the user opens it, a browser environment check will be performed.
|
|
* 2. If it passes, the login component will appear and the user will perform authentication.
|
|
* 3. If it fails, stop the authentication process and display the warning component, then return the user to the homepage.
|
|
*/
|
|
const componentFlowList = {
|
|
securityCheckup: <SecurityCheckup />,
|
|
securityCheckupFailed: <SecurityCheckupFailed />,
|
|
SecurityCheckupSuccessed: <Signup />,
|
|
};
|
|
|
|
// State to set the current page component
|
|
const [componentFlow, setComponentFlow] = useState(
|
|
componentFlowList.securityCheckup
|
|
);
|
|
|
|
useEffect(() => {
|
|
/**
|
|
* Check if the window has an opener (i.e., it was opened by another window)
|
|
* If it does, the security checkup has passed.
|
|
* If it doesn't, the security checkup has failed and user will be redirected to the homepage.
|
|
*/
|
|
if (window.opener) {
|
|
setComponentFlow(componentFlowList.SecurityCheckupSuccessed);
|
|
} else {
|
|
setComponentFlow(componentFlowList.securityCheckupFailed);
|
|
|
|
const timer = setTimeout(() => {
|
|
redirect("/");
|
|
}, 5000);
|
|
return () => clearTimeout(timer);
|
|
}
|
|
}, []);
|
|
|
|
return (
|
|
<>
|
|
{/* show the current component flow */}
|
|
<main>{componentFlow}</main>
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default SignupPage;
|