Files
pedwfrontend/pages/auth/signin.js
T

202 lines
9.0 KiB
JavaScript

import { getCsrfToken } from "next-auth/react";
import useTranslation from "next-translate/useTranslation";
import Head from "next/head";
import { useState } from "react";
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";
const SignIn = (props) => {
let { t, lang } = useTranslation();
const { footerLinks, pages, csrfToken, callbackUrl } = props;
let formURL =
new URL(window.location.href).protocol +
"//" +
new URL(window.location.href).hostname +
":" +
new URL(window.location.href).port +
"/api/auth/signin/email";
const [buttonDisabled, setButtonDisabled] = useState(false);
const handleSubmit = async (event) => {
event.preventDefault();
setButtonDisabled(true);
event.target.submit();
};
return (
<div>
<Head>
<title>
{t("auth:auth-page-title")} - {t("common:service-name")}
</title>
</Head>
<div id="page_wrapper">
<CookieBanner />
<Header />
<div className="govuk-width-container govuk-!-padding-bottom-9">
<Breadcrumbs />
<ServiceBanner noSignin={true} />
<main
className="govuk-main-wrapper govuk-main-wrapper--auto-spacing "
id="signin"
role="main"
>
<div className="govuk-grid-row">
<div className="govuk-grid-column-full">
<div className="card">
<div className="card-body">
<div className="govuk-body-m">
<legend className="govuk-fieldset__legend govuk-fieldset__legend--l">
<h1 className="govuk-fieldset__heading govuk-heading-m">
{t("auth:auth-page-title")}{" "}
</h1>
</legend>
<div className="govuk-grid-row">
<div className="govuk-grid-column-two-thirds ">
<form
method="post"
action="/api/auth/signin/email"
onSubmit={handleSubmit}
>
<div
className={
"govuk-form-group "
}
>
<input
className="govuk-input"
name="csrfToken"
type="hidden"
defaultValue={
csrfToken
}
/>
<input
className="govuk-input"
name="callbackUrl"
type="hidden"
defaultValue={
callbackUrl
}
/>
<label
className="govuk-label"
htmlFor="email"
>
{t(
"auth:auth-email-label"
)}
</label>
<input
className="govuk-input govuk-!-width-three-quarters"
type="email"
id="email"
name="email"
/>
</div>
<div className="govuk-form-group">
<button
type="submit"
className="govuk-button"
disabled={
buttonDisabled
}
>
{t(
"auth:auth-signin-button-label"
)}
</button>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</main>
</div>
<Footer footerLinks={footerLinks} ticketnumber={props} />
</div>
</div>
);
};
export async function getServerSideProps(context) {
if (process.env.SHOWLOGIN == false) {
return {
redirect: {
destination: "/404",
permanent: false,
},
};
}
const csrfToken = await getCsrfToken(context);
console.log(
"\n//////////////////////\n",
"Sign in callbackurl: " + context.query.callbackUrl,
context.locale,
"\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 appendParamsAndPathToNewUrl = (fromUrl, toUrl) => {
const fromUrlObj = new URL(fromUrl); // Parse the source URL
const params = fromUrlObj.searchParams; // Extract the query parameters
const toUrlObj = new URL(toUrl); // Parse the new domain URL
toUrlObj.pathname = fromUrlObj.pathname; // Copy the path from the source URL
// Append the query parameters to the new URL
params.forEach((value, key) =>
toUrlObj.searchParams.append(key, value)
);
return toUrlObj.toString(); // Return the full new URL as a string
};
formURL = appendParamsAndPathToNewUrl(context.query.callbackUrl, formURL);
const url = new URL(formURL); // base URL
const params = new URLSearchParams(url.search);
params.append("locale", context.locale);
url.search = params.toString();
console.log("========== callback: ", url.toString());
return {
props: { csrfToken: csrfToken, callbackUrl: url.toString() },
};
}
export default SignIn;