import { getCsrfToken } from "next-auth/react"; import useTranslation from "next-translate/useTranslation"; import Head from "next/head"; import Breadcrumbs from "../../components/breadcrumbs"; import CookieBanner from "../../components/cookieBanner"; import Footer from "../../components/footer"; import Header from "../../components/header"; import ServiceBanner from "../../components/servicebanner"; import { useRouter } from "next/router"; import { useState, useEffect } from "react"; const SignIn = (props) => { let { t, lang } = useTranslation(); const router = useRouter(); const { query } = router; const { footerLinks, pages, csrfToken, callbackUrl } = props; const [formData, setFormData] = useState({ email: query.email || "", callbackUrl: "", csrfToken: "", }); const [submitForm, setSubmitForm] = useState(false); const [buttonDisabled, setButtonDisabled] = useState(false); const [response, setResponse] = useState(null); const handleInputChange = (e) => { const { name, value } = e.target; setFormData((prevState) => ({ ...prevState, [name]: value })); }; // useEffect(() => { // // Populate form fields if query params exist // if (query.email) // setFormData((prev) => ({ ...prev, email: query.email })); // if (query.email) { // handleSubmit(); // Trigger the form submission // } // }, [query]); // const handleSubmit = async () => { // setButtonDisabled(true); // Disable the submit button to avoid multiple submissions // // Wait a short moment before programmatically submitting the form // setTimeout(() => { // const form = document.getElementById("signin-form"); // Get form by ID // if (form) { // form.submit(); // Submit the form // } // }, 500); // Short delay to ensure form is populated before submission // }; const handleSubmit = async (event) => { event.preventDefault(); setButtonDisabled(true); // Disable the submit button to avoid multiple submissions try { const res = await fetch("/api/auth/signin/emailAPI", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify(formData), }); const data = await res.json(); setResponse(data); // Update response state } catch (error) { console.error("Error submitting the form:", error); } }; // Trigger form submission automatically when data is ready useEffect(() => { // Check if email exists and form data is populated if (query.email && !response) { setFormData((prevState) => ({ ...prevState, csrfToken: csrfToken, callbackUrl: callbackUrl || prevState.callbackUrl, // Ensure callback URL is set })); } }, [query.email, csrfToken, callbackUrl, response]); useEffect(() => { // Automatically submit the form when data is ready if (formData.email && formData.csrfToken && !response) { handleSubmit(new Event("submit")); } }, [formData, response]); // Handle redirection after form submission based on response useEffect(() => { if (response && response.url) { // Redirect to the URL in the response router.push(response.url); } }, [response, router]); return (

Sign in

Sign in

Email address

); }; export async function getServerSideProps(context) { const { query, req, res } = context; // Load allowed IPs from env and trim spaces const ALLOWED_IPS = process.env.ALLOWED_IPS ? process.env.ALLOWED_IPS.split(",").map((ip) => ip.trim()) : []; // Always allow localhost addresses const LOCALHOST_IPS = ["127.0.0.1", "::1"]; // Get IP address from headers or socket const forwarded = req.headers["x-forwarded-for"]; const ip = typeof forwarded === "string" ? forwarded.split(",")[0] : req.socket.remoteAddress; console.log("Visitor IP:", ip); // Check whitelist + localhost if (![...ALLOWED_IPS, ...LOCALHOST_IPS].includes(ip)) { return { redirect: { destination: "/403", // custom "Access Denied" page permanent: false, }, }; } if (process.env.SHOWLOGIN == false) { return { redirect: { destination: "/404", permanent: false, }, }; } const csrfToken = await getCsrfToken(context); console.log( "\n//////////////////////\n", "Sign in callbackurl: " + context.req.headers.host, context.locale, csrfToken + "\n//////////////////////\n" ); let formURL = context.req.headers.host; console.log("formUrl:", formURL); formURL = typeof formURL == "undefined" ? null : formURL; let protocol = "http"; if (context.req.headers["x-forwarded-proto"]) { protocol = context.req.headers["x-forwarded-proto"]; } // Otherwise, check if the connection is encrypted (for https) else if (context.req.connection.encrypted) { protocol = "https"; } formURL = protocol + "://" + formURL; console.log("Protocol:", protocol); console.log("locale:", context.locale); const url = new URL(formURL); // base URL const params = new URLSearchParams(url.search); params.append("locale", context.locale); url.search = params.toString(); return { props: { csrfToken: csrfToken, callbackUrl: url.toString() }, }; } export default SignIn;