Merged PR 672: Update cookies manager functions and added in Gov Gateway

Related work items: #5255, #6936, #6937, #6938
This commit is contained in:
Robert Bond
2021-12-09 13:39:42 +00:00
25 changed files with 893 additions and 186 deletions
+5 -1
View File
@@ -60,5 +60,9 @@ I18N_DOMAIN = "cymru.local"
GG_PROVIDER_CONFIG_ENDPOINT = "https://api.ete.access.service.gov.uk/.well-known/openid-configuration"
GG_ClIENT_ID = 5vTukeSpN7d6uBV7YLb7A5wOctzzkZ
GG_CLIENT_SECRET = z1PGLAKPxIhjMBegTdzX22AayIORc1GsCbMQZ6mieBn7zChjzzxup5lkIByEmsYS
GG_REDIRECT_URI = "https://pp-planningcasework.service.gov.wales"
GG_REDIRECT_URI = "http://localhost:3000"
NEXT_PUBLIC_GG_ClIENT_ID = 5vTukeSpN7d6uBV7YLb7A5wOctzzkZ
NEXT_PUBLIC_GG_REDIRECT_URI = "http://localhost:3000"
+191
View File
@@ -0,0 +1,191 @@
import axios from "axios";
import { hashAPIPath } from "./";
const configEndpoint = process.env.GG_PROVIDER_CONFIG_ENDPOINT;
const ggClientID = process.env.GG_ClIENT_ID;
const ggClientSecret = process.env.GG_CLIENT_SECRET;
const WEBAPI_URL =
process.env.RELAY_ROOT ||
"https://dev-pedw-ns.servicebus.windows.net/dev-pedw-hc/";
export const getProviderConfig = () => {
return axios
.get(configEndpoint)
.then((res) => res.data)
.catch((error) => {
console.log("error :", error.response);
// return error;
});
};
export const getGGToken = (tokenURL, authCode, redirectUri) => {
const tokenBody =
"grant_type=authorization_code" +
"&code=" +
authCode +
"&redirect_uri=" +
redirectUri;
const basicAuthBase64 = (ggClientID + ":" + ggClientSecret).toString();
//console.log("base64 " + Base64.encode(basicAuthBase64));
const tokenConfig = {
headers: {
"Content-Type": "application/x-www-form-urlencoded",
"Authorization": "Basic " + Base64.encode(basicAuthBase64),
},
};
return axios
.post(tokenURL, tokenBody, tokenConfig)
.then((res) => res.data)
.catch((error) => {
// if (error.response) {
// console.log(error.response.data);
// console.log(error.response.status);
// console.log(error.response.headers);
// }
return error.response;
});
};
export const getUserInfo = (userInfoURL, authToken) => {
const tokenConfig = {
headers: {
"Authorization": "Bearer " + authToken,
},
};
return axios
.get(userInfoURL, tokenConfig)
.then((res) => res)
.catch((error) => {
//console.log(`Error: ${err?.response?.data}`);
//return error;
});
};
export const getPortalLogin = (emailAddress, token) => {
var queryUrl =
"contacts?$filter=emailaddress1 eq '" +
emailAddress +
"'&$count=true&$select=emailaddress1,contactid,pinswg_custom_password,yomifullname,firstname,lastname";
return axios
.get(WEBAPI_URL + queryUrl + hashAPIPath(queryUrl), azureHeaders(token))
.then((res) => res.data)
.catch((error) => {
console.log("thiserror", error);
});
};
const azureHeaders = (access_token) => {
return {
headers: {
"OData-MaxVersion": "4.0",
"OData-Version": "4.0",
"Accept": "application/json;odata.metadata=none",
"Prefer": 'odata.include-annotations="*",return=representation',
"Content-Type": "application/json",
"Authorization": "Bearer " + access_token,
},
};
};
var Base64 = {
_keyStr:
"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=",
encode: function (e) {
var t = "";
var n, r, i, s, o, u, a;
var f = 0;
e = Base64._utf8_encode(e);
while (f < e.length) {
n = e.charCodeAt(f++);
r = e.charCodeAt(f++);
i = e.charCodeAt(f++);
s = n >> 2;
o = ((n & 3) << 4) | (r >> 4);
u = ((r & 15) << 2) | (i >> 6);
a = i & 63;
if (isNaN(r)) {
u = a = 64;
} else if (isNaN(i)) {
a = 64;
}
t =
t +
this._keyStr.charAt(s) +
this._keyStr.charAt(o) +
this._keyStr.charAt(u) +
this._keyStr.charAt(a);
}
return t;
},
decode: function (e) {
var t = "";
var n, r, i;
var s, o, u, a;
var f = 0;
//e = e.replace(/[^A-Za-z0-9\+\/\=]/g, "");
while (f < e.length) {
s = this._keyStr.indexOf(e.charAt(f++));
o = this._keyStr.indexOf(e.charAt(f++));
u = this._keyStr.indexOf(e.charAt(f++));
a = this._keyStr.indexOf(e.charAt(f++));
n = (s << 2) | (o >> 4);
r = ((o & 15) << 4) | (u >> 2);
i = ((u & 3) << 6) | a;
t = t + String.fromCharCode(n);
if (u != 64) {
t = t + String.fromCharCode(r);
}
if (a != 64) {
t = t + String.fromCharCode(i);
}
}
t = Base64._utf8_decode(t);
return t;
},
_utf8_encode: function (e) {
e = e.replace(/\r\n/g, "\n");
var t = "";
for (var n = 0; n < e.length; n++) {
var r = e.charCodeAt(n);
if (r < 128) {
t += String.fromCharCode(r);
} else if (r > 127 && r < 2048) {
t += String.fromCharCode((r >> 6) | 192);
t += String.fromCharCode((r & 63) | 128);
} else {
t += String.fromCharCode((r >> 12) | 224);
t += String.fromCharCode(((r >> 6) & 63) | 128);
t += String.fromCharCode((r & 63) | 128);
}
}
return t;
},
_utf8_decode: function (e) {
var t = "";
var n = 0;
var r = (c1 = c2 = 0);
while (n < e.length) {
r = e.charCodeAt(n);
if (r < 128) {
t += String.fromCharCode(r);
n++;
} else if (r > 191 && r < 224) {
c2 = e.charCodeAt(n + 1);
t += String.fromCharCode(((r & 31) << 6) | (c2 & 63));
n += 2;
} else {
c2 = e.charCodeAt(n + 1);
c3 = e.charCodeAt(n + 2);
t += String.fromCharCode(
((r & 15) << 12) | ((c2 & 63) << 6) | (c3 & 63)
);
n += 3;
}
}
return t;
},
};
+15 -1
View File
@@ -94,7 +94,7 @@ const azureHeadersPaged = (access_token) => {
};
};
const hashAPIPath = (queryPath) => {
export const hashAPIPath = (queryPath) => {
var hashPath =
queryPath.indexOf("/api/proxy/") == -1
? queryPath
@@ -111,6 +111,20 @@ const hashAPIPath = (queryPath) => {
return (hashPath.indexOf("?") > -1 ? "&hash=" : "?hash=") + hashlink;
};
export const hashString = (stringToHash) => {
console.log("string to hash", stringToHash);
let hashedStr = CryptoJS.AES.encrypt(stringToHash, "pedw");
console.log("hashed String", hashedStr.toString());
return hashedStr.toString();
};
export const dehashString = (stringToDeHash) => {
console.log("string to dehash", stringToDeHash);
let dehashedStr = CryptoJS.AES.decrypt(decodeURI(stringToDeHash), "pedw");
console.log("dehshed string:", dehashedStr.toString(CryptoJS.enc.Utf8));
return dehashedStr.toString(CryptoJS.enc.Utf8);
};
export const getBasicSearch = (token, searchString) => {
//console.log("\n\n", token, searchString);
+4 -3
View File
@@ -82,10 +82,11 @@ let PersonalDetails = (props) => {
let errorsobj = {};
const required = (value) => (value ? undefined : "Is required");
const emailRegex =
/(?:[a-z0-9!#$%&'*+\/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+\/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])/gi;
const email = (value) =>
value && !/^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$/i.test(value)
? "Invalid email address"
: undefined;
value && !emailRegex.test(value) ? "Invalid email address" : undefined;
const phoneNumber = (value) =>
value &&
!/^(?:(?:\(?(?:0(?:0|11)\)?[\s-]?\(?|\+)44\)?[\s-]?(?:\(?0\)?[\s-]?)?)|(?:\(?0))(?:(?:\d{5}\)?[\s-]?\d{4,5})|(?:\d{4}\)?[\s-]?(?:\d{5}|\d{3}[\s-]?\d{3}))|(?:\d{3}\)?[\s-]?\d{3}[\s-]?\d{3,4})|(?:\d{2}\)?[\s-]?\d{4}[\s-]?\d{4}))(?:[\s-]?(?:x|ext\.?|\#)\d{3,4})?$/i.test(
+12 -2
View File
@@ -23,6 +23,7 @@ const RenderTextfield = ({
input,
type,
errorMsg,
disabled,
meta: { touched, error },
...custom
}) => {
@@ -39,6 +40,7 @@ const RenderTextfield = ({
name={name}
id={id}
type={type}
disabled={disabled}
/>
{touched && error && (
<span
@@ -69,6 +71,8 @@ const RegisterForm = (props) => {
value,
setRegisterFormComplete,
setAccountCreatedComplete,
loggedInUserEmail,
emailaddress1,
} = props;
let { t, lang } = useTranslation();
@@ -135,7 +139,8 @@ const RegisterForm = (props) => {
<h2 className="govuk-fieldset__heading">
{t(
"account:register-new-account-sub-heading-1"
)}
)}{" "}
{loggedInUserEmail}
</h2>
</legend>
<Field
@@ -176,6 +181,7 @@ const RegisterForm = (props) => {
label={t(
"account:register-new-account-email-address-label"
)}
disabled
/>
<Field
name="telephone1"
@@ -327,13 +333,16 @@ const RegisterForm = (props) => {
);
};
const mapStateToProps = (state) => {
const mapStateToProps = (state, props) => {
return {
search: state.search,
searchResultsObj: state.searchResultsObj,
formData: state.formData,
appealType: state.appealType,
//form: state.form,
initialValues: {
emailaddress1: props.loggedInUserEmail,
},
};
};
@@ -353,6 +362,7 @@ export default connect(
)(
reduxForm({
form: "accountRegisterForm",
enableReinitialize: true,
destroyOnUnmount: false,
})(RegisterForm)
);
+31 -12
View File
@@ -20,7 +20,7 @@ const CookieManagementMain = (props) => {
Object.assign(values, {
"essential": "accepted",
"usage": usageState,
"communications": communicationsState,
// "communications": communicationsState,
"settings": settingsState,
});
@@ -42,14 +42,15 @@ const CookieManagementMain = (props) => {
";expires=Thu, 01 Jan 1970 00:00:01 GMT";
}
usageState == "revoked" && delete_cookie("CookiePolicy", "/"),
delete_cookie("_ga", "/"),
usageState == "revoked" && delete_cookie("_ga", "/"),
delete_cookie("_gid", "/");
cookie.set("planning_casework", true, {
expires: expDate,
path: "/",
});
setSavedState(true);
};
let cookieCheck = parseCookies();
@@ -59,14 +60,16 @@ const CookieManagementMain = (props) => {
? {}
: JSON.parse(cookieCheck.CookiePolicy);
const [savedState, setSavedState] = useState(false);
const [usageState, setUsageState] = useState(
typeof cookieCheck.CookiePolicy == "undefined" ? null : cookieObj.usage
);
const [communicationsState, setCommunicationsState] = useState(
typeof cookieCheck.CookiePolicy == "undefined"
? null
: cookieObj.communications
);
// const [communicationsState, setCommunicationsState] = useState(
// typeof cookieCheck.CookiePolicy == "undefined"
// ? null
// : cookieObj.communications
// );
const [settingsState, setSettingsState] = useState(
typeof cookieCheck.CookiePolicy == "undefined"
? null
@@ -78,9 +81,9 @@ const CookieManagementMain = (props) => {
case "usage":
setUsageState(value);
break;
case "communications":
setCommunicationsState(value);
break;
// case "communications":
// setCommunicationsState(value);
// break;
case "settings":
setSettingsState(value);
break;
@@ -102,6 +105,22 @@ const CookieManagementMain = (props) => {
{t("cookies:cookie-title-heading")}
</h1>
<hr className="govuk-section-break govuk-section-break--visible" />
{savedState && (
<div
id="cookieSettingsMessageSuccess"
className="govuk-inset-text paragraph--type--call-out-message call-out-type-positive-alert-message"
>
<h2 className="govuk-heading-l">
<strong>
{t("cookies:cookie-saved-heading")}
</strong>
</h2>
<p className="govuk-body">
{t("cookies:cookie-saved-paragraph")}
</p>
</div>
)}
{typeof cookieCheck.CookiePolicy == "undefined" ? (
<>
<div className="govuk-inset-text paragraph--type--call-out-message">
@@ -455,7 +474,7 @@ const mapStateToProps = (state) => {
return {
initialValues: {
usage: state.accountDetails.cookieObj.usage,
communications: state.accountDetails.cookieObj.communications,
//communications: state.accountDetails.cookieObj.communications,
settings: state.accountDetails.cookieObj.settings,
},
};
+54 -40
View File
@@ -161,13 +161,25 @@ let Login = (props) => {
: "";
}, [cookies.pinsUser, router]);
const govGatwayLoginRedirect = () => {
router.replace(
props.govGateway.config.authorization_endpoint +
"?response_type=code&scope=openid&client_id=" +
process.env.NEXT_PUBLIC_GG_ClIENT_ID +
"&redirect_uri=" +
process.env.NEXT_PUBLIC_GG_REDIRECT_URI +
"&ui_locales=" +
(router.locale == "cy" ? "cy" : "en-GB")
);
};
return (
<div className="card" id="login-card">
<form onSubmit={handleSubmit(onHandleSubmit)}>
<div className="card-body active">
<h3 className="heading-small card-heading">
{t("home:login-card-title")}
</h3>
<div className="card-body active">
<h3 className="heading-small card-heading">
{t("home:login-card-title")}
</h3>{" "}
{/* <form onSubmit={handleSubmit(onHandleSubmit)}>
{validLoginID == false && (
<div className="govuk-error-message govuk-form-group--error">
Incorrect username or password
@@ -210,46 +222,47 @@ let Login = (props) => {
/>
<div className="govuk-form-group">
{/* <Link
href={
router.locale == "cy"
? "/fymhorth"
: "/myportal"
}
>
<a className="govuk-button">
{t("home:login-card-button")}
</a>
</Link> */}
<button type="submit" className="govuk-button">
{t("home:login-card-button")}
</button>
</div>
<div className="govuk-form-group govuk-!-margin-top-4">
<p className="govuk-body-s">
{t("home:login-card-register-label")}{" "}
<Link
href={
router.locale == "cy"
? "/cyfrif/cofrestr"
: "/account/register"
}
>
<a className="govuk-link--no-underline">
{t("home:login-card-register-link")}
</a>
</Link>
</p>
<p className="govuk-body-s">
<Link href="/">
<a className="govuk-link--no-underline">
{t("home:login-card-forgotten-label")}{" "}
</a>
</Link>
</p>
</div>
</form> */}
<div className="govuk-form-group govuk-!-margin-top-4">
<p className="govuk-body-xs">
<a
onClick={() => {
govGatwayLoginRedirect();
}}
className="govuk-button withChevron govuk-button-cta"
>
Log in via Government Gateway
</a>
</p>
<p className="govuk-body-s">
{t("home:login-card-register-label")}{" "}
<Link
href={
router.locale == "cy"
? "/cyfrif/cofrestr"
: "/account/register"
}
>
<a className="govuk-link--no-underline">
{t("home:login-card-register-link")}
</a>
</Link>
</p>
<p className="govuk-body-s">
<Link href="/">
<a className="govuk-link--no-underline">
{t("home:login-card-forgotten-label")}{" "}
</a>
</Link>
</p>
</div>
</form>
</div>
{/* <LoadingOverlay
active={showSpinnerState}
spinner
@@ -271,6 +284,7 @@ const mapStateToProps = (state) => {
watchedCases: state.watchedCases,
myRepresentations: state.myRepresentations,
awaitingSubmission: state.awaitingSubmission,
govGateway: state.govGateway,
};
};
+119 -57
View File
@@ -11,77 +11,139 @@ 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;
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>
const [showModal, setShowModal] = useState(false);
<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={
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("/");
};
return (
<>
<main className="" id="main-content" role="main">
<div className="servicebanner myportal govuk-!-margin-bottom-4">
<h1>
<img
src={
router.locale == "cy"
? "/allgofnodi"
: "/logout"
? "/assets/images/planning-casework-cy.svg"
: "/assets/images/planning-casework-en.svg"
}
>
<a
onClick={() => {
destroyCookie({}, "pinsUser"),
window.localStorage.clear();
}}
className="govuk-header__link govuk-!-margin-right-3"
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"
}
>
{t("common:signout-label")}
</a>
</Link>
<a
onClick={() => {
destroyCookie({}, "pinsUser"),
window.localStorage.clear();
}}
className="govuk-header__link govuk-!-margin-right-3"
>
{t("common:signout-label")}
</a>
</Link>
</div>
</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 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>
</div>
</main>
</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}
/> */}
</>
);
};
+22 -12
View File
@@ -89,6 +89,24 @@ const TopThree = (props) => {
return Promise.all(detailsArr);
};
const getIncidentId = (topThreeType, objArr) => {
switch (topThreeType) {
case "myCases":
return objArr.incidentid;
break;
case "watchedCases":
return objArr._pinswg_watchedcase_value;
break;
case "myRepresentations":
return objArr.ticketnumber;
break;
case "awaitingSubmission":
break;
default:
// code block
}
};
let topThreeOnlyArr = showTopThreeArr.slice(0, 3);
Object.keys(topThreeOnlyArr).map((key, index) => {
topthreeRow.push(
@@ -126,18 +144,10 @@ const TopThree = (props) => {
],
"currentType": topThreeType,
"incidentid":
topThreeType != "watchedCases"
? topThreeType !=
"myRepresentations"
? showTopThreeArr[key]
._pinswg_case_value
: showTopThreeArr[key][
"_pinswg_watchedcase_value"
]
: showTopThreeArr[key][
"_pinswg_watchedcase_value"
],
"incidentid": getIncidentId(
topThreeType,
showTopThreeArr[key]
),
"appealType":
showTopThreeArr[key]
+79 -22
View File
@@ -9,6 +9,14 @@ import data from "../../data/collections.json";
import LoadingOverlay from "react-loading-overlay";
import transLookup from "../../data/lookuptranslations.json";
const required = (errorMsg) => (value) =>
value || typeof value === "number" ? undefined : errorMsg;
export const minLength = (errorMsg) => (value) =>
value && value.length < 4
? errorMsg //`Must be ${min} characters or more`
: undefined;
let AdvancedSearch = (props) => {
let { t } = useTranslation();
@@ -37,6 +45,53 @@ let AdvancedSearch = (props) => {
? [{}]
: props.LPAData.LPAData.value;
const RenderTextfield = ({
id,
className,
rows,
datafieldname,
name,
label,
input,
hint1,
hint2,
hint3,
meta: { touched, error },
...custom
}) => {
return (
<>
<div className="govuk-form-group">
<div id="basicSearch-hint" className="govuk-hint ">
<label className="govuk-label" htmlFor="caseRef">
{t("search:casereference-label")}
</label>
</div>
<div>
<input
{...input}
className={className}
name={name}
id={id}
/>
{touched && error && (
<span
id={id + "-error"}
className="govuk-error-message govuk-form-group--error"
>
<span className="govuk-visually-hidden">
Error:
</span>{" "}
{error}
</span>
)}
</div>
</div>
</>
);
};
const RenderLPAList = ({
name,
id,
@@ -216,8 +271,6 @@ let AdvancedSearch = (props) => {
);
};
const required = (value) => (value ? undefined : "Required");
// const [showSpinnerState, setShowSpinnerState] = useState(false);
// let spinnerState = () => {
@@ -275,27 +328,31 @@ let AdvancedSearch = (props) => {
{t("search:search-title-label")}
</h1>
</legend>
<div className="govuk-form-group">
<label
className="govuk-label"
htmlFor="caseRef"
>
{t(
"search:casereference-label"
)}
</label>
<Field
name="caseRef"
id="caseRef"
component="input"
className="govuk-input govuk-!-width-two-thirds"
label={t(
"search:casereference-label"
)}
errormsg="Appeal type is required"
/>
</div>
<Field
validate={[
minLength(
t(
"myportal:searchcases-validation-minlength"
)
),
]}
className="govuk-input govuk-!-width-two-thirds"
component={RenderTextfield}
id="caseRef"
name="caseRef"
type="text"
aria-describedby="caseRef-hint"
hint1={t(
"myportal:searchcases-card-search-hint"
)}
hint2={t(
"myportal:searchcases-card-search-example-label-1"
)}
hint3={t(
"myportal:searchcases-card-search-example-label-2"
)}
/>
<Field
name="appealTypes"
+33
View File
@@ -0,0 +1,33 @@
import React from "react";
const TimeoutModal = ({ showModal, togglePopup, handleStayLoggedIn }) => {
return (
<div className="modal">
<div
isOpen={showModal}
toggle={togglePopup}
keyboard={false}
backdrop="static"
className="modal-dialog"
>
<div className="modal-content">
<h1>
{" "}
timeout - Your session is about to expire in 5 seconds
due to inactivity. You will be redirected to the login
page.
</h1>
<button
className="govuk-button"
onClick={handleStayLoggedIn}
>
Stay Logged In
</button>
</div>
</div>
<div className="modal-backdrop fade show"></div>
</div>
);
};
export default TimeoutModal;
+2 -2
View File
@@ -9,14 +9,14 @@ module.exports = {
},
],
"pages": {
"*": ["common", "newappeal"],
"*": ["common", "newappeal", "search"],
"/": ["common", "home"],
"/myportal": ["myportal"],
"/myportal/viewall": ["search"],
"/myportal/advancedsearch": ["search"],
"/myportal/searchresults": ["search"],
"/myportal/case": ["case"],
"/advancedsearch": ["search"],
"/advancedsearch": ["search", "myportal"],
"/advancedsearchresults": ["search"],
"/searchresults": ["search"],
"/viewall": ["search"],
+2
View File
@@ -3,6 +3,8 @@
"cookie-title-heading": "Cwcis ar cynllunio gwaith achos",
"cookie-not-saved-heading": "Nid yw eich dewisiadau cwcis wedi eu cadw eto",
"cookie-not-saved-paragraph": "Mae y gwasanaeth gwaith achos cynllunio yn gosod cwcis pan fyddwch yn ymweld â'n gwefan. Gallwch newid y gosodiadau hyn i'ch dewis chi. Mae angen i chi gadw'r dudalen hon gyda'ch dewisiadau newydd.",
"cookie-saved-heading": "Cafodd eich dewisiadau cwcis eu cadw",
"cookie-saved-paragraph": "Mae y gwasanaeth gwaith achos cynllunio yn gosod cwcis pan fyddwch yn ymweld â'n gwefan. Gallwch newid y gosodiadau hyn i'ch dewis chi.",
"cookie-intro-paragraph-1": "Ffeiliau sy'n cael eu cadw ar eich ffôn, tabled neu gyfrifiadur pan fyddwch yn ymweld â gwefan yw cwcis.",
"cookie-intro-paragraph-2": "Rydym yn defnyddio cwcis i storio gwybodaeth ynghylch sut yr ydych yn defnyddio gwefan y gwasanaeth gwaith achos cynllunio, megis y tudalennau yr ydych yn ymweld â nhw. Nid yw'r cwcis hyn yn cael eu defnyddio i'ch adnabod chi'n bersonol.",
"cookie-intro-paragraph-3": "Rydym yn defnyddio 4 cwci gwahanol. Gallwch ddewis pa fath o gwcis rydych yn hapus i ni eu defnyddio.",
+1 -1
View File
@@ -30,5 +30,5 @@
"norecords-cases": "Nid oes gennych unrhyw achosion",
"norecords-representations": "Nid oes gennych unrhyw sylwadau",
"norecords-watched-cases": "Nid ydych yn gwylio unrhyw achosion",
"norecords-awaiting-submission": "Nid oes gennych unrhyw gyflwyniadau sy'n aros"
"norecords-awaiting-submissions": "Nid oes gennych unrhyw gyflwyniadau sy'n aros"
}
+2
View File
@@ -3,6 +3,8 @@
"cookie-title-heading": "Cookies on planning casework",
"cookie-not-saved-heading": "Your cookie settings have not yet been saved",
"cookie-not-saved-paragraph": "The planning casework service sets cookies when you visit our website. You can choose to change these settings to your own preferences. You need to save this page with your new choices.",
"cookie-saved-heading": "Your cookie settings were saved",
"cookie-saved-paragraph": "The planning casework service sets cookies when you visit our website. You can choose to change these settings to your own preferences.",
"cookie-intro-paragraph-1": "Cookies are files saved on your phone, tablet or computer when you visit a website.",
"cookie-intro-paragraph-2": "We use cookies to store information about how you use the the planning casework service website, such as the pages you visit. These cookies are not used to identify you personally.",
"cookie-intro-paragraph-3": "We use 4 types of cookie. You can choose which cookies you're happy for us to use.",
+1 -1
View File
@@ -30,5 +30,5 @@
"norecords-cases": "You have no cases",
"norecords-representations": "You have no representations",
"norecords-watched-cases": "You are not watching any cases",
"norecords-awaiting-submission": "You have no awaiting submissions"
"norecords-awaiting-submissions": "You have no awaiting submissions"
}
+1
View File
@@ -41,6 +41,7 @@
"react-datepicker": "^4.1.1",
"react-dom": "17.0.2",
"react-dropzone": "^11.3.4",
"react-idle-timer": "^4.6.4",
"react-loading-overlay": "^1.0.1",
"react-redux": "^7.2.4",
"react-xml-parser": "^1.1.8",
+1 -1
View File
@@ -13,7 +13,7 @@ class MyDocument extends Document {
let hasBasicAuth =
typeof process.env.BASIC_AUTH_CREDENTIALS != "undefined";
console.log(hasBasicAuth);
console.log("hasbasicAuth:", hasBasicAuth);
if (ctx.req && ctx.res) {
hasBasicAuth &&
+30 -12
View File
@@ -17,9 +17,10 @@ import jsonpath from "jsonpath";
import { reduxForm, formValueSelector } from "redux-form";
import RegisterForm from "../../components/account/registerform";
import { dehashString, hashAPIPath } from "../../actions";
const Home = (props) => {
const { footerLinks, formData } = props;
const { footerLinks, formData, loggedInUserEmail } = props;
let { t, lang } = useTranslation();
const router = useRouter();
@@ -97,6 +98,9 @@ const Home = (props) => {
setAccountCreatedComplete={
setAccountCreatedComplete
}
loggedInUserEmail={
loggedInUserEmail
}
/>
</div>
{registerFormComplete != true ||
@@ -151,17 +155,31 @@ 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));
let hasRegistrationEmail = typeof query.id != "undefined";
let loginEmailStr = "";
if (hasRegistrationEmail == true) {
loginEmailStr = dehashString(query.id);
console.log(loginEmailStr);
}
return {
props: {
loggedInUserEmail: loginEmailStr,
},
};
}
);
const mapStateToProps = (state) => {
return {
+138 -8
View File
@@ -13,16 +13,68 @@ import { useSelector, shallowEqual, connect } from "react-redux";
import { wrapper } from "../store/store";
import { useRouter } from "next/router";
import useTranslation from "next-translate/useTranslation";
import { getIncidents } from "../actions";
import { parseCookies } from "nookies";
import { getIncidents, hashString } from "../actions";
import CryptoJS from "crypto-js";
import HmacSHA256 from "crypto-js/hmac-sha256";
import {
getProviderConfig,
getGGToken,
getUserInfo,
getPortalLogin,
} from "../actions/govgateway";
import { getToken } from "../actions";
import { getGovGatewayConfig } from "../store/govgateway/action";
import {
setLoggedInUserId,
setAccountDetails,
} from "../store/accountDetails/action";
import { parseCookies, setCookie, destroyCookie } from "nookies";
const WORDKEY = process.env.NEXT_PUBLIC_HASHKEY;
const Home = (props) => {
const { footerLinks, pages, showLogin } = props;
const {
footerLinks,
pages,
showLogin,
loggedInUserId,
hasGGCode,
loginEmailStr,
loggedInUserEmail,
} = props;
let { t, lang } = useTranslation();
const router = useRouter();
const { locale } = router;
let now = new Date();
let expDate = new Date(now);
expDate.setDate(now.getDate() + 1);
console.log("hashed email str", loginEmailStr);
_.isEmpty(loggedInUserId) != false && !hasGGCode
? console.log("no log in no ggcode")
: _.has(loggedInUserId, "value")
? _.isEmpty(loggedInUserId.value)
? router.replace({
pathname:
router.locale == "cy"
? "/account/register"
: "/account/register",
query: {
id: encodeURI(loggedInUserEmail),
},
})
: (setCookie(null, "pinsUser", loggedInUserId.value[0].contactid, {
path: "/",
expires: expDate,
}),
router.replace({
pathname: router.locale == "cy" ? "/fymhorth" : "/myportal",
}))
: console.log("no value in user id");
return (
<div>
<Head>
@@ -77,8 +129,21 @@ const Home = (props) => {
<CookieBanner />
<Header courseName="Appeals Casework Portal" />
<div className="govuk-width-container">
<ServiceBanner />
<Main pages={pages} showLogin={showLogin} />
{hasGGCode ? (
<>
<h1>Logging in</h1>
<h2>Please wait...</h2>
</>
) : (
<>
<ServiceBanner />
<Main
pages={pages}
showLogin={showLogin}
loggedInUserId={loggedInUserId}
/>
</>
)}
</div>
<Footer footerLinks={footerLinks} />
</div>
@@ -90,13 +155,78 @@ export const getServerSideProps = wrapper.getServerSideProps(
(store) => async (ctx) => {
const { query, req, res } = ctx;
var relayToken = await getToken();
relayToken = relayToken.access_token;
console.log("gg code:", query.code);
const showLoginCheck = process.env.SHOWLOGIN || false;
console.log("Show login module: ", showLoginCheck);
const hasLoginCode = typeof query.code != "undefined";
let providerConfig = await getProviderConfig();
console.log(
"endpoint: ",
providerConfig.token_endpoint,
"\n",
"hasloginCode:",
hasLoginCode
);
store.dispatch(getGovGatewayConfig(providerConfig));
let ggUserInfo = {};
let portalUserObj = {};
let loginEmailStr = "";
if (hasLoginCode == true) {
const ggToken = await getGGToken(
providerConfig.token_endpoint,
query.code,
process.env.GG_REDIRECT_URI
);
_.has(ggToken, "access_token")
? ((ggUserInfo = await getUserInfo(
providerConfig.userinfo_endpoint,
ggToken.access_token
)),
(loginEmailStr = hashString(ggUserInfo.data.email)),
(portalUserObj = await getPortalLogin(
ggUserInfo.data.email,
relayToken
)),
console.log("loggin user stuff: ", portalUserObj),
store.dispatch(setAccountDetails(portalUserObj)))
: console.log(
ggToken.status + " " + ggToken.data.error_description
);
}
return {
props: { showLogin: showLoginCheck },
props: {
showLogin: showLoginCheck,
hasGGCode: hasLoginCode,
loggedInUserId: portalUserObj,
loggedInUserEmail: loginEmailStr,
},
};
}
);
export default Home; //connect(mapStateToProps)(Home);
const mapStateToProps = (state) => {
return {
currentView: state.currentView,
search: state.search,
searchResultsObj: state.searchResultsObj,
formData: state.formData,
appealType: state.appealType,
form: state.form,
myCases: state.myCases,
watchedCases: state.watchedCases,
myRepresentations: state.myRepresentations,
awaitingSubmission: state.awaitingSubmission,
govGateway: state.govGateway,
};
};
export default connect(mapStateToProps)(Home);
+11 -11
View File
@@ -85,20 +85,20 @@ const Home = (props) => {
);
};
export const getServerSideProps = wrapper.getServerSideProps(
(store) => async (ctx) => {
const { query, req, res } = ctx;
// export const getServerSideProps = wrapper.getServerSideProps(
// (store) => async (ctx) => {
// const { query, req, res } = ctx;
const showRepresentationsCheck =
process.env.SHOWREPRESENTATIONS || false;
// const showRepresentationsCheck =
// process.env.SHOWREPRESENTATIONS || false;
console.log("Show representation module: ", showRepresentationsCheck);
// console.log("Show representation module: ", showRepresentationsCheck);
return {
props: { showRepresentations: showRepresentationsCheck },
};
}
);
// return {
// props: { showRepresentations: showRepresentationsCheck },
// };
// }
// );
const mapStateToProps = (state) => {
//console.log(state);
+10
View File
@@ -0,0 +1,10 @@
export const govGatweayActionTypes = {
GETPROVIDERCONFIG: "GETPROVIDERCONFIG",
};
export const getGovGatewayConfig = (config) => (dispatch) => {
return dispatch({
type: govGatweayActionTypes.GETPROVIDERCONFIG,
config: config,
});
};
+17
View File
@@ -0,0 +1,17 @@
import { govGatweayActionTypes } from "./action";
const govGatewayConfigInitialState = {
config: {},
};
export default function reducer(state = govGatewayConfigInitialState, action) {
switch (action.type) {
case govGatweayActionTypes.GETPROVIDERCONFIG:
return {
...state,
config: action.config,
};
default:
return state;
}
}
+3
View File
@@ -17,6 +17,7 @@ import awaitingSubmission from "./awaitingSubmission/reducer";
import myCases from "./myCases/reducer";
import myRepresentations from "./myRepresentations/reducer";
import watchedCases from "./watchedCases/reducer";
import govGateway from "./govgateway/reducer";
//COMBINING ALL REDUCERS
const appReducer = combineReducers({
@@ -31,6 +32,7 @@ const appReducer = combineReducers({
myCases,
myRepresentations,
watchedCases,
govGateway,
form: formReducer,
});
@@ -117,6 +119,7 @@ const makeStore = ({ isServer }) => {
"myCases",
"myRepresentations",
"watchedCases",
"govGateway",
"form",
],
version: 1,
+109
View File
@@ -1491,6 +1491,11 @@ ul#sharePageLinks.active {
.paragraph--type--call-out-message {
border-left-color: $blue;
background-color: $lightgrey_light;
&.call-out-type-positive-alert-message {
background: #cdf7d4;
border-left: 10px solid #019e1e;
}
}
#cookies-js form {
@@ -1701,3 +1706,107 @@ ul#sharePageLinks.active {
background-color: $white;
}
}
// modal timeout
.modal {
position: fixed;
top: 0;
left: 0;
z-index: 1060;
display: none;
width: 100%;
height: 100%;
overflow: hidden;
outline: 0;
}
fade {
transition: opacity 0.15s linear;
}
.modal-open .modal {
overflow-x: hidden;
overflow-y: auto;
}
.modal-backdrop {
position: fixed;
top: 0;
left: 0;
z-index: 1040;
width: 100vw;
height: 100vh;
background-color: #000;
}
.modal-backdrop.fade {
opacity: 0;
}
.modal-backdrop.show {
opacity: 0.5;
}
.modal-dialog {
position: relative;
width: auto;
margin: 0.5rem;
pointer-events: none;
}
@media (min-width: 576px) {
.modal-dialog {
max-width: 500px;
margin: 1.75rem auto;
}
}
.modal.show .modal-dialog {
transform: none;
}
.modal.fade .modal-dialog {
transition: transform 0.3s ease-out;
transform: translate(0, -50px);
}
.modal-content {
position: relative;
display: flex;
flex-direction: column;
width: 100%;
pointer-events: auto;
background-color: #fff;
background-clip: padding-box;
border: 1px solid rgba(0, 0, 0, 0.2);
border-radius: 0.3rem;
outline: 0;
}
.modal-footer {
display: flex;
flex-wrap: wrap;
flex-shrink: 0;
align-items: center;
justify-content: flex-end;
padding: 0.75rem;
border-top: 1px solid #dee2e6;
border-bottom-right-radius: calc(0.3rem - 1px);
border-bottom-left-radius: calc(0.3rem - 1px);
}
.modal-body {
position: relative;
flex: 1 1 auto;
padding: 1rem;
}
.modal-header {
display: flex;
flex-shrink: 0;
align-items: center;
justify-content: space-between;
padding: 1rem 1rem;
border-bottom: 1px solid #dee2e6;
border-top-left-radius: calc(0.3rem - 1px);
border-top-right-radius: calc(0.3rem - 1px);
}