added in post data flow
This commit is contained in:
@@ -1,4 +1,5 @@
|
||||
import Link from "next/link";
|
||||
import { useState } from "react";
|
||||
import { useRouter } from "next/router";
|
||||
import useTranslation from "next-translate/useTranslation";
|
||||
|
||||
@@ -7,8 +8,23 @@ export default function CaseSearch() {
|
||||
|
||||
const router = useRouter();
|
||||
const { locale } = router;
|
||||
const [query, setQuery] = useState("");
|
||||
const handleParam = (setValue) => (e) => setValue(e.target.value);
|
||||
|
||||
const basicSearch = (event) => {
|
||||
event.preventDefault();
|
||||
console.log(query);
|
||||
// /searchresults
|
||||
|
||||
router.push({
|
||||
pathname: "/searchresults",
|
||||
query: { q: query },
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="card" id="casesearch-card">
|
||||
<form onSubmit={basicSearch}>
|
||||
<div className="card-body">
|
||||
<h3 className="heading-small card-heading">
|
||||
{t("home:casesearch-card-title")}
|
||||
@@ -20,7 +36,9 @@ export default function CaseSearch() {
|
||||
<span className="govuk-body-s">
|
||||
{" "}
|
||||
<span className="govuk-!-font-weight-bold">
|
||||
{t("home:casesearch-card-search-example-label")}
|
||||
{t(
|
||||
"home:casesearch-card-search-example-label"
|
||||
)}
|
||||
:
|
||||
</span>{" "}
|
||||
APP/A1234/A/99/1234567
|
||||
@@ -32,19 +50,19 @@ export default function CaseSearch() {
|
||||
name="event-name"
|
||||
type="text"
|
||||
aria-describedby="event-name-hint"
|
||||
onChange={handleParam(setQuery)}
|
||||
/>
|
||||
</div>
|
||||
<div className="govuk-form-group">
|
||||
<Link href="/searchresults">
|
||||
<a className="govuk-button">
|
||||
<button type="submit" className="govuk-button">
|
||||
{t("home:casesearch-card-button")}
|
||||
</a>
|
||||
</Link>
|
||||
</button>
|
||||
</div>
|
||||
<Link href="/advancedsearch">
|
||||
<a>{t("home:casesearch-card-advanced-link")}</a>
|
||||
</Link>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
import Link from "next/link";
|
||||
import { useState } from "react";
|
||||
import { useRouter } from "next/router";
|
||||
import useTranslation from "next-translate/useTranslation";
|
||||
|
||||
@@ -7,8 +8,23 @@ export default function SearchCases() {
|
||||
|
||||
const router = useRouter();
|
||||
const { locale } = router;
|
||||
const [query, setQuery] = useState("");
|
||||
const handleParam = (setValue) => (e) => setValue(e.target.value);
|
||||
|
||||
const basicSearch = (event) => {
|
||||
event.preventDefault();
|
||||
console.log(query);
|
||||
// /searchresults
|
||||
|
||||
router.push({
|
||||
pathname: "/searchresults",
|
||||
query: { q: query },
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="card card-3" id="casescomment-card">
|
||||
<form onSubmit={basicSearch}>
|
||||
<div className="card-body">
|
||||
<h3 className="heading-small card-heading">
|
||||
{t("myportal:searchcases-card-title")}
|
||||
@@ -34,19 +50,23 @@ export default function SearchCases() {
|
||||
name="event-name"
|
||||
type="text"
|
||||
aria-describedby="event-name-hint"
|
||||
onChange={handleParam(setQuery)}
|
||||
/>
|
||||
</div>
|
||||
<div className="govuk-form-group">
|
||||
<Link href="/searchresults">
|
||||
<a className="govuk-button">
|
||||
<button
|
||||
type="submit"
|
||||
name="search"
|
||||
className="govuk-button"
|
||||
>
|
||||
{t("myportal:searchcases-card-button")}
|
||||
</a>
|
||||
</Link>
|
||||
</button>
|
||||
</div>
|
||||
<Link href="/advancedsearch">
|
||||
<a>{t("myportal:searchcases-card-advanced-link")}</a>
|
||||
</Link>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -17,23 +17,7 @@ export default function Search({ children, pages }) {
|
||||
id="main-content"
|
||||
role="main"
|
||||
>
|
||||
<div className="govuk-grid-row">
|
||||
<div className="govuk-grid-column-full">
|
||||
<SearchForCase />
|
||||
</div>
|
||||
</div>
|
||||
<div className="govuk-grid-row">
|
||||
<div className="govuk-grid-column-full">
|
||||
<AdvancedSearch />
|
||||
</div>
|
||||
</div>
|
||||
<div className="govuk-grid-row">
|
||||
<div className="govuk-grid-column-full">
|
||||
<Link href="/searchresults">
|
||||
<a className="govuk-button ">Search</a>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -1,23 +1,237 @@
|
||||
import Link from "next/link";
|
||||
import { useState } from "react";
|
||||
import { useRouter } from "next/router";
|
||||
import useTranslation from "next-translate/useTranslation";
|
||||
|
||||
export default function AdvancedSearch() {
|
||||
export default function AdvancedSearch(props) {
|
||||
let { t } = useTranslation();
|
||||
|
||||
const [query, setQuery] = useState("");
|
||||
const handleParam = (setValue) => (e) => setValue(e.target.value);
|
||||
|
||||
const advancedSearch = (event) => {
|
||||
event.preventDefault();
|
||||
console.log(query);
|
||||
// /searchresults
|
||||
|
||||
router.push({
|
||||
pathname: "/searchresults",
|
||||
query: { q: query },
|
||||
});
|
||||
};
|
||||
|
||||
const router = useRouter();
|
||||
const { locale } = router;
|
||||
return (
|
||||
<div>
|
||||
<form onSubmit={advancedSearch}>
|
||||
<div className="govuk-grid-row">
|
||||
<div className="govuk-grid-column-full">
|
||||
<div className="card" id="searchforcase-card">
|
||||
<div className="card-body">
|
||||
<div className="govuk-body-m ">
|
||||
<legend className="govuk-fieldset__legend govuk-fieldset__legend--l">
|
||||
<h1 className="govuk-fieldset__heading govuk-heading-m">
|
||||
{t("search:search-title-label")}
|
||||
</h1>
|
||||
</legend>
|
||||
<div className="govuk-form-group">
|
||||
<label
|
||||
className="govuk-label"
|
||||
htmlFor="address-county"
|
||||
>
|
||||
{t("search:casereference-label")}
|
||||
</label>
|
||||
<input
|
||||
className="govuk-input govuk-!-width-two-thirds"
|
||||
id="address-county"
|
||||
name="address-county"
|
||||
type="text"
|
||||
onChange={handleParam(setQuery)}
|
||||
/>
|
||||
</div>
|
||||
<fieldset className="govuk-fieldset">
|
||||
<legend className="govuk-fieldset__legend govuk-fieldset__legend--l">
|
||||
<h3 className="govuk-heading-m">
|
||||
{t(
|
||||
"search:sitelocation-legend"
|
||||
)}
|
||||
</h3>
|
||||
</legend>
|
||||
<div className="govuk-form-group">
|
||||
<label
|
||||
className="govuk-label"
|
||||
htmlFor="address-line-1"
|
||||
>
|
||||
{t(
|
||||
"search:address-line-one-label"
|
||||
)}
|
||||
</label>
|
||||
<input
|
||||
className="govuk-input"
|
||||
id="address-line-1"
|
||||
name="address-line-1"
|
||||
type="text"
|
||||
autoComplete="address-line1"
|
||||
onChange={handleParam(setQuery)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="govuk-form-group">
|
||||
<label
|
||||
className="govuk-label"
|
||||
htmlFor="address-town"
|
||||
>
|
||||
{t("search:town-label")}
|
||||
</label>
|
||||
<input
|
||||
className="govuk-input govuk-!-width-two-thirds"
|
||||
id="address-town"
|
||||
name="address-town"
|
||||
type="text"
|
||||
autoComplete="address-level2"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="govuk-form-group">
|
||||
<label
|
||||
className="govuk-label"
|
||||
htmlFor="address-county"
|
||||
>
|
||||
{t("search:county-label")}
|
||||
</label>
|
||||
<input
|
||||
className="govuk-input govuk-!-width-two-thirds"
|
||||
id="address-county"
|
||||
name="address-county"
|
||||
type="text"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="govuk-form-group">
|
||||
<label
|
||||
className="govuk-label"
|
||||
htmlFor="address-postcode"
|
||||
>
|
||||
{t("search:postcode-label")}
|
||||
</label>
|
||||
<input
|
||||
className="govuk-input govuk-input--width-10"
|
||||
id="address-postcode"
|
||||
name="address-postcode"
|
||||
type="text"
|
||||
autoComplete="postal-code"
|
||||
/>
|
||||
</div>
|
||||
</fieldset>
|
||||
<div className="govuk-form-group">
|
||||
<label
|
||||
className="govuk-label"
|
||||
htmlFor="address-postcode"
|
||||
>
|
||||
{t("search:lpa-label")}{" "}
|
||||
</label>
|
||||
<input
|
||||
className="govuk-input govuk-input--width-10"
|
||||
id="address-postcode"
|
||||
name="address-postcode"
|
||||
type="text"
|
||||
autoComplete="postal-code"
|
||||
/>
|
||||
</div>
|
||||
<div className="govuk-form-group">
|
||||
<label
|
||||
className="govuk-label"
|
||||
htmlFor="address-postcode"
|
||||
>
|
||||
{t("search:lpa-reference-label")}{" "}
|
||||
</label>
|
||||
<input
|
||||
className="govuk-input govuk-input--width-10"
|
||||
id="address-postcode"
|
||||
name="address-postcode"
|
||||
type="text"
|
||||
autoComplete="postal-code"
|
||||
/>
|
||||
</div>
|
||||
<div className="govuk-form-group">
|
||||
<label
|
||||
className="govuk-label"
|
||||
htmlFor="sort"
|
||||
>
|
||||
{t("search:case-type-label")}{" "}
|
||||
</label>
|
||||
<select
|
||||
className="govuk-select"
|
||||
id="sort"
|
||||
name="sort"
|
||||
>
|
||||
<option value="">
|
||||
{t("search:case-type-option-1")}
|
||||
</option>
|
||||
<option value="Any/All">
|
||||
{t("search:case-type-option-2")}
|
||||
</option>
|
||||
<option value="Advertisement Appeals">
|
||||
{t("search:case-type-option-3")}
|
||||
</option>
|
||||
<option value="Called in Planning Applications">
|
||||
{t("search:case-type-option-4")}
|
||||
</option>
|
||||
<option value="Discontinuance Notice Appeals">
|
||||
{t("search:case-type-option-5")}
|
||||
</option>
|
||||
<option value="Enforcement Listed Building and Conservation Area Appeals">
|
||||
{t("search:case-type-option-6")}
|
||||
</option>
|
||||
<option value="Enforcement Appeals">
|
||||
{t("search:case-type-option-7")}
|
||||
</option>
|
||||
<option value="Householder Appeals">
|
||||
{t("search:case-type-option-8")}
|
||||
</option>
|
||||
<option value="Lawful Development Certificate Appeals">
|
||||
{t("search:case-type-option-9")}
|
||||
</option>
|
||||
<option value="Planning Appeals">
|
||||
{t(
|
||||
"search:case-type-option-10"
|
||||
)}
|
||||
</option>
|
||||
<option value="Planning Obligation Appeals">
|
||||
{t(
|
||||
"search:case-type-option-11"
|
||||
)}
|
||||
</option>
|
||||
<option value="Planning Listed Building and Conservation Area Appeals">
|
||||
{t(
|
||||
"search:case-type-option-12"
|
||||
)}
|
||||
</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="govuk-grid-row">
|
||||
<div className="govuk-grid-column-full">
|
||||
<div className="card" id="advancedsearch-card">
|
||||
<div className="card-body">
|
||||
<div className="govuk-body-m ">
|
||||
<legend className="govuk-fieldset__legend govuk-fieldset__legend--l">
|
||||
<h3 className="govuk-heading-m">
|
||||
{t("search:advanced-search-title-label")}
|
||||
{t(
|
||||
"search:advanced-search-title-label"
|
||||
)}
|
||||
</h3>
|
||||
</legend>
|
||||
<div className="govuk-form-group">
|
||||
<label className="govuk-label" htmlFor="address-line-1">
|
||||
<label
|
||||
className="govuk-label"
|
||||
htmlFor="address-line-1"
|
||||
>
|
||||
{t("search:applicant-label")}
|
||||
</label>
|
||||
<input
|
||||
@@ -29,7 +243,10 @@ export default function AdvancedSearch() {
|
||||
/>
|
||||
</div>
|
||||
<div className="govuk-form-group">
|
||||
<label className="govuk-label" htmlFor="address-town">
|
||||
<label
|
||||
className="govuk-label"
|
||||
htmlFor="address-town"
|
||||
>
|
||||
{t("search:other-party-label")}
|
||||
</label>
|
||||
<input
|
||||
@@ -49,7 +266,9 @@ export default function AdvancedSearch() {
|
||||
{" "}
|
||||
<div className="inlineFieldset">
|
||||
<legend className="govuk-fieldset__legend govuk-!-width-one-third">
|
||||
{t("search:hearing-date-label")}
|
||||
{t(
|
||||
"search:hearing-date-label"
|
||||
)}
|
||||
</legend>
|
||||
<div
|
||||
className="govuk-date-input"
|
||||
@@ -125,7 +344,9 @@ export default function AdvancedSearch() {
|
||||
className="govuk-label govuk-checkboxes__label no__right_padding"
|
||||
htmlFor="waste-3"
|
||||
>
|
||||
{t("search:date-margin-label")}
|
||||
{t(
|
||||
"search:date-margin-label"
|
||||
)}
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
@@ -142,7 +363,9 @@ export default function AdvancedSearch() {
|
||||
{" "}
|
||||
<div className="inlineFieldset">
|
||||
<legend className="govuk-fieldset__legend govuk-!-width-one-third">
|
||||
{t("search:site-visit-date-label")}
|
||||
{t(
|
||||
"search:site-visit-date-label"
|
||||
)}
|
||||
</legend>
|
||||
<div
|
||||
className="govuk-date-input"
|
||||
@@ -218,7 +441,9 @@ export default function AdvancedSearch() {
|
||||
className="govuk-label govuk-checkboxes__label no__right_padding"
|
||||
htmlFor="waste-3"
|
||||
>
|
||||
{t("search:date-margin-label")}
|
||||
{t(
|
||||
"search:date-margin-label"
|
||||
)}
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
@@ -235,7 +460,9 @@ export default function AdvancedSearch() {
|
||||
{" "}
|
||||
<div className="inlineFieldset">
|
||||
<legend className="govuk-fieldset__legend govuk-!-width-one-third">
|
||||
{t("search:callin-date-label")}
|
||||
{t(
|
||||
"search:callin-date-label"
|
||||
)}
|
||||
</legend>
|
||||
<div
|
||||
className="govuk-date-input"
|
||||
@@ -311,7 +538,9 @@ export default function AdvancedSearch() {
|
||||
className="govuk-label govuk-checkboxes__label no__right_padding"
|
||||
htmlFor="waste-3"
|
||||
>
|
||||
{t("search:date-margin-label")}
|
||||
{t(
|
||||
"search:date-margin-label"
|
||||
)}
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
@@ -404,7 +633,9 @@ export default function AdvancedSearch() {
|
||||
className="govuk-label govuk-checkboxes__label no__right_padding"
|
||||
htmlFor="waste-3"
|
||||
>
|
||||
{t("search:date-margin-label")}
|
||||
{t(
|
||||
"search:date-margin-label"
|
||||
)}
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
@@ -421,7 +652,9 @@ export default function AdvancedSearch() {
|
||||
{" "}
|
||||
<div className="inlineFieldset">
|
||||
<legend className="govuk-fieldset__legend govuk-!-width-one-third">
|
||||
{t("search:start-date-label")}
|
||||
{t(
|
||||
"search:start-date-label"
|
||||
)}
|
||||
</legend>
|
||||
<div
|
||||
className="govuk-date-input"
|
||||
@@ -497,7 +730,9 @@ export default function AdvancedSearch() {
|
||||
className="govuk-label govuk-checkboxes__label no__right_padding"
|
||||
htmlFor="waste-3"
|
||||
>
|
||||
{t("search:date-margin-label")}
|
||||
{t(
|
||||
"search:date-margin-label"
|
||||
)}
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
@@ -514,7 +749,9 @@ export default function AdvancedSearch() {
|
||||
{" "}
|
||||
<div className="inlineFieldset">
|
||||
<legend className="govuk-fieldset__legend govuk-!-width-one-third">
|
||||
{t("search:decision-date-label")}
|
||||
{t(
|
||||
"search:decision-date-label"
|
||||
)}
|
||||
</legend>
|
||||
<div
|
||||
className="govuk-date-input"
|
||||
@@ -590,7 +827,9 @@ export default function AdvancedSearch() {
|
||||
className="govuk-label govuk-checkboxes__label no__right_padding"
|
||||
htmlFor="waste-3"
|
||||
>
|
||||
{t("search:date-margin-label")}
|
||||
{t(
|
||||
"search:date-margin-label"
|
||||
)}
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
@@ -599,29 +838,51 @@ export default function AdvancedSearch() {
|
||||
</fieldset>
|
||||
</div>
|
||||
<div className="govuk-form-group ">
|
||||
<label className="govuk-label" htmlFor="sort">
|
||||
<label
|
||||
className="govuk-label"
|
||||
htmlFor="sort"
|
||||
>
|
||||
{t("search:procedure-type-label")}
|
||||
</label>
|
||||
<select className="govuk-select" id="sort" name="sort">
|
||||
<select
|
||||
className="govuk-select"
|
||||
id="sort"
|
||||
name="sort"
|
||||
>
|
||||
<option value="">
|
||||
{t("search:procedure-type-option-1")}
|
||||
{t(
|
||||
"search:procedure-type-option-1"
|
||||
)}
|
||||
</option>
|
||||
<option value="Hearing">
|
||||
{t("search:procedure-type-option-2")}
|
||||
{t(
|
||||
"search:procedure-type-option-2"
|
||||
)}
|
||||
</option>
|
||||
<option value="Inquiry">
|
||||
{t("search:procedure-type-option-3")}
|
||||
{t(
|
||||
"search:procedure-type-option-3"
|
||||
)}
|
||||
</option>
|
||||
<option value="Written representations">
|
||||
{t("search:procedure-type-option-4")}
|
||||
{t(
|
||||
"search:procedure-type-option-4"
|
||||
)}
|
||||
</option>
|
||||
</select>
|
||||
</div>
|
||||
<div className="govuk-form-group">
|
||||
<label className="govuk-label" htmlFor="sort">
|
||||
<label
|
||||
className="govuk-label"
|
||||
htmlFor="sort"
|
||||
>
|
||||
{t("search:status-label")}
|
||||
</label>
|
||||
<select className="govuk-select" id="sort" name="sort">
|
||||
<select
|
||||
className="govuk-select"
|
||||
id="sort"
|
||||
name="sort"
|
||||
>
|
||||
<option value="">
|
||||
{t("search:status-option-1")}
|
||||
</option>
|
||||
@@ -639,5 +900,23 @@ export default function AdvancedSearch() {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="govuk-grid-row">
|
||||
<div className="govuk-grid-column-full">
|
||||
<div className="govuk-form-group">
|
||||
<button
|
||||
type="submit"
|
||||
name="search"
|
||||
className="govuk-button"
|
||||
>
|
||||
Search
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -2,7 +2,8 @@ import Link from "next/link";
|
||||
import { useRouter } from "next/router";
|
||||
import useTranslation from "next-translate/useTranslation";
|
||||
|
||||
export default function SearchResults() {
|
||||
export default function SearchResults(props) {
|
||||
const { searchString } = props;
|
||||
let { t } = useTranslation();
|
||||
|
||||
const router = useRouter();
|
||||
@@ -14,8 +15,8 @@ export default function SearchResults() {
|
||||
{t("search:searchresults-title-label")}
|
||||
</h1>
|
||||
<p className="govuk-body">
|
||||
{t("search:searchresults-count-label-part-1")} 99{" "}
|
||||
{t("search:searchresults-count-label-part-2")}
|
||||
{t("search:searchresults-count-label", { count: 22 })}. You
|
||||
searched for <em>"{searchString}"</em>
|
||||
</p>
|
||||
<dl className="govuk-summary-list govuk-!-margin-bottom-9 results">
|
||||
<div className="govuk-summary-list__row results-headings">
|
||||
|
||||
@@ -5,7 +5,8 @@ import useTranslation from "next-translate/useTranslation";
|
||||
import SearchForCase from "./search/searchforcase";
|
||||
import SearchResults from "./search/searchresults";
|
||||
|
||||
export default function Search({ children, pages }) {
|
||||
export default function Search(props) {
|
||||
const { searchString } = props;
|
||||
let { t } = useTranslation();
|
||||
|
||||
const router = useRouter();
|
||||
@@ -19,7 +20,7 @@ export default function Search({ children, pages }) {
|
||||
>
|
||||
<div className="govuk-grid-row">
|
||||
<div className="govuk-grid-column-full">
|
||||
<SearchResults />
|
||||
<SearchResults searchString={searchString} />
|
||||
</div>
|
||||
</div>
|
||||
<div className="govuk-grid-row">
|
||||
|
||||
@@ -46,8 +46,7 @@
|
||||
"clear-button-label": "Cliriwch",
|
||||
"clear-all-button-label": "Clirio Pob Un",
|
||||
"searchresults-title-label": "Crynodeb o’r Achos ar gyfer",
|
||||
"searchresults-count-label-part-1": "Cafodd eich chwiliad",
|
||||
"searchresults-count-label-part-2": "o ganlyniadau",
|
||||
"searchresults-count-label": "Cafodd eich chwiliad {{count}} o ganlyniadau",
|
||||
"searchresults-case-reference-label": "Cyfeirnod yr Achos",
|
||||
"searchresults-site-address-label": "Cyfeiriad y Safle",
|
||||
"searchresults-applicant-label": "Apelydd/Ymgeisydd",
|
||||
|
||||
@@ -46,8 +46,7 @@
|
||||
"clear-button-label": "Clear",
|
||||
"clear-all-button-label": "Clear all",
|
||||
"searchresults-title-label": "Search for a case",
|
||||
"searchresults-count-label-part-1": "Your search returned",
|
||||
"searchresults-count-label-part-2": "results",
|
||||
"searchresults-count-label": "Your search returned {{count}} results",
|
||||
"searchresults-case-reference-label": "Case reference",
|
||||
"searchresults-site-address-label": "Site address",
|
||||
"searchresults-applicant-label": "Appellant/Applicant",
|
||||
|
||||
Generated
+12879
-32
File diff suppressed because it is too large
Load Diff
@@ -75,4 +75,12 @@ const Home = (props) => {
|
||||
// };
|
||||
// };
|
||||
|
||||
export default Home; //connect(mapStateToProps)(Home);
|
||||
const mapStateToProps = (state) => {
|
||||
console.log(state);
|
||||
|
||||
return {
|
||||
search: state.search,
|
||||
};
|
||||
};
|
||||
|
||||
export default connect(mapStateToProps)(Home);
|
||||
|
||||
+41
-28
@@ -14,6 +14,8 @@ import Cookies from "cookies";
|
||||
import { useRouter } from "next/router";
|
||||
import useTranslation from "next-translate/useTranslation";
|
||||
|
||||
import { setSearch, getSearchObj } from "../store/search/action";
|
||||
|
||||
const Home = (props) => {
|
||||
const { footerLinks, pages } = props;
|
||||
let { t, lang } = useTranslation();
|
||||
@@ -33,7 +35,7 @@ const Home = (props) => {
|
||||
<Header courseName={t("common:service-name")} />
|
||||
<div className="govuk-width-container">
|
||||
<Banner />
|
||||
<SearchResults />
|
||||
<SearchResults searchString={props.search.searchString} />
|
||||
</div>
|
||||
<Footer footerLinks={footerLinks} />
|
||||
</div>
|
||||
@@ -41,38 +43,49 @@ const Home = (props) => {
|
||||
);
|
||||
};
|
||||
|
||||
export const getServerSideProps = wrapper.getServerSideProps(
|
||||
(store) =>
|
||||
({ req, res, query }) => {
|
||||
console.log(query);
|
||||
store.dispatch(setSearch(query.q));
|
||||
}
|
||||
);
|
||||
|
||||
// export const getServerSideProps = wrapper.getServerSideProps(
|
||||
// async ({ locale, store, req, res }) => {
|
||||
// const token = await getToken();
|
||||
// let accessToken = token.access_token;
|
||||
// async ({ locale, store, query, req, res }) => {
|
||||
// // const token = await getToken();
|
||||
// // let accessToken = token.access_token;
|
||||
|
||||
// const apiRoot = process.browser ? window.API_ROOT : process.env.API_ROOT;
|
||||
// // const apiRoot = process.browser ? window.API_ROOT : process.env.API_ROOT;
|
||||
|
||||
// const [pages, footerLinks, courseListContent] = await Promise.all([
|
||||
// await getPages(accessToken, locale),
|
||||
// await getFooterLinks(accessToken, locale),
|
||||
// await getCourseList(accessToken, locale),
|
||||
// ]);
|
||||
// //const courseID = await getCourseID
|
||||
// store.dispatch(setApiRoot(apiRoot));
|
||||
// store.dispatch(setPages(pages));
|
||||
// store.dispatch(setFooterLinks(footerLinks));
|
||||
// store.dispatch(setCourseListContent(courseListContent));
|
||||
// // const [pages, footerLinks, courseListContent] = await Promise.all([
|
||||
// // await getPages(accessToken, locale),
|
||||
// // await getFooterLinks(accessToken, locale),
|
||||
// // await getCourseList(accessToken, locale),
|
||||
// // ]);
|
||||
// // //const courseID = await getCourseID
|
||||
// // store.dispatch(setApiRoot(apiRoot));
|
||||
// // store.dispatch(setPages(pages));
|
||||
// // store.dispatch(setFooterLinks(footerLinks));
|
||||
// // store.dispatch(setCourseListContent(courseListContent));
|
||||
// console.log(query);
|
||||
// //store.dispatch(setSearch(query.search));
|
||||
// }
|
||||
// );
|
||||
|
||||
// const mapStateToProps = (state) => {
|
||||
// //console.log(state);
|
||||
const mapStateToProps = (state) => {
|
||||
console.log(state);
|
||||
|
||||
// return {
|
||||
// apiroot: state.apiroot,
|
||||
// courseListContent: state.courseListContent.courseListContent,
|
||||
// pages: state.pages.pages,
|
||||
// footerLinks: state.footerLinks.footerLinks,
|
||||
// regions: state.regions,
|
||||
// sectors: state.sectors,
|
||||
// form: state.form,
|
||||
// };
|
||||
// };
|
||||
return {
|
||||
search: state.search,
|
||||
// // apiroot: state.apiroot,
|
||||
// // courseListContent: state.courseListContent.courseListContent,
|
||||
// // pages: state.pages.pages,
|
||||
// // footerLinks: state.footerLinks.footerLinks,
|
||||
// // regions: state.regions,
|
||||
// // sectors: state.sectors,
|
||||
// // form: state.form,
|
||||
};
|
||||
};
|
||||
|
||||
export default Home; //connect(mapStateToProps)(Home);
|
||||
export default connect(mapStateToProps)(Home);
|
||||
|
||||
@@ -0,0 +1,18 @@
|
||||
export const searchActionTypes = {
|
||||
GETSEARCH: "GETSEARCH",
|
||||
SETSEARCH: "SETSEARCH",
|
||||
UPDATESEARCH: "UPDATESEARCH",
|
||||
};
|
||||
|
||||
export const getSearchObj = () => (dispatch) => {
|
||||
return dispatch({
|
||||
type: searchActionTypes.GETSEARCH,
|
||||
});
|
||||
};
|
||||
|
||||
export const setSearch = (search) => (dispatch) => {
|
||||
return dispatch({
|
||||
type: searchActionTypes.SETSEARCH,
|
||||
searchString: search,
|
||||
});
|
||||
};
|
||||
@@ -0,0 +1,16 @@
|
||||
import { searchActionTypes } from "./action";
|
||||
|
||||
const searchInitialState = {
|
||||
search: {},
|
||||
};
|
||||
|
||||
export default function reducer(state = searchInitialState, action) {
|
||||
switch (action.type) {
|
||||
case searchActionTypes.SETSEARCH:
|
||||
return {
|
||||
searchString: action.searchString,
|
||||
};
|
||||
default:
|
||||
return state;
|
||||
}
|
||||
}
|
||||
+3
-3
@@ -2,12 +2,14 @@ import { createStore, applyMiddleware, combineReducers } from "redux";
|
||||
import { createWrapper, HYDRATE } from "next-redux-wrapper";
|
||||
import thunkMiddleware from "redux-thunk";
|
||||
import progress from "./progress/reducer";
|
||||
import search from "./search/reducer";
|
||||
import { reducer as formReducer } from "redux-form";
|
||||
import autoMergeLevel2 from "redux-persist/lib/stateReconciler/autoMergeLevel2";
|
||||
|
||||
//COMBINING ALL REDUCERS
|
||||
const combinedReducer = combineReducers({
|
||||
progress,
|
||||
search,
|
||||
});
|
||||
|
||||
const reducer = (state = { progress: "{}" }, action) => {
|
||||
@@ -68,9 +70,7 @@ const makeStore = ({ isServer }) => {
|
||||
|
||||
const persistConfig = {
|
||||
key: "nextjs",
|
||||
whitelist: [
|
||||
"progress"
|
||||
],
|
||||
whitelist: ["progress,search"],
|
||||
storage,
|
||||
stateReconciler: autoMergeLevel2, // if needed, use a safer storage
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user