Files
pedwfrontend/components/search/searchresults.js
T

155 lines
7.5 KiB
JavaScript

import Link from "next/link";
import { useRouter } from "next/router";
import useTranslation from "next-translate/useTranslation";
export default function SearchResults(props) {
const { searchString, searchResultsObj } = props;
let { t } = useTranslation();
const router = useRouter();
const { locale } = router;
var resultsArr = props.searchResultsObj.searchResultsObj.value || [{}];
const resultRow = Object.keys(resultsArr).map((key, index) => {
<div className="govuk-summary-list__row">
<dd className="govuk-summary-list__value govuk-!-font-size-14 govuk-!-padding-left-2">
<Link href="/case">
<a>
<span className="results-visually-hidden">
wwwwwwwCase Reference:
</span>
{resultsArr[key].title}
</a>
</Link>
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-14">
<span className="results-visually-hidden">Site Address: </span>
23 Martineau Lane
<br /> HASTINGS
<br />
TN35 5DS
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-14">
<span className="results-visually-hidden">
Appellant/Applicant:
</span>
Mr J Pocknell
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-14">
<span className="results-visually-hidden">Authority:</span>
Hastings Borough Council{" "}
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-14">
<span className="results-visually-hidden">Case Type:</span>
Planning (W){" "}
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-14">
<span className="results-visually-hidden">Status:</span>
In Progress
</dd>
</div>;
});
return (
<div className="govuk-grid-row">
<div className="govuk-grid-column-full">
<h1 className="govuk-heading-xl govuk-!-margin-bottom-7">
{t("search:searchresults-title-label")}
</h1>
<p className="govuk-body">
{t("search:searchresults-count-label", {
count: props.searchResultsObj.searchResultsObj[
"@odata.count"
].toString(),
})}
. You searched for <em>&quot;{searchString}&quot;</em>
</p>
<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-14 results_wider govuk-!-padding-left-2">
{t("search:searchresults-case-reference-label")}
</dd>
<dd className="govuk-summary-list__key govuk-!-font-size-14">
{t("search:searchresults-site-address-label")}
</dd>
<dd className="govuk-summary-list__key govuk-!-font-size-14">
{t("search:searchresults-applicant-label")}
</dd>
<dd className="govuk-summary-list__key govuk-!-font-size-14">
{t("search:searchresults-authority-label")}
</dd>
<dd className="govuk-summary-list__key govuk-!-font-size-14">
{t("search:searchresults-case-type-label")}
</dd>
<dd className="govuk-summary-list__key govuk-!-font-size-14">
{t("search:searchresults-status-label")}
</dd>
</div>
{resultsArr.map((item, key) => {
return (
<div className="govuk-summary-list__row" key={key}>
<dd className="govuk-summary-list__value govuk-!-font-size-14 govuk-!-padding-left-2">
<Link href="/case">
<a>
<span className="results-visually-hidden">
Case Reference:
</span>
{item.title}
</a>
</Link>
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-14">
<span className="results-visually-hidden">
Site Address:{" "}
</span>
23 Martineau Lane
<br /> HASTINGS
<br />
TN35 5DS
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-14">
<span className="results-visually-hidden">
Appellant/Applicant:
</span>
Mr J Pocknell
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-14">
<span className="results-visually-hidden">
Authority:
</span>
{
item[
"_customerid_value@OData.Community.Display.V1.FormattedValue"
]
}
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-14">
<span className="results-visually-hidden">
Case Type:
</span>
{
item[
"pinswg_appealcasetype@OData.Community.Display.V1.FormattedValue"
]
}
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-14">
<span className="results-visually-hidden">
Status:
</span>
{
item[
"statuscode@OData.Community.Display.V1.FormattedValue"
]
}
</dd>
</div>
);
})}
</dl>
</div>
</div>
);
}