Files
pedwfrontend/components/search/searchresults.js
T
2026-04-29 15:29:54 +00:00

1193 lines
59 KiB
JavaScript

import { JSONPath as jsonpath } from "jsonpath-plus";
import _ from "lodash";
import useTranslation from "next-translate/useTranslation";
import Link from "next/link";
import { useRouter } from "next/router";
import { useCallback, useState } from "react";
import { connect } from "react-redux";
import {
getAdvancedSearchPaged,
getBasicSearchPaged
} from "../../actions/services/searchService";
import transLookup from "../../data/lookuptranslations.json";
import {
setCurrentPage,
setCurrentReference
} from "../../store/currentView/action";
import { parseCookies, setCookie } from "nookies";
import { useEffect } from "react";
import { setLoggedInUserId } from "../../store/accountDetails/action";
import {
setSearchDetails,
setSearchResults
} from "../../store/searchOutput/action";
import {
setWatchedCases,
setWatchedCasesDetails
} from "../../store/watchedCases/action";
import { getDetailsProxy, getSearchDetailsPaged } from "../utils";
import PaginationControl from "./pagination";
import { signIn, useSession } from "next-auth/react";
import {
createWatchedCases,
deleteWatchedCases,
getWatchedCasesProxy
} from "../../actions/services/portalService";
import { sendGAEvent } from "@next/third-parties/google";
import RepsOnResults from "./repsonresults";
import LiveLink from "./liveLink";
import { query } from "jsonpath";
const escapeRegExp = (string) => string.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
const highlightText = (text, query) => {
if (!text || !query) return text;
const terms = Array.isArray(query)
? query
: String(query).trim().split(/\s+/).filter(Boolean);
if (!terms.length) return text;
const regex = new RegExp(`(${terms.map(escapeRegExp).join("|")})`, "gi");
return String(text)
.split(regex)
.map((part, i) =>
regex.test(part) ? (
<mark key={i} className="search-highlight">
{part}
</mark>
) : (
part
)
);
};
const SearchResults = (props) => {
const {
searchString,
searchResultsObj,
searchDetailsObj,
setCurrentReference,
setSearchResults,
setSearchDetails,
advancedSearch,
myportal,
watchedCases,
setWatchedCases,
setWatchedCasesDetails,
isLinkedCase,
setCurrentPage,
showLoginCheck
} = props;
let { t } = useTranslation();
const router = useRouter();
const { locale } = router;
const { data: session } = useSession();
var resultsArr = searchResultsObj.value || [];
const hasCount =
searchResultsObj &&
typeof searchResultsObj["@odata.count"] === "number";
const [searchLoaded, setSearchLoaded] = useState(false);
// const [showSpinnerState, setShowSpinnerState] = useState(false);
const [showSpinnerState, setShowSpinnerState] = useState(
!(searchResultsObj && searchResultsObj["@odata.count"] != null)
);
const [selectedOption, setSelectedOption] = useState(10);
const [orderByState, setOrderbyState] = useState("createdon");
const [fieldSortState, setfieldSortState] = useState("desc");
const [loginToWatch, setLoginToWatch] = useState("true");
let spinnerState = () => {
showSpinnerState == true
? setShowSpinnerState(false)
: setShowSpinnerState(true);
};
const cookies = parseCookies();
const selectWatchedCase = (loggedInUser, incidentID, appealType) => {
let updateBody = {
"pinswg_WatchedCase@odata.bind": "/incidents(" + incidentID + ")",
"pinswg_Contact@odata.bind": "/contacts(" + loggedInUser + ")",
"pinswg_appealcasetype": +appealType
};
createWatchedCases(updateBody)
.then((data) => data)
.then(() => {
getWatchedCasesProxy(props.accountDetails.loggedinUserId).then(
(data) => {
(setWatchedCases(data),
getDetailsProxy(data, "myWatchedCases").then(
(data) => {
setWatchedCasesDetails(data);
}
));
}
);
});
};
const selectEmailNotifications = (
emailaddress,
loggedInUser,
incidentID,
appealType
) => {
let updateBody = {
"pinswg_WatchedCase@odata.bind": "/incidents(" + incidentID + ")",
"pinswg_Contact@odata.bind": "/contacts(" + loggedInUser + ")",
"pinswg_appealcasetype": +appealType,
"pinswg_emailnotifications": true
};
console.log("Email signed up");
createWatchedCases(updateBody)
.then((data) => data)
.then(() => {
getWatchedCasesProxy(props.accountDetails.loggedinUserId).then(
(data) => {
(setWatchedCases(data),
getDetailsProxy(data, "myWatchedCases").then(
(data) => {
setWatchedCasesDetails(data);
}
));
}
);
});
};
const isWatchedCase = (whichIncident) => {
let isWatched = jsonpath({
path:
"$..value[?(@ && @._pinswg_watchedcase_value=='" +
whichIncident +
"')]",
json: watchedCases,
eval: true
});
return isWatched;
};
const isEmailSignUp = (whichIncident) => {
let isEmail = jsonpath({
path:
"$..value[?(@ && @._pinswg_watchedcase_value=='" +
whichIncident +
"' && @.pinswg_emailnotifications==true)]",
json: watchedCases,
eval: true
});
return isEmail;
};
const isEmailNotifications = (whichIncident) => {
let isWatched = jsonpath({
path:
"$..value[?(@ && @._pinswg_watchedcase_value=='" +
whichIncident +
"')]",
json: watchedCases,
eval: true
});
return isWatched;
};
const deleteItem = (caseID, topThreeType) => {
let cookies = parseCookies();
topThreeType == "watchedCases" &&
deleteWatchedCases(caseID)
.then((data) => data)
.then(() => {
getWatchedCasesProxy(
props.accountDetails.loggedinUserId
).then((data) => {
let showWatchedCases = (submittedArr) => {
const required = submittedArr.value.filter((el) => {
return (
el.pinswg_representationsubmitted == null
);
});
let newObj = {};
return Object.assign(newObj, {
"@odata.count": required.length,
"value": required
});
};
data = showWatchedCases(data);
data.value.sort(function compare(a, b) {
var dateA = new Date(a.createdon);
var dateB = new Date(b.createdon);
return dateB - dateA;
});
(setWatchedCases(data),
getDetailsProxy(data, "myWatchedCases").then(
(data) => {
setWatchedCasesDetails(data);
}
));
});
});
};
function hasValidKey(obj, key) {
return (
obj.hasOwnProperty(key) &&
obj[key] !== null &&
obj[key] !== undefined &&
obj[key] !== ""
);
}
const highlightQuery = advancedSearch
? searchString.map(([key, val]) => val).filter(Boolean)
: searchString;
const ResultsView = (resultsArr, currPage) => {
return (
<>
<dl className="govuk-summary-list govuk-!-margin-bottom-9 results">
<div className="govuk-summary-list__row results-headings">
<dd className="govuk-summary-list__key govuk-!-font-size-16 results_wider ">
<button
type="button"
onClick={() => sortDataBy("title")}
className={
orderByState == "title"
? fieldSortState == "asc"
? `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16 sortAsc`
: `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16 sortDesc`
: `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16`
}
>
{t("search:searchresults-case-reference-label")}
</button>
</dd>
<dd className="govuk-summary-list__key govuk-!-font-size-16">
{t("search:searchresults-site-address-label")}
</dd>
<dd className="govuk-summary-list__key govuk-!-font-size-16">
<button
type="button"
onClick={() => sortDataBy("_customerid_value")}
className={
orderByState == "_customerid_value"
? fieldSortState == "asc"
? `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16 sortAsc`
: `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16 sortDesc`
: `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16`
}
>
{t("search:searchresults-applicant-label")}
</button>
</dd>
<dd className="govuk-summary-list__key govuk-!-font-size-16">
<button
type="button"
onClick={() =>
sortDataBy("_pinswg_associatedlpa_value")
}
className={
orderByState ==
"_pinswg_associatedlpa_value"
? fieldSortState == "asc"
? `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16 sortAsc`
: `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16 sortDesc`
: `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16`
}
>
{t("search:searchresults-authority-label")}
</button>
</dd>
<dd className="govuk-summary-list__key govuk-!-font-size-16">
<button
type="button"
onClick={() =>
sortDataBy("pinswg_appealcasetype")
}
className={
orderByState == "pinswg_appealcasetype"
? fieldSortState == "asc"
? `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16 sortAsc`
: `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16 sortDesc`
: `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16`
}
>
{t("search:searchresults-case-type-label")}
</button>
</dd>
<dd className="govuk-summary-list__key govuk-!-font-size-16">
{/* {t("search:searchresults-status-label")} */}
<button
type="button"
onClick={() => sortDataBy("statuscode")}
className={
orderByState == "statuscode"
? fieldSortState == "asc"
? `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16 sortAsc`
: `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16 sortDesc`
: `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16`
}
>
{t("search:searchresults-status-label")}
</button>
</dd>
<dd className="govuk-summary-list__key govuk-!-font-size-16 govuk-summary-list__action"></dd>
</div>
{showSpinnerState == true ? (
<div className="govuk-summary-list__row">
<div className="govuk-!-margin-top-9 govuk-!-margin-bottom-9 govuk-!-font-weight-bold govuk-!-font-size-20 ">
{t("common:spinner-fetching-data")}
<img
className="data-loading-icon"
src="/assets/images/loading.gif"
alt={
router.locale == "cy"
? "Nôl data"
: "Fetching data"
}
/>
</div>
</div>
) : (
resultsArr.map((item, key) => {
let detailsObj = jsonpath({
path:
'$..[?(@ && @.ticketnumber=="' +
item.ticketnumber +
'")]',
json: searchDetailsObj,
eval: true
});
Object.assign(item, item.pinswg_sipscase);
detailsObj = detailsObj[0] || {};
return (
<div
className="govuk-summary-list__row"
key={key}
>
<dd className="govuk-summary-list__value govuk-!-font-size-16 ">
<div></div>
<Link
href={{
pathname:
(router.locale == "cy"
? myportal == true
? "/fymhorth/achos"
: "/achos"
: myportal == true
? "/myportal/case"
: "/case") +
"/" +
item.ticketnumber,
query: {
...router.query,
adv: advancedSearch
? "true"
: "false"
}
}}
className="govuk-link--no-underline"
onClick={() => {
(sendGAEvent(
"event",
"CaseViewed",
{
caseReference:
item.ticketnumber
}
),
setCurrentReference({
"statuscode":
item.statuscode,
"ticketnumber":
item.ticketnumber,
"currentReference":
item.title,
"currentType":
"searchResultsObj",
"incidentid":
item.incidentid,
"appealType":
item.pinswg_appealcasetype,
"showLoginCheck":
props.showLoginCheck,
"specialistProcess":
detailsObj.hasOwnProperty(
"pinswg_speacialistcaseprocess"
)
? detailsObj.pinswg_speacialistcaseprocess
: detailsObj.hasOwnProperty(
"pinswg_specialistcaseprocess"
)
? detailsObj.pinswg_specialistcaseprocess
: ""
}));
}}
>
<span className="results-visually-hidden">
{t(
"search:searchresults-case-reference-label"
)}
:
</span>
{highlightText(
item.title,
highlightQuery
)}
</Link>
{item.hasOwnProperty(
"pinswg_sipscase"
) &&
item.hasOwnProperty(
"_pinswg_projecttype_value@OData.Community.Display.V1.FormattedValue"
) && (
<div className="govuk-!-font-size-14">
{
item[
"_pinswg_projecttype_value@OData.Community.Display.V1.FormattedValue"
]
}
</div>
)}
<RepsOnResults
detailsObj={detailsObj}
appealType={
item.pinswg_appealcasetype
}
/>
<LiveLink
detailsObj={detailsObj}
appealType={
item.pinswg_appealcasetype
}
/>
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"search:searchresults-site-address-label"
)}
:
</span>
{_.has(
detailsObj,
"pinswg_projectlocation"
)
? detailsObj.pinswg_projectlocation !=
null
? detailsObj.pinswg_projectlocation.indexOf(
";"
) < 0
? detailsObj.pinswg_projectlocation
: router.locale == "cy"
? detailsObj.pinswg_projectlocation.split(
";"
)[1]
: detailsObj.pinswg_projectlocation.split(
";"
)[0]
: ""
: // : hasValidKey(
// item,
// "pinswg_caseaddress"
// )
// ? item.pinswg_caseaddress != null
// ? item.pinswg_caseaddress.indexOf(
// ";"
// ) < 0
// ? item.pinswg_caseaddress
// : router.locale == "cy"
// ? item.pinswg_caseaddress.split(
// ";"
// )[1]
// : item.pinswg_caseaddress.split(
// ";"
// )[0]
// : ""
""}
{_.has(
detailsObj,
"pinswg_siteaddressline1"
)
? detailsObj.pinswg_siteaddressline1
: ""}
{/* {detailsObj.pinswg_siteaddressline1 !=
null && <br />} */}
{_.has(
detailsObj,
"pinswg_siteaddressline1"
) &&
detailsObj.pinswg_siteaddressline1 !=
null && <br />}
{_.has(
detailsObj,
"pinswg_siteaddressline1"
)
? detailsObj.pinswg_siteaddressline2
: ""}
{_.has(
detailsObj,
"pinswg_siteaddressline2"
) &&
detailsObj.pinswg_siteaddressline2 !=
null && <br />}
{_.has(
detailsObj,
"pinswg_siteaddresstown"
)
? detailsObj.pinswg_siteaddresstown
: ""}
{_.has(
detailsObj,
"pinswg_siteaddresstown"
) &&
detailsObj.pinswg_siteaddresstown !=
null && <br />}
{_.has(
detailsObj,
"pinswg_siteaddresscounty"
)
? detailsObj.pinswg_siteaddresscounty
: ""}
{_.has(
detailsObj,
"pinswg_siteaddresscounty"
) &&
detailsObj.pinswg_siteaddresscounty !=
null && <br />}
{_.has(
detailsObj,
"pinswg_siteaddresspostcode"
)
? detailsObj.pinswg_siteaddresspostcode
: ""}
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"search:searchresults-applicant-label"
)}
:
</span>
{item.pinswg_appellantagent == 846040001
? item.pinswg_appellantfirstname +
" " +
item.pinswg_appellantlastname
: _.has(detailsObj, [
"_pinswg_appellant_value@OData.Community.Display.V1.FormattedValue"
])
? detailsObj[
"_pinswg_appellant_value@OData.Community.Display.V1.FormattedValue"
]
: ""}
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"search:searchresults-authority-label"
)}
:
</span>
{_.has(item, [
"_pinswg_associatedlpa_value@OData.Community.Display.V1.FormattedValue"
])
? router.locale == "cy"
? jsonpath({
path:
'$..[?(@ && @.value=="' +
item[
"_pinswg_associatedlpa_value@OData.Community.Display.V1.FormattedValue"
] +
'")].value_cy',
json: transLookup,
eval: true
})
: item[
"_pinswg_associatedlpa_value@OData.Community.Display.V1.FormattedValue"
] || "N/A"
: ""}
{item?.pinswg_lpareference && (
<>
<span className="govuk-!-padding-top-2 govuk-!-font-size-14 ref-block">
<strong className="ref-label">
Ref:
</strong>{" "}
{highlightText(
item.pinswg_lpareference,
highlightQuery
)}
</span>
</>
)}
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"search:searchresults-case-type-label"
)}
:
</span>
{router.locale == "cy"
? jsonpath({
path:
'$..[?(@ && @.value=="' +
item[
"pinswg_appealcasetype@OData.Community.Display.V1.FormattedValue"
] +
'")].value_cy',
json: transLookup,
eval: true
})
: item[
"pinswg_appealcasetype@OData.Community.Display.V1.FormattedValue"
] || "N/A"}
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"search:searchresults-status-label"
)}
:
</span>
{router.locale == "cy"
? jsonpath({
path:
'$..[?(@ && @.value=="' +
item[
"statuscode@OData.Community.Display.V1.FormattedValue"
] +
'")].value_cy',
json: transLookup,
eval: true
})
: item[
"statuscode@OData.Community.Display.V1.FormattedValue"
] || "N/A"}
</dd>
{myportal == true && (
<dd className="govuk-summary-list__value govuk-!-font-size-14 govuk-summary-list__action">
{isWatchedCase(item.incidentid)
.length >
0 ==
true ? (
<button
className="govuk-summary-list__actionLink watched_link"
onClick={() => {
confirm(
t(
"case:you-have-stopped-watching-label"
) +
item.title +
"?"
) &&
deleteItem(
isWatchedCase(
item.incidentid
)[0]
.pinswg_watchlistid,
"watchedCases"
);
}}
title={t(
"case:stop-watching-case-link"
)}
>
<span className="eye"></span>
</button>
) : (
<button
className="govuk-summary-list__actionLink watchLink"
onClick={() => {
confirm(
t(
"case:you-are-watching-label"
) +
item.title +
"?"
) &&
selectWatchedCase(
props
.accountDetails
.loggedinUserId,
item.incidentid,
item.pinswg_appealcasetype
);
}}
title={t(
"case:watch-this-case-link"
)}
>
<span className="eye"></span>
</button>
)}
{isEmailSignUp(item.incidentid)
.length >
0 ==
true ? (
<button
className="govuk-summary-list__actionLink mailLink watched_link"
title="Unsubscribe to email updates"
onClick={() => {
confirm(
t(
"case:summary-unsubscribe-mail-label"
) +
item.title +
"?"
) &&
deleteItem(
isEmailSignUp(
item.incidentid
)[0]
.pinswg_watchlistid,
"watchedCases"
);
}}
>
<span className="mailicon icon"></span>
</button>
) : (
<button
className="govuk-summary-list__actionLink mailLink"
title="Email about changes"
onClick={() => {
confirm(
t(
"case:summary-subscribe-mail-label"
) +
item.title +
"?"
) &&
selectEmailNotifications(
props
.accountDetails
.accountDetails
.emailaddress1,
props
.accountDetails
.loggedinUserId,
item.incidentid,
item.pinswg_appealcasetype
);
}}
>
<span className="mailicon icon"></span>
</button>
)}
</dd>
)}
{(showLoginCheck == "true" ||
showLoginCheck == true) &&
!session && (
<dd className="govuk-summary-list__value govuk-!-font-size-14 govuk-summary-list__action">
<span className="results-visually-hidden">
{t(
"case:watch-this-case-link"
)}
</span>
<button
className="govuk-summary-list__actionLink watchLink"
onClick={() => {
confirm(
t(
"case:trying-to-watch-case-label"
) +
item.title +
"\n\n" +
t(
"case:trying-to-watch-case-redirect-label"
)
) &&
// signIn("email");
signIn(undefined, {
callbackUrl:
"/myportal/searchresults?q=" +
searchString +
"&toWatch=" +
item.incidentid +
"_" +
item.pinswg_appealcasetype
});
}}
title={t(
"case:watch-this-case-link"
)}
>
<span className="eye"></span>
</button>
<button
className="govuk-summary-list__actionLink mailLink"
title={t(
"common:subscribe-title-label"
)}
onClick={() => {
confirm(
t(
"case:summary-subscribe-mail-label"
) +
item.title +
"?"
) &&
selectEmailNotifications(
props
.accountDetails
.accountDetails
.emailaddress1,
props
.accountDetails
.loggedinUserId,
item.incidentid,
item.pinswg_appealcasetype
);
}}
>
<span className="mailicon icon"></span>
</button>
</dd>
)}
</div>
);
})
)}
</dl>
<PaginationControl
showNoOfRecords={selectedOption}
currentPage={currentPage}
searchResultsObj={searchResultsObj}
orderBy={orderByState}
fieldSort={fieldSortState}
spinnerState={spinnerState}
getSearchPageResults={getSearchPageResults}
/>
</>
);
};
const pagesCount = Math.ceil(searchResultsObj["@odata.count"] / 10);
let currentPage = 0;
currentPage = decodeURI(searchResultsObj["@odata.nextLink"]).split(
"skiptoken="
)[1];
currentPage =
typeof currentPage != "undefined"
? parseInt(
decodeURI(currentPage)
.split('pagenumber="')[1]
.slice(
0,
decodeURI(currentPage)
.split('pagenumber="')[1]
.indexOf('"')
) - 1
)
: pagesCount;
const getSearchPageResults = useCallback(
(pageNumber, orderBy, fieldSort) => {
//console.log(advancedSearch, searchString, pageNumber);
if (advancedSearch) {
var searchoObj = Object.assign(
...searchString.map(([key, val]) => ({ [key]: val }))
);
getAdvancedSearchPaged(
searchoObj,
pageNumber,
orderBy,
fieldSort,
selectedOption
)
.then((data) => data)
.then((data) => {
//console.log("getting details", data);
setSearchResults(data);
return getSearchDetailsPaged(data).then((data) => {
setSearchDetails(data);
setShowSpinnerState(false);
});
});
} else {
getBasicSearchPaged(
searchString,
pageNumber,
orderBy,
fieldSort,
selectedOption
)
.then((data) => data)
.then((data) => {
//console.log("getting details", data);
setSearchResults(data);
return getSearchDetailsPaged(data).then((data) => {
setSearchDetails(data);
setShowSpinnerState(false);
});
});
}
},
[
advancedSearch,
searchString,
selectedOption,
setSearchDetails,
setSearchResults
]
);
const sortDataBy = (whichField) => {
setOrderbyState(whichField);
setfieldSortState("asc");
getSearchPageResults(1, whichField, fieldSortState);
whichField == orderByState
? fieldSortState == "desc"
? setfieldSortState("asc")
: setfieldSortState("desc")
: setfieldSortState("asc");
setCurrentPage(1);
setShowSpinnerState(true);
};
useEffect(() => {
const selectWatchedCase = (loggedInUser, incidentID, appealType) => {
let updateBody = {
"pinswg_WatchedCase@odata.bind":
"/incidents(" + incidentID + ")",
"pinswg_Contact@odata.bind": "/contacts(" + loggedInUser + ")",
"pinswg_appealcasetype": +appealType
};
createWatchedCases(updateBody)
.then((data) => data)
.then(() => {
getWatchedCasesProxy(
props.accountDetails.loggedinUserId
).then((data) => {
(setWatchedCases(data),
getDetailsProxy(data, "myWatchedCases").then(
(data) => {
setWatchedCasesDetails(data);
}
));
});
});
};
if (searchLoaded) {
if (selectedOption) {
setShowSpinnerState(true);
getSearchPageResults(1, orderByState, fieldSortState);
}
} else {
setSearchLoaded(true);
}
if (loginToWatch && router.query.hasOwnProperty("toWatch")) {
console.log("am in here");
let now = new Date();
let expDate = new Date(now);
expDate.setDate(now.getDate() + 1);
setLoggedInUserId(props.accountDetails.loggedinUserId);
setCookie(null, "pinsUser", props.accountDetails.loggedinUserId, {
path: "/",
expires: expDate
});
selectWatchedCase(
props.accountDetails.loggedinUserId,
router.query.toWatch.split("_")[0],
router.query.toWatch.split("_")[1]
);
getSearchPageResults(1, orderByState, fieldSortState);
setLoginToWatch(false);
} else {
//console.log("or am in here");
setLoginToWatch(false);
}
}, [
selectedOption,
fieldSortState,
orderByState,
searchLoaded,
loginToWatch,
setWatchedCases,
getSearchPageResults,
setWatchedCasesDetails,
props.accountDetails.loggedinUserId,
router.query
]);
//console.log(
// "page is here ",
// currentPage,
// orderByState + " " + fieldSortState
// );
return (
<>
<div className="govuk-grid-row">
<div className="govuk-grid-column-full">
<h1 className="govuk-heading-xl govuk-!-margin-bottom-7">
{isLinkedCase
? t("search:searchresults-title-label-linked-case")
: t("search:searchresults-title-label")}
</h1>
{!isLinkedCase &&
(hasCount ? (
<p className="govuk-body">
{resultsArr.length > 200
? t("search:searchresults-max-count-label")
: t("search:searchresults-count-label", {
count: searchResultsObj[
"@odata.count"
]
})}
.
{advancedSearch != true ? (
<span>
{" "}
{t(
"search:searchresults-case-count-label"
)}{" "}
<em>&quot;{searchString}&quot;</em>
</span>
) : (
""
)}
</p>
) : (
<p className="govuk-body">
{t("common:spinner-fetching-data")}
<img
className="data-loading-icon"
src="/assets/images/loading.gif"
alt={
router.locale == "cy"
? "Nôl data"
: "Fetching data"
}
/>
</p>
))}
{searchResultsObj["@odata.count"] > 5 && (
<div id="recordCountSelect" className="">
<div className="govuk-form-group">
<label
className="govuk-label-s "
htmlFor="showNumberOfRecords"
>
{t(
"search:searchresults-show-records-label-a"
)}
<select
onChange={(e) => {
setSelectedOption(e.target.value);
setCurrentPage(1);
}}
value={selectedOption}
className="govuk-select"
id="showNumberOfRecords"
name="showNumberOfRecords"
>
<option value="5">5</option>
<option value="10">10</option>
<option value="20">20</option>
<option value="30">30</option>
<option value="50">50</option>
</select>{" "}
{t(
"search:searchresults-show-records-label-b"
)}
</label>
</div>
</div>
)}
{resultsArr.length > 0 ? (
ResultsView(resultsArr, props.currentView.currentPage)
) : (
<div className="govuk-grid-row">
<div className="govuk-grid-column-two-thirds">
<h3>
{t("search:searchresults-no-records-label")}
</h3>
</div>
</div>
)}
</div>
</div>
</>
);
};
const mapDispatchToProps = (dispatch) => {
return {
setCurrentReference: (currentReference) => {
dispatch(setCurrentReference(currentReference));
},
setSearchResults: (searchResultsObj) => {
dispatch(setSearchResults(searchResultsObj));
},
setSearchDetails: (searchDetailsObj) => {
dispatch(setSearchDetails(searchDetailsObj));
},
setWatchedCases: (watchedCases) => {
dispatch(setWatchedCases(watchedCases));
},
setWatchedCasesDetails: (watchedCasesDetails) => {
dispatch(setWatchedCasesDetails(watchedCasesDetails));
},
setCurrentPage: (currentPage) => {
dispatch(setCurrentPage(currentPage));
}
};
};
const mapStateToProps = (state) => {
return {
currentView: state.currentView,
accountDetails: state.accountDetails
// search: state.search,
// searchResultsObj: state.searchResultsObj,
};
};
export default connect(mapStateToProps, mapDispatchToProps)(SearchResults);