robbond/pedwfrontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

added logout status 404 page and registraiton pages

Browse Source
This commit is contained in:
robbond
2021-07-27 16:50:57 +01:00
parent 6520b761bd
commit 3a88b18f85
16 changed files with 1133 additions and 566 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pages/404.js
+13
View File
@@ -0,0 +1,13 @@
// 404.js
import Link from "next/link";
export default function FourOhFour() {
return (
<>
<h1>404 - Page Not Found</h1>
<Link href="/">
<a>Go back home</a>
</Link>
</>
);
}
pages/account/changepassword.js
+15 -2
View File
@@ -37,6 +37,7 @@ const Home = (props) => {
const { appealtypes } = router.query;
const { appealType, LPAData } = props;
const [passwordUpdated, setPasswordUpdated] = useState(false);
return (
<div>
@@ -61,8 +62,20 @@ const Home = (props) => {
>
<div className="govuk-grid-row">
<div className="govuk-grid-column-two-thirds">
<h1>Change password</h1>
<ChangePassword props={props} />
{passwordUpdated == true ? (
<h1>
Your password has been changed
</h1>
) : (
<h1>Change password</h1>
)}
<ChangePassword
props={props}
setPasswordUpdated={
setPasswordUpdated
}
passwordUpdated={passwordUpdated}
/>
</div>
</div>
</main>
pages/account/personaldetails.js
+26 -12
View File
@@ -17,10 +17,8 @@ import jsonpath from "jsonpath";
import { reduxForm, formValueSelector } from "redux-form";
import PersonalDetails from "../../components/account/personaldetails";
import xpath from "xpath";
import { setAccountDetails } from "../../store/accountDetails/action";
import { getPersonalAccount } from "../../actions";
import { setLPA } from "../../store/lpa/action";
const Home = (props) => {
const { footerLinks, formData } = props;
@@ -30,7 +28,9 @@ const Home = (props) => {
const { locale } = router;
const { appealtypes } = router.query;
const { appealType, LPAData } = props;
const [personalDetailsComplete, setPersonalDetailsComplete] =
useState(false);
const [accountUpdatedComplete, setAccountUpdatedComplete] = useState(false);
return (
<div>
@@ -56,7 +56,21 @@ const Home = (props) => {
<div className="govuk-grid-row">
<div className="govuk-grid-column-two-thirds">
<h1>Your account</h1>
<PersonalDetails props={props} />
<PersonalDetails
props={props}
accountUpdatedComplete={
accountUpdatedComplete
}
personalDetailsComplete={
personalDetailsComplete
}
setPersonalDetailsComplete={
setPersonalDetailsComplete
}
setAccountUpdatedComplete={
setAccountUpdatedComplete
}
/>
</div>
</div>
</main>
@@ -70,14 +84,14 @@ const Home = (props) => {
);
};
export const getServerSideProps = wrapper.getServerSideProps(
(store) =>
async ({ query, req, res }) => {
const accountDetails = await getPersonalAccount();
console.log("perosnal: ", accountDetails);
store.dispatch(setAccountDetails(accountDetails));
}
);
// export const getServerSideProps = wrapper.getServerSideProps(
// (store) =>
// async ({ query, req, res }) => {
// const accountDetails = await getPersonalAccount();
// console.log("perosnal: ", accountDetails);
// store.dispatch(setAccountDetails(accountDetails));
// }
// );
const mapStateToProps = (state) => {
return {
pages/account/register.js
+89 -69
View File
@@ -17,26 +17,17 @@ import jsonpath from "jsonpath";
import { reduxForm, formValueSelector } from "redux-form";
import RegisterForm from "../../components/account/registerform";
import xpath from "xpath";
import {
setAppealType,
setAppealTypeTitle,
setAppealTypeID,
setAppealLPA,
getAppealTypeObj,
} from "../../store/appealType/action";
import { getAppealsTypes, getLPA } from "../../actions";
import { setLPA } from "../../store/lpa/action";
const Home = (props) => {
const { footerLinks, pages, formData } = props;
const { footerLinks, formData } = props;
let { t, lang } = useTranslation();
const router = useRouter();
const { locale } = router;
const { appealtypes } = router.query;
const { appealType, LPAData } = props;
const [registerFormComplete, setRegisterFormComplete] = useState(false);
const [accountCreatedComplete, setAccountCreatedComplete] = useState(false);
return (
<div>
@@ -61,59 +52,87 @@ const Home = (props) => {
>
<div className="govuk-grid-row">
<div className="govuk-grid-column-two-thirds">
<h1>Create a new account</h1>
<RegisterForm props={props} />
{registerFormComplete != true ||
accountCreatedComplete != true ? (
<h1>Create a new account</h1>
) : (
<h1>
Your account has been created
</h1>
)}
<RegisterForm
props={props}
accountCreatedComplete={
accountCreatedComplete
}
registerFormComplete={
registerFormComplete
}
setRegisterFormComplete={
setRegisterFormComplete
}
setAccountCreatedComplete={
setAccountCreatedComplete
}
/>
</div>
{registerFormComplete != true ||
accountCreatedComplete != true ? (
<div className="govuk-grid-column-one-third">
<h2 className="govuk-heading-m">
Help
</h2>
<div className="govuk-grid-column-one-third">
<h2 className="govuk-heading-m">
Help
</h2>
<h3>
Companies or submissions by more
than one individual (groups)
</h3>
<h3>
Companies or submissions by more
than one individual (groups)
</h3>
<p className="govuk-body">
If you are submitting an appeal
or representation from a company
e.g. &quot;Acme Inc&quot; or a
group of people e.g.
&quot;Residents of 1-10 High
street&quot;, you should enter
the name of the company or group
in the Company/Group field. You
will be deemed as acting as
their representative.
</p>
<p className="govuk-body">
If you are submitting an appeal or
representation from a company e.g.
&quot;Acme Inc&quot; or a group of
people e.g. &quot;Residents of 1-10
High street&quot;, you should enter
the name of the company or group in
the Company/Group field. You will be
deemed as acting as their
representative.
</p>
<h3>
Enforcement appeals by
married/civil partnership
couples
</h3>
<h3>
Enforcement appeals by married/civil
partnership couples
</h3>
<p className="govuk-body">
You should not enter a group
name. You need only enter your
partner&apos;s name on the
appeal form itself as an
additional appellant.
</p>
<p className="govuk-body">
You should not enter a group name.
You need only enter your
partner&apos;s name on the appeal
form itself as an additional
appellant.
</p>
<h3>
Other appeals by married/civil
partnership couples
</h3>
<h3>
Other appeals by married/civil
partnership couples
</h3>
<p className="govuk-body">
For any other type of appeal, for
example a planning appeal, you
should enter a group name when
creating your account e.g. &quot;Mr
and Mrs Smith&quot;, if that is the
name on the application.
</p>
</div>
<p className="govuk-body">
For any other type of appeal,
for example a planning appeal,
you should enter a group name
when creating your account e.g.
&quot;Mr and Mrs Smith&quot;, if
that is the name on the
application.
</p>
</div>
) : (
""
)}
</div>
</main>
</div>
@@ -126,17 +145,17 @@ const Home = (props) => {
);
};
export const getServerSideProps = wrapper.getServerSideProps(
(store) =>
async ({ query, req, res }) => {
const appealTypeData = await getAppealsTypes();
const lpaData = await getLPA();
console.log("appeal types", appealTypeData);
console.log("lpa typeswwwww", lpaData);
store.dispatch(setAppealType(appealTypeData));
store.dispatch(setLPA(lpaData));
}
);
// export const getServerSideProps = wrapper.getServerSideProps(
// (store) =>
// async ({ query, req, res }) => {
// const appealTypeData = await getAppealsTypes();
// const lpaData = await getLPA();
// console.log("appeal types", appealTypeData);
// console.log("lpa typeswwwww", lpaData);
// store.dispatch(setAppealType(appealTypeData));
// store.dispatch(setLPA(lpaData));
// }
// );
const mapStateToProps = (state) => {
return {
@@ -146,6 +165,7 @@ const mapStateToProps = (state) => {
appealType: state.appealType,
LPAData: state.LPAData,
form: state.form,
accountDetails: state.accountDetails,
};
};
pages/logout.js
+50
View File
@@ -0,0 +1,50 @@
import _ from "lodash";
import Link from "next/link";
import Head from "next/head";
import Header from "../components/header";
import Banner from "../components/banner";
import CookieBanner from "../components/cookieBanner";
import Footer from "../components/footer";
import { useSelector, shallowEqual, connect } from "react-redux";
import { useRouter } from "next/router";
import useTranslation from "next-translate/useTranslation";
import { setLogout } from "../store/accountDetails/action";
const LogOut = (props) => {
const { footerLinks, pages, setLogout } = props;
let { t, lang } = useTranslation();
const router = useRouter();
const { locale } = router;
setLogout();
return (
<div>
<Head>
<title>{t("common:service-name")}</title>
</Head>
<div id="page_wrapper">
<CookieBanner />
<Header courseName="Appeals Casework Portal" />
<div className="govuk-width-container">
<Banner />
<h2>You have been logged out</h2>
<div className="govuk-!-margin-top-9 govuk-!-margin-bottom-9">
<Link href="/">Return to Planning Casework portal</Link>
</div>
</div>
<Footer footerLinks={footerLinks} />
</div>
</div>
);
};
const mapDispatchToProps = (dispatch) => {
return {
setLogout: () => {
dispatch(setLogout());
},
};
};
export default connect(null, mapDispatchToProps)(LogOut);