Files
pedwfrontend/components/myportal.js
T
2021-12-13 15:55:10 +00:00

150 lines
5.4 KiB
JavaScript

import Link from "next/link";
import { useRouter } from "next/router";
import { useContext } from "react";
import useTranslation from "next-translate/useTranslation";
import MakeNewAppeal from "./myportal/makenewappeal";
import MyCases from "./myportal/mycases";
import SearchCases from "./myportal/searchcases";
import AwaitingSubmission from "./myportal/awaitingsubmission";
import MyRepresentations from "./myportal/myrepresentations";
import WatchedCases from "./myportal/watchedcases";
import YourAccount from "./myportal/youraccount";
import { parseCookies, setCookie, destroyCookie } from "nookies";
import IdleTimer from "react-idle-timer";
import TimeoutModal from "../components/timeoutmodal";
import { useState } from "react";
const MyPortal = (props) => {
let { t } = useTranslation();
const router = useRouter();
const { locale } = router;
const [showModal, setShowModal] = useState(false);
let idleTimer = null;
let logoutTimer = null;
let shareState = () => {
showShareState == true
? setShowShareState(false)
: setShowShareState(true);
};
const onIdle = () => {
togglePopup();
logoutTimer = setTimeout(() => {
handleLogout();
}, 1000 * 5 * 1); // 5 seconds
};
const togglePopup = () => {
showModal == true ? setShowModal(false) : setShowModal(true);
};
const handleStayLoggedIn = () => {
if (logoutTimer) {
clearTimeout(this.logoutTimer);
logoutTimer = null;
}
idleTimer.reset();
togglePopup();
};
const handleLogout = () => {
destroyCookie({}, "pinsUser"),
window.localStorage.clear(),
router.replace(props.ggLogout);
};
return (
<>
<main className="" id="main-content" role="main">
<div className="servicebanner myportal govuk-!-margin-bottom-4">
<h1>
<img
src={
router.locale == "cy"
? "/assets/images/planning-casework-cy.svg"
: "/assets/images/planning-casework-en.svg"
}
alt={
router.locale == "cy"
? "Fy mhorth"
: "My Portal"
}
/>
</h1>
<div className="serviceBanner_userDetails">
<img
className="user_logo"
src="/assets/images/user.svg"
alt={router.locale == "cy" ? "Defnyddiwr" : "User"}
/>{" "}
<div className="serviceBanner_userDetails_name">
{props.accountDetails.accountDetails.firstname}{" "}
{props.accountDetails.accountDetails.lastname}
</div>
<div>
<Link
href={
router.locale == "cy"
? "/allgofnodi"
: "/logout"
}
>
<a
onClick={() => {
handleLogout();
}}
className="govuk-header__link govuk-!-margin-right-3"
>
{t("common:signout-label")}
</a>
</Link>
</div>
</div>
</div>
<div className="govuk-grid-row">
<div className="govuk-grid-column-full">
<div className="flex-container grid-row govuk-body ">
<MakeNewAppeal />
<MyCases myCases={props.myCases} />
<SearchCases />
<AwaitingSubmission
awaitingSubmission={props.awaitingSubmission}
/>
<MyRepresentations
myRepresentations={props.myRepresentations}
/>
<WatchedCases watchedCases={props.watchedCases} />
</div>
<div className="flex-container grid-row govuk-body ">
<YourAccount />
</div>
</div>
</div>
</main>
{/* <IdleTimer
ref={(ref) => {
idleTimer = ref;
}}
element={document}
stopOnIdle={true}
onIdle={onIdle}
timeout={1000 * 600 * 1} // 10 seconds
/>
<TimeoutModal
showModal={showModal}
togglePopup={togglePopup}
handleStayLoggedIn={handleStayLoggedIn}
/> */}
</>
);
};
export default MyPortal;