added searching by LPA application ref and criteria highlighting

This commit is contained in:
2026-01-09 13:37:40 +00:00
parent 062f64d157
commit 9b0f9acff9
16 changed files with 715 additions and 48 deletions
+110 -25
View File
@@ -31,6 +31,32 @@ import {
} from "../../actions";
import RepsOnResults from "./repsonresults";
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,
@@ -55,9 +81,17 @@ const SearchResults = (props) => {
let [resultsArr, setResultsArr] = useState(searchResultsObj.value || []);
const hasCount =
searchResultsObj &&
typeof searchResultsObj["@odata.count"] === "number";
const [currentPage, setCurrentPage] = useState(1);
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("asc");
@@ -193,6 +227,10 @@ const SearchResults = (props) => {
const indexOfLastRecord = currentPage * selectedOption;
const indexOfFirstRecord = indexOfLastRecord - selectedOption;
const highlightQuery = advancedSearch
? searchString.map(([key, val]) => val).filter(Boolean)
: searchString;
const ResultsView = (resultsArr) => {
var resultsArrPaged = resultsArr.slice(
indexOfFirstRecord,
@@ -378,32 +416,42 @@ const SearchResults = (props) => {
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]
: ""
? highlightText(
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]
: "",
highlightQuery
)
: ""}
{_.has(
detailsObj,
"pinswg_siteaddressline1"
)
? detailsObj.pinswg_siteaddressline1
? highlightText(
detailsObj.pinswg_siteaddressline1,
highlightQuery
)
: ""}
{_.has(
detailsObj,
"pinswg_addressline1"
)
? detailsObj.pinswg_addressline1
? highlightText(
detailsObj.pinswg_addressline1,
highlightQuery
)
: ""}
{/* {detailsObj.pinswg_siteaddressline1 !=
null && <br />} */}
@@ -423,13 +471,19 @@ const SearchResults = (props) => {
detailsObj,
"pinswg_siteaddressline1"
)
? detailsObj.pinswg_siteaddressline2
? highlightText(
detailsObj.pinswg_siteaddressline2,
highlightQuery
)
: ""}
{_.has(
detailsObj,
"pinswg_addressline1"
)
? detailsObj.pinswg_addressline2
? highlightText(
detailsObj.pinswg_addressline2,
highlightQuery
)
: ""}
{_.has(
detailsObj,
@@ -447,10 +501,16 @@ const SearchResults = (props) => {
detailsObj,
"pinswg_siteaddresstown"
)
? detailsObj.pinswg_siteaddresstown
? highlightText(
detailsObj.pinswg_siteaddresstown,
highlightQuery
)
: ""}
{_.has(detailsObj, "pinswg_addresstown")
? detailsObj.pinswg_addresstown
? highlightText(
detailsObj.pinswg_addresstown,
highlightQuery
)
: ""}
{_.has(
detailsObj,
@@ -468,13 +528,19 @@ const SearchResults = (props) => {
detailsObj,
"pinswg_siteaddresscounty"
)
? detailsObj.pinswg_siteaddresscounty
? highlightText(
detailsObj.pinswg_siteaddresscounty,
highlightQuery
)
: ""}
{_.has(
detailsObj,
"pinswg_addresscounty"
)
? detailsObj.pinswg_addresscounty
? highlightText(
detailsObj.pinswg_addresscounty,
highlightQuery
)
: ""}
{_.has(
detailsObj,
@@ -492,10 +558,16 @@ const SearchResults = (props) => {
detailsObj,
"pinswg_siteaddresspostcode"
)
? detailsObj.pinswg_siteaddresspostcode
? highlightText(
detailsObj.pinswg_siteaddresspostcode,
highlightQuery
)
: ""}
{_.has(detailsObj, "pinswg_postcode")
? detailsObj.pinswg_postcode
? highlightText(
detailsObj.pinswg_postcode,
highlightQuery
)
: ""}
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
@@ -556,6 +628,19 @@ const SearchResults = (props) => {
"_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">