Merged PR 349: Create basic search and search results screen

Related work items: #5176

.gitignore

@@ -1,2 +1,3 @@
 node_modules
 .next
+package-lock.json

.vscode/launch.json

@@ -0,0 +1,15 @@
+{
+    // Use IntelliSense to learn about possible attributes.
+    // Hover to view descriptions of existing attributes.
+    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
+    "version": "0.2.0",
+    "configurations": [
+        {
+            "type": "pwa-chrome",
+            "request": "launch",
+            "name": "Launch Chrome against localhost",
+            "url": "https://localhost:3000",
+            "webRoot": "${workspaceFolder}"
+        }
+    ]
+}

actions/index.js

@@ -0,0 +1,166 @@
+import axios from "axios";
+import https from 'https';
+//import {XMLHttpRequest} from 'xmlhttprequest';
+
+process.env["NODE_TLS_REJECT_UNAUTHORIZED"] = 0
+
+
+const agent = new https.Agent({
+    rejectUnauthorized: false,
+    })
+const crmHeaders = {
+    withCredentials: true,
+    headers:{
+        "Content-Type": "application/json; charset=utf-8",
+        "OData-MaxVersion": "4.0",
+        "OData-Version": "4.0",
+        "Accept": "application/json",
+        "Prefer": "odata.include-annotations=\"*\"",
+        agent
+    },
+    auth:{
+        username: 'xm\bondr',
+        password: '!Sky9fish1972'
+    }
+}
+
+
+export const getBasicSearch = (searchString) => {
+    console.log('got to axios', searchString)
+
+    return axios
+    //.get("https://devcrm2016.llcdt.gov.wales/DVPINS/api/data/v8.2/incidents?$select=_accountid_value,_customerid_value,pinswg_appealcasetype,statuscode,ticketnumber,title&$filter=contains(title, '" + searchString + "')&$count=true", crmHeaders)
+    //.get("https://jsonplaceholder.typicode.com/todos/1",{proxy:{protocol: 'http',host:'lon3.sme.zscloud.net',port: 80}})
+    .get("https://localhost:3000/api/searchresults2",{httpsAgent: new https.Agent({rejectUnauthorized:false})})
+    .then((res)=>res.data)
+    .catch((error)=>{
+        console.log('thiserror',error)
+    })
+}
+
+export const getBasicSearch2 = (searchString) =>{
+
+
+    var req = new XMLHttpRequest();
+req.open("GET", "https://devcrm2016.llcdt.gov.wales/DVPINS/api/data/v8.2/incidents?$select=_accountid_value,_customerid_value,pinswg_appealcasetype,statuscode,ticketnumber,title&$filter=contains(title, '"+ searchString +"')&$count=true", true);
+req.setRequestHeader("OData-MaxVersion", "4.0");
+req.setRequestHeader("OData-Version", "4.0");
+req.setRequestHeader("Accept", "application/json");
+req.setRequestHeader("Content-Type", "application/json; charset=utf-8");
+req.setRequestHeader("Prefer", "odata.include-annotations=\"*\"");
+req.onreadystatechange = function() {
+    if (this.readyState === 4) {
+        req.onreadystatechange = null;
+        if (this.status === 200) {
+            var results = JSON.parse(this.response);
+            var recordCount = results["@odata.count"];
+            for (var i = 0; i < results.value.length; i++) {
+                var _accountid_value = results.value[i]["_accountid_value"];
+                var _accountid_value_formatted = results.value[i]["_accountid_value@OData.Community.Display.V1.FormattedValue"];
+                var _accountid_value_lookuplogicalname = results.value[i]["_accountid_value@Microsoft.Dynamics.CRM.lookuplogicalname"];
+                var _customerid_value = results.value[i]["_customerid_value"];
+                var _customerid_value_formatted = results.value[i]["_customerid_value@OData.Community.Display.V1.FormattedValue"];
+                var _customerid_value_lookuplogicalname = results.value[i]["_customerid_value@Microsoft.Dynamics.CRM.lookuplogicalname"];
+                var pinswg_appealcasetype = results.value[i]["pinswg_appealcasetype"];
+                var pinswg_appealcasetype_formatted = results.value[i]["pinswg_appealcasetype@OData.Community.Display.V1.FormattedValue"];
+                var statuscode = results.value[i]["statuscode"];
+                var ticketnumber = results.value[i]["ticketnumber"];
+                var title = results.value[i]["title"];
+            }
+        } else {
+           console.log(this.statusText);
+        }
+    }
+};
+return (req.send());
+
+}
+
+//get list of entitydefinitions
+//https://devcrm2016.llcdt.gov.wales/DVPINS/api/data/v8.2/EntityDefinitions?$select=LogicalName
+
+// get list of appealtypes
+//https://devcrm2016.llcdt.gov.wales/DVPINS/api/data/v8.2/stringmaps?$filter=attributename%20eq%20%27pinswg_appealcasetype%27&$count=true
+
+//get crm xml form for appealtype
+//https://devcrm2016.llcdt.gov.wales/DVPINS/api/data/v8.2/systemforms?$select=formid,name,formxml&$filter=(objecttypecode%20eq%20%27pinswg_dns%27and%20type%20eq%202)&$count=true
+// then use regex to remove the escape
+// convert xml to json and return 
+// promise example
+// var xml2js = require('xml2js');
+// var xml = '<foo></foo>';
+ 
+// // With parser
+// var parser = new xml2js.Parser(/* options */);
+// parser.parseStringPromise(data).then(function (result) {
+//   console.dir(result);
+//   console.log('Done');
+// })
+// .catch(function (err) {
+//   // Failed
+// });
+
+
+
+
+
+export const getAppealTypeDetail = (caseReference,appealcasetype) =>{   
+    console.log('got to axios', searchString)
+    // example appealcasetype type pinswg_householderappealhases
+    return axios
+    .get("https://devcrm2016.llcdt.gov.wales/DVPINS/api/data/v8.2/" + appealcasetype + "?$filter=pinswg_name eq '" + caseReference + "'",{httpsAgent: new https.Agent({rejectUnauthorized:false})})
+    .then((res)=>res.data)
+    .catch((error)=>{
+        console.log('thi serror',error)
+    })
+
+}
+//https://devcrm2016.llcdt.gov.wales/DVPINS/api/data/v8.2/pinswg_planningappeals78s?$filter=pinswg_name eq 'CAS-00015-L7J9H1'
+
+export const getLPA = () =>{   
+    console.log('got to axios', searchString)
+
+    return axios
+    .get("https://devcrm2016.llcdt.gov.wales/DVPINS/api/data/v8.2/accounts?$select=name",{httpsAgent: new https.Agent({rejectUnauthorized:false})})
+    .then((res)=>res.data)
+    .catch((error)=>{
+        console.log('thi serror',error)
+    })
+
+}
+
+
+
+
+// var req = new XMLHttpRequest();
+// req.open("GET", Xrm.Page.context.getClientUrl() + "/api/data/v8.2/incidents?$select=_accountid_value,_customerid_value,pinswg_appealcasetype,statuscode,ticketnumber,title&$filter=contains(title, '000')&$count=true", true);
+// req.setRequestHeader("OData-MaxVersion", "4.0");
+// req.setRequestHeader("OData-Version", "4.0");
+// req.setRequestHeader("Accept", "application/json");
+// req.setRequestHeader("Content-Type", "application/json; charset=utf-8");
+// req.setRequestHeader("Prefer", "odata.include-annotations=\"*\"");
+// req.onreadystatechange = function() {
+//     if (this.readyState === 4) {
+//         req.onreadystatechange = null;
+//         if (this.status === 200) {
+//             var results = JSON.parse(this.response);
+//             var recordCount = results["@odata.count"];
+//             for (var i = 0; i < results.value.length; i++) {
+//                 var _accountid_value = results.value[i]["_accountid_value"];
+//                 var _accountid_value_formatted = results.value[i]["_accountid_value@OData.Community.Display.V1.FormattedValue"];
+//                 var _accountid_value_lookuplogicalname = results.value[i]["_accountid_value@Microsoft.Dynamics.CRM.lookuplogicalname"];
+//                 var _customerid_value = results.value[i]["_customerid_value"];
+//                 var _customerid_value_formatted = results.value[i]["_customerid_value@OData.Community.Display.V1.FormattedValue"];
+//                 var _customerid_value_lookuplogicalname = results.value[i]["_customerid_value@Microsoft.Dynamics.CRM.lookuplogicalname"];
+//                 var pinswg_appealcasetype = results.value[i]["pinswg_appealcasetype"];
+//                 var pinswg_appealcasetype_formatted = results.value[i]["pinswg_appealcasetype@OData.Community.Display.V1.FormattedValue"];
+//                 var statuscode = results.value[i]["statuscode"];
+//                 var ticketnumber = results.value[i]["ticketnumber"];
+//                 var title = results.value[i]["title"];
+//             }
+//         } else {
+//             Xrm.Utility.alertDialog(this.statusText);
+//         }
+//     }
+// };
+// req.send();

certificates/certificate.crt

@@ -0,0 +1,22 @@
+-----BEGIN CERTIFICATE-----
+MIIDjTCCAnWgAwIBAgIUVcGexO0o2d+pgVMwkIdrnBI9L5QwDQYJKoZIhvcNAQEL
+BQAwVjELMAkGA1UEBhMCVUsxDzANBgNVBAgMBlN1c3NleDETMBEGA1UEBwwKRWFz
+dGJvdXJuZTEhMB8GA1UECgwYSW50ZXJuZXQgV2lkZ2l0cyBQdHkgTHRkMB4XDTIx
+MDcwNTExMTcwNVoXDTIyMDcwNTExMTcwNVowVjELMAkGA1UEBhMCVUsxDzANBgNV
+BAgMBlN1c3NleDETMBEGA1UEBwwKRWFzdGJvdXJuZTEhMB8GA1UECgwYSW50ZXJu
+ZXQgV2lkZ2l0cyBQdHkgTHRkMIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKC
+AQEAxzfQqGriUq8sKeWmgkgFssCDfsBLwijhP9nMVSCSwyWgxMZlGtj/Wbyf20Sl
+cg7X3jj2rGEWU3TkJtNUwjQcYRRK2+QlC3bQMIJEfe0JXqkeMWSwR3Fs0IE7lzYf
+CVHtcu7Z8muSEvinGULhg8jjBYp9mknjokjdwEy/eI7UYHEQx0sziapgAUITgSpL
+45qZvgw3BJShq/En3DYX0dIiX2yswagOFUBPtCeFaP3LsPh0kTOPxhv9Y3SxQfPV
+dTq3719HGVSLgQs18F82HxZeXjxAUqV+Sl5an5DnArRtFA3U34IDXkpc9RiLtoYb
+GDrJuyt1TzpAxoBr8Ld5ySRDqQIDAQABo1MwUTAdBgNVHQ4EFgQUNZqF/sycnZe5
+t6scKrWbEnW4Dc8wHwYDVR0jBBgwFoAUNZqF/sycnZe5t6scKrWbEnW4Dc8wDwYD
+VR0TAQH/BAUwAwEB/zANBgkqhkiG9w0BAQsFAAOCAQEALs3OiGk6Xj7d51rChPsg
+JL05Vj/DbI7Rr3jj2vGcNVd0GfIH9zrX0AMj6Uzxt8LCyI3QtrgzYSw9sKh9Q9I3
+3h7sIBm9zXV5gbMSG3rAl965ryiQt4INKUamz1XLQKvaMRvHD/DmRmIbFo399gYN
+duZQdwqdKavZ6wOw3GRmtjBlUzxO7DCrJMFsj7dfNqHSrZiwScNItArLecYeYQYg
+npjsvJekpSQLjvvjVuHLfEp+vNH6liL7qFFcBzUgwISFvcAI99e/zZtewkb3Vw+7
++7wbMgpibU1kbL9Bpru8PS89CsVGEh1TmzO3e8j1GnYAcnzRe70IzOTdMUE0AEg6
+FA==
+-----END CERTIFICATE-----

certificates/privateKey.key

@@ -0,0 +1,28 @@
+-----BEGIN PRIVATE KEY-----
+MIIEvgIBADANBgkqhkiG9w0BAQEFAASCBKgwggSkAgEAAoIBAQDHN9CoauJSrywp
+5aaCSAWywIN+wEvCKOE/2cxVIJLDJaDExmUa2P9ZvJ/bRKVyDtfeOPasYRZTdOQm
+01TCNBxhFErb5CULdtAwgkR97QleqR4xZLBHcWzQgTuXNh8JUe1y7tnya5IS+KcZ
+QuGDyOMFin2aSeOiSN3ATL94jtRgcRDHSzOJqmABQhOBKkvjmpm+DDcElKGr8Sfc
+NhfR0iJfbKzBqA4VQE+0J4Vo/cuw+HSRM4/GG/1jdLFB89V1OrfvX0cZVIuBCzXw
+XzYfFl5ePEBSpX5KXlqfkOcCtG0UDdTfggNeSlz1GIu2hhsYOsm7K3VPOkDGgGvw
+t3nJJEOpAgMBAAECggEBAKkkd5F25l+jgRC1fhEhS01AbKTCadAY215V8knYlSMB
+IKXReGg6E1vCbctCVmInvhpcLPugls8W8NsSFOWqTuoRy5k09Erufsag47wy9ACe
+ABeZ0J1n7SZ+gvTYq7NDDyLFLuDHekeHPICTK1uzxSSgOBI2aAISccxinTKjuieC
+eEtcBSu66g+cvyKGZglzfd4ugNDIaH9ibIFYPJzexw3lAz9j3mKpccxGsokFGw7T
+qwovML2I9+laD1N23H9lJ2YLr73uqusI0cxsCvGwRtBHHIEsR6aL43GAMG7TtWw/
+BoSECBZHRE+RxDjAab0XmrhcD3kf5v1DFk+Bnh+2rYECgYEA57w/tw9SmJ//PLMz
+6siHkx6vzvD2bdAKsinXkR987vYHmlpISKf2VeN02aj6BND2KM9OSCMNzaD+Hz0c
+Uv+5RInpr4LpBmDiRPOyTkJjFEuM1ZSgAm01wGY8k8CuHnZs3ueJaSZMmCXmEC8G
+F4v/K+nMiOcbl8f23tUOmmJ1KnECgYEA3BPtb64DfBTcnbGvBzZU1WoPOWe8ujFg
+yjICX4elKr2jlOzrdw4eU4peU3jVXl+sDPw++NKWUimhdcuimLF7lfOi3VUM8DWr
+cCMWfvwFc7URv/42UltN58p6/FceU5WzF+785r8N2tyOtKi81Dsz5uDIytMuqmft
+MRlu56FeGLkCgYAiyklKg1tkHIkmJMVDl017Ud0VFWn5vIUOkGeTmwWXnoovqyQ0
+/DpoVJijYNIATRrXr5/SBqk42NWt/O+2qju3RXk251FyqrLtpSR8yUy0rE79da28
+D4dFVlP73q6FVkQsBtjDV4OiR/ZNMbIZcOQjRJt3ZjLnS5cNhzEFDokGkQKBgQCm
+th295NbU7sS0XD4XO4wF4oLH3JJ1hSQp5rovfYSbnO5GyTYRiMtmQ0Hy/2y6QcUG
+TSqyuGuQr+KUZf60pnXVAKtV+LCFYlKM7reC2AyVOwvIIZ0qw+l+9b42WxQpAxSY
+w7wmW4H2Ue90YQIxzushMRRJuLH3+iQOdpKxumaaWQKBgH5HMvJLiueY1pRMomnQ
+fAirquPPeqILTGmnfNhNm+8Fv2HHNUHmfSdMOxK15g+RPEJRDERRDhdLHOep0Lx9
+AVcINmkeQVChWcPu1LwoNt0c0AZbB/vDUSh5GadC/dFV85xb58C+Fc7WYvOIYwS4
+KvvWnCWcue5qxZCd2G+6oNx/
+-----END PRIVATE KEY-----

components/homepage/casesearch.js

@@ -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">
+                        <button type="submit" className="govuk-button">
-                        <a className="govuk-button">
                             {t("home:casesearch-card-button")}
-                        </a>
+                        </button>
-                    </Link>
                     </div>
                     <Link href="/advancedsearch">
                         <a>{t("home:casesearch-card-advanced-link")}</a>
                     </Link>
                 </div>
+            </form>
         </div>
     );
 }

components/myportal/searchcases.js

@@ -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">
+                        <button
-                        <a className="govuk-button">
+                            type="submit"
+                            name="search"
+                            className="govuk-button"
+                        >
                             {t("myportal:searchcases-card-button")}
-                        </a>
+                        </button>
-                    </Link>
                     </div>
                     <Link href="/advancedsearch">
                         <a>{t("myportal:searchcases-card-advanced-link")}</a>
                     </Link>
                 </div>
+            </form>
         </div>
     );
 }

components/search.js

@@ -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>
     );
 }

components/search/advancedsearch.js

@@ -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>
     );
 }

components/search/searchresults.js

@@ -2,11 +2,62 @@ 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, 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">
@@ -14,8 +65,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", { count: props.searchResultsObj.searchResultsObj["@odata.count"].toString()})}. You
-                    {t("search:searchresults-count-label-part-2")}
+                    searched for <em>"{searchString}"</em>
                 </p>
                 <dl className="govuk-summary-list govuk-!-margin-bottom-9 results">
                     <div className="govuk-summary-list__row results-headings">
@@ -38,6 +89,9 @@ export default function SearchResults() {
                             {t("search:searchresults-status-label")}
                         </dd>
                     </div>
+                       
+                        { resultsArr.map((item,key) => {
+                           return(
         <div className="govuk-summary-list__row">
         <dd className="govuk-summary-list__value govuk-!-font-size-14  govuk-!-padding-left-2">
             <Link href="/case">
@@ -45,7 +99,7 @@ export default function SearchResults() {
                     <span className="results-visually-hidden">
                         Case Reference:
                     </span>
-                                    APP/Z2830/D/21/3272770
+                    {item.title}
                 </a>
             </Link>
         </dd>
@@ -68,201 +122,24 @@ export default function SearchResults() {
             <span className="results-visually-hidden">
                 Authority:
             </span>
-                            Hastings Borough Council{" "}
+            {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>
-                            Planning (W){" "}
+           {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>
-                            In Progress
+            {item.["statuscode@OData.Community.Display.V1.FormattedValue"]}
-                        </dd>
-                    </div>
-                    <div className="govuk-summary-list__row">
-                        <dd className="govuk-summary-list__value govuk-!-font-size-14  govuk-!-padding-left-2">
-                            <Link href="/">
-                                <a>
-                                    <span className="results-visually-hidden">
-                                        Case Reference:
-                                    </span>
-                                    APP/Z2830/D/21/3272770
-                                </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>
-                    <div className="govuk-summary-list__row">
-                        <dd className="govuk-summary-list__value govuk-!-font-size-14  govuk-!-padding-left-2">
-                            <Link href="/">
-                                <a>
-                                    <span className="results-visually-hidden">
-                                        Case Reference:
-                                    </span>
-                                    APP/Z2830/D/21/3272770
-                                </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>
-                    <div className="govuk-summary-list__row">
-                        <dd className="govuk-summary-list__value govuk-!-font-size-14  govuk-!-padding-left-2">
-                            <Link href="/">
-                                <a>
-                                    <span className="results-visually-hidden">
-                                        Case Reference:
-                                    </span>
-                                    APP/Z2830/D/21/3272770
-                                </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>
-                    <div className="govuk-summary-list__row">
-                        <dd className="govuk-summary-list__value govuk-!-font-size-14  govuk-!-padding-left-2">
-                            <Link href="/">
-                                <a>
-                                    <span className="results-visually-hidden">
-                                        Case Reference:
-                                    </span>
-                                    APP/Z2830/D/21/3272770
-                                </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>
+                           )
+    })}
+
      </dl>
             </div>
         </div>

components/searchresults.js

@@ -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, searchResultsObj } = 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} searchResultsObj={searchResultsObj}/>
                 </div>
             </div>
             <div className="govuk-grid-row">

locales/cy/search.json

@@ -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": "Cafodd eich chwiliad {{count}} o ganlyniadau",
-    "searchresults-count-label-part-2": "o ganlyniadau",
     "searchresults-case-reference-label": "Cyfeirnod yr Achos",
     "searchresults-site-address-label": "Cyfeiriad y Safle",
     "searchresults-applicant-label": "Apelydd/Ymgeisydd",

locales/en/search.json

@@ -46,12 +46,11 @@
     "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": "Your search returned {{count}} results",
-    "searchresults-count-label-part-2": "results",
     "searchresults-case-reference-label": "Case reference",
     "searchresults-site-address-label": "Site address",
     "searchresults-applicant-label": "Appellant/Applicant",
-    "searchresults-authority-label": "Authorty",
+    "searchresults-authority-label": "Authority",
     "searchresults-case-type-label": "Case type",
     "searchresults-status-label": "Status",
     "searchresults-watch-label": "Watch",

package.json

@@ -3,7 +3,7 @@
   "version": "0.1.0",
   "private": true,
   "scripts": {
-    "dev": "next dev",
+    "dev": "node server.js",
     "build": "next build",
     "start": "next start"
   },
@@ -11,7 +11,9 @@
     "@webdeb/next-styles": "^1.1.1",
     "axios": "^0.21.1",
     "cookies": "^0.8.0",
+    "dynamics-web-api": "^1.7.4",
     "govuk-frontend": "^3.13.0",
+    "https": "^1.0.0",
     "jsonpath": "^1.1.1",
     "jsonpath-plus": "^5.1.0",
     "lodash": "^4.17.21",
@@ -29,7 +31,9 @@
     "redux-thunk": "^2.3.0",
     "sass": "^1.35.1",
     "sass-loader": "^12.1.0",
-    "webpack": "^5.40.0"
+    "webpack": "^5.40.0",
+    "xml2js": "^0.4.23",
+    "xmlhttprequest": "^1.8.0"
   },
   "devDependencies": {
     "eslint": "^7.29.0",

pages/advancedsearch.js

@@ -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);

pages/api/searchresults.js

@@ -0,0 +1,101 @@
+export default(req, res) =>{
+    res.statusCode= 200;
+    res.json(
+        {
+            "@odata.context": "https://devcrm2016.llcdt.gov.wales/DVPINS/api/data/v8.2/$metadata#incidents(_accountid_value,_customerid_value,pinswg_appealcasetype,statuscode,ticketnumber,title)",
+            "@odata.count": 9,
+            "value": [
+            {
+            "@odata.etag": "W/\"704047\"",
+            "_accountid_value": null,
+            "_customerid_value": "56e7ef63-7e64-eb11-aaba-00224800be9c",
+            "pinswg_appealcasetype": 846040000,
+            "statuscode": 1,
+            "ticketnumber": "CAS-00009-W8N6W4",
+            "title": "CAS-00009-W8N6W4",
+            "incidentid": "9919eac3-21af-eb11-aac3-00224800be9c"
+            },
+            {
+            "@odata.etag": "W/\"704095\"",
+            "_accountid_value": null,
+            "_customerid_value": "56e7ef63-7e64-eb11-aaba-00224800be9c",
+            "pinswg_appealcasetype": 846040011,
+            "statuscode": 1,
+            "ticketnumber": "CAS-00010-J9W6L5",
+            "title": "CAS-00010-J9W6L5",
+            "incidentid": "55f4fc74-33af-eb11-aac3-00224800be9c"
+            },
+            {
+            "@odata.etag": "W/\"709250\"",
+            "_accountid_value": null,
+            "_customerid_value": "41fead24-29ba-eb11-aac4-00224800be9c",
+            "pinswg_appealcasetype": 846040001,
+            "statuscode": 1,
+            "ticketnumber": "CAS-00011-K1N0J8",
+            "title": "CAS-00011-K1N0J8",
+            "incidentid": "6bd04d33-29ba-eb11-aac4-00224800be9c"
+            },
+            {
+            "@odata.etag": "W/\"710463\"",
+            "_accountid_value": null,
+            "_customerid_value": "56e7ef63-7e64-eb11-aaba-00224800be9c",
+            "pinswg_appealcasetype": 846040000,
+            "statuscode": 1,
+            "ticketnumber": "CAS-00012-D9W6S8",
+            "title": "CAS-00012-D9W6S8",
+            "incidentid": "b9c9cbe4-6abc-eb11-aac4-00224800be9c"
+            },
+            {
+            "@odata.etag": "W/\"746096\"",
+            "_accountid_value": null,
+            "_customerid_value": "80d99a34-82ad-eb11-aac3-00224800be9c",
+            "pinswg_appealcasetype": 846040025,
+            "statuscode": 1,
+            "ticketnumber": "CAS-00013-Z0B5Z9",
+            "title": "CAS-00013-Z0B5Z9",
+            "incidentid": "34071ec4-54d3-eb11-aac5-00224800be9c"
+            },
+            {
+            "@odata.etag": "W/\"749764\"",
+            "_accountid_value": null,
+            "_customerid_value": "56e7ef63-7e64-eb11-aaba-00224800be9c",
+            "pinswg_appealcasetype": 846040021,
+            "statuscode": 1,
+            "ticketnumber": "CAS-00014-S3L9B4",
+            "title": "CAS-00014-S3L9B4",
+            "incidentid": "2230700b-ebd7-eb11-aac5-00224800be9c"
+            },
+            {
+            "@odata.etag": "W/\"750875\"",
+            "_accountid_value": null,
+            "_customerid_value": "cfb7b446-a7d8-eb11-aac5-00224800be9c",
+            "pinswg_appealcasetype": 846040000,
+            "statuscode": 1,
+            "ticketnumber": "CAS-00015-L7J9H1",
+            "title": "CAS-00015-L7J9H1",
+            "incidentid": "d5b7b446-a7d8-eb11-aac5-00224800be9c"
+            },
+            {
+            "@odata.etag": "W/\"755001\"",
+            "_accountid_value": null,
+            "_customerid_value": "cfb7b446-a7d8-eb11-aac5-00224800be9c",
+            "pinswg_appealcasetype": 846040004,
+            "statuscode": 1,
+            "ticketnumber": "CAS-00016-Y9K9Q0",
+            "title": "CAS-00016-Y9K9Q0",
+            "incidentid": "cc6f93ea-bdd9-eb11-aac5-00224800be9c"
+            },
+            {
+            "@odata.etag": "W/\"755216\"",
+            "_accountid_value": null,
+            "_customerid_value": "243c0009-49da-eb11-aac5-00224800be9c",
+            "pinswg_appealcasetype": 846040004,
+            "statuscode": 1,
+            "ticketnumber": "CAS-00017-B8X7N0",
+            "title": "CAS-00017-B8X7N0",
+            "incidentid": "73895a1b-68dd-eb11-aac5-00224800be9c"
+            }
+            ]
+            }     
+    )
+};

pages/api/searchresults2.js

@@ -0,0 +1,146 @@
+export default(req, res) =>{
+    res.statusCode= 200;
+    res.json(
+        {
+            "@odata.context": "https://devcrm2016.llcdt.gov.wales/DVPINS/api/data/v8.2/$metadata#incidents(_accountid_value,_customerid_value,pinswg_appealcasetype,statuscode,ticketnumber,title)",
+            "@odata.count": "9",
+            "value": [
+              {
+                "@odata.etag": "W/\"704047\"",
+                "_accountid_value": null,
+                "_customerid_value@OData.Community.Display.V1.FormattedValue": "Bridgend CBC",
+                "_customerid_value@Microsoft.Dynamics.CRM.associatednavigationproperty": "customerid_account",
+                "_customerid_value@Microsoft.Dynamics.CRM.lookuplogicalname": "account",
+                "_customerid_value": "56e7ef63-7e64-eb11-aaba-00224800be9c",
+                "pinswg_appealcasetype@OData.Community.Display.V1.FormattedValue": "Planning Appeal - S78",
+                "pinswg_appealcasetype": "846040000",
+                "statuscode@OData.Community.Display.V1.FormattedValue": "In Progress",
+                "statuscode": "1",
+                "ticketnumber": "CAS-00009-W8N6W4",
+                "title": "CAS-00009-W8N6W4",
+                "incidentid": "9919eac3-21af-eb11-aac3-00224800be9c"
+              },
+              {
+                "@odata.etag": "W/\"704095\"",
+                "_accountid_value": null,
+                "_customerid_value@OData.Community.Display.V1.FormattedValue": "Bridgend CBC",
+                "_customerid_value@Microsoft.Dynamics.CRM.associatednavigationproperty": "customerid_account",
+                "_customerid_value@Microsoft.Dynamics.CRM.lookuplogicalname": "account",
+                "_customerid_value": "56e7ef63-7e64-eb11-aaba-00224800be9c",
+                "pinswg_appealcasetype@OData.Community.Display.V1.FormattedValue": "DNS",
+                "pinswg_appealcasetype": "846040011",
+                "statuscode@OData.Community.Display.V1.FormattedValue": "In Progress",
+                "statuscode": "1",
+                "ticketnumber": "CAS-00010-J9W6L5",
+                "title": "CAS-00010-J9W6L5",
+                "incidentid": "55f4fc74-33af-eb11-aac3-00224800be9c"
+              },
+              {
+                "@odata.etag": "W/\"709250\"",
+                "_accountid_value": null,
+                "_customerid_value@OData.Community.Display.V1.FormattedValue": "Zoe",
+                "_customerid_value@Microsoft.Dynamics.CRM.associatednavigationproperty": "customerid_account",
+                "_customerid_value@Microsoft.Dynamics.CRM.lookuplogicalname": "account",
+                "_customerid_value": "41fead24-29ba-eb11-aac4-00224800be9c",
+                "pinswg_appealcasetype@OData.Community.Display.V1.FormattedValue": "Planning Conditions - S73 + S79",
+                "pinswg_appealcasetype": "846040001",
+                "statuscode@OData.Community.Display.V1.FormattedValue": "In Progress",
+                "statuscode": "1",
+                "ticketnumber": "CAS-00011-K1N0J8",
+                "title": "CAS-00011-K1N0J8",
+                "incidentid": "6bd04d33-29ba-eb11-aac4-00224800be9c"
+              },
+              {
+                "@odata.etag": "W/\"710463\"",
+                "_accountid_value": null,
+                "_customerid_value@OData.Community.Display.V1.FormattedValue": "Bridgend CBC",
+                "_customerid_value@Microsoft.Dynamics.CRM.associatednavigationproperty": "customerid_account",
+                "_customerid_value@Microsoft.Dynamics.CRM.lookuplogicalname": "account",
+                "_customerid_value": "56e7ef63-7e64-eb11-aaba-00224800be9c",
+                "pinswg_appealcasetype@OData.Community.Display.V1.FormattedValue": "Planning Appeal - S78",
+                "pinswg_appealcasetype": "846040000",
+                "statuscode@OData.Community.Display.V1.FormattedValue": "In Progress",
+                "statuscode": "1",
+                "ticketnumber": "CAS-00012-D9W6S8",
+                "title": "CAS-00012-D9W6S8",
+                "incidentid": "b9c9cbe4-6abc-eb11-aac4-00224800be9c"
+              },
+              {
+                "@odata.etag": "W/\"74609\"",
+                "_accountid_value": null,
+                "_customerid_value@OData.Community.Display.V1.FormattedValue": "Barry Boys High School",
+                "_customerid_value@Microsoft.Dynamics.CRM.associatednavigationproperty": "customerid_account",
+                "_customerid_value@Microsoft.Dynamics.CRM.lookuplogicalname": "account",
+                "_customerid_value": "80d99a34-82ad-eb11-aac3-00224800be9c",
+                "pinswg_appealcasetype@OData.Community.Display.V1.FormattedValue": "Listed Building and Convention S73 + S79",
+                "pinswg_appealcasetype": "846040025",
+                "statuscode@OData.Community.Display.V1.FormattedValue": "In Progress",
+                "statuscode": "1",
+                "ticketnumber": "CAS-00013-Z0B5Z9",
+                "title": "CAS-00013-Z0B5Z9",
+                "incidentid": "34071ec4-54d3-eb11-aac5-00224800be9c"
+              },
+              {
+                "@odata.etag": "W/\"749764\"",
+                "_accountid_value": null,
+                "_customerid_value@OData.Community.Display.V1.FormattedValue": "Bridgend CBC",
+                "_customerid_value@Microsoft.Dynamics.CRM.associatednavigationproperty": "customerid_account",
+                "_customerid_value@Microsoft.Dynamics.CRM.lookuplogicalname": "account",
+                "_customerid_value": "56e7ef63-7e64-eb11-aaba-00224800be9c",
+                "pinswg_appealcasetype@OData.Community.Display.V1.FormattedValue": "Wayleave",
+                "pinswg_appealcasetype": "846040021",
+                "statuscode@OData.Community.Display.V1.FormattedValue": "In Progress",
+                "statuscode": "1",
+                "ticketnumber": "CAS-00014-S3L9B4",
+                "title": "CAS-00014-S3L9B4",
+                "incidentid": "2230700b-ebd7-eb11-aac5-00224800be9c"
+              },
+              {
+                "@odata.etag": "W/\"750875\"",
+                "_accountid_value": null,
+                "_customerid_value@OData.Community.Display.V1.FormattedValue": "test customer",
+                "_customerid_value@Microsoft.Dynamics.CRM.associatednavigationproperty": "customerid_contact",
+                "_customerid_value@Microsoft.Dynamics.CRM.lookuplogicalname": "contact",
+                "_customerid_value": "cfb7b446-a7d8-eb11-aac5-00224800be9c",
+                "pinswg_appealcasetype@OData.Community.Display.V1.FormattedValue": "Planning Appeal - S78",
+                "pinswg_appealcasetype": "846040000",
+                "statuscode@OData.Community.Display.V1.FormattedValue": "In Progress",
+                "statuscode": "1",
+                "ticketnumber": "CAS-00015-L7J9H1",
+                "title": "CAS-00015-L7J9H1",
+                "incidentid": "d5b7b446-a7d8-eb11-aac5-00224800be9c"
+              },
+              {
+                "@odata.etag": "W/\"755001\"",
+                "_accountid_value": null,
+                "_customerid_value@OData.Community.Display.V1.FormattedValue": "test customer",
+                "_customerid_value@Microsoft.Dynamics.CRM.associatednavigationproperty": "customerid_contact",
+                "_customerid_value@Microsoft.Dynamics.CRM.lookuplogicalname": "contact",
+                "_customerid_value": "cfb7b446-a7d8-eb11-aac5-00224800be9c",
+                "pinswg_appealcasetype@OData.Community.Display.V1.FormattedValue": "Householder Appeal (HAS)",
+                "pinswg_appealcasetype": "846040004",
+                "statuscode@OData.Community.Display.V1.FormattedValue": "In Progress",
+                "statuscode": "1",
+                "ticketnumber": "CAS-00016-Y9K9Q0",
+                "title": "CAS-00016-Y9K9Q0",
+                "incidentid": "cc6f93ea-bdd9-eb11-aac5-00224800be9c"
+              },
+              {
+                "@odata.etag": "W/\"755216\"",
+                "_accountid_value": null,
+                "_customerid_value@OData.Community.Display.V1.FormattedValue": "Caerphilly County Borough Council",
+                "_customerid_value@Microsoft.Dynamics.CRM.associatednavigationproperty": "customerid_account",
+                "_customerid_value@Microsoft.Dynamics.CRM.lookuplogicalname": "account",
+                "_customerid_value": "243c0009-49da-eb11-aac5-00224800be9c",
+                "pinswg_appealcasetype@OData.Community.Display.V1.FormattedValue": "Householder Appeal (HAS)",
+                "pinswg_appealcasetype": "846040004",
+                "statuscode@OData.Community.Display.V1.FormattedValue": "In Progress",
+                "statuscode": "1",
+                "ticketnumber": "CAS-00017-B8X7N0",
+                "title": "CAS-00017-B8X7N0",
+                "incidentid": "73895a1b-68dd-eb11-aac5-00224800be9c"
+              }
+            ]
+          }  
+    )
+};

pages/searchresults.js

@@ -14,6 +14,10 @@ import Cookies from "cookies";
 import { useRouter } from "next/router";
 import useTranslation from "next-translate/useTranslation";
 
+import { setSearch, getSearchObj } from "../store/search/action";
+import { setSearchResults, getSearchResultsObj } from "../store/searchOutput/action";
+import {getBasicSearch} from "../actions"
+
 const Home = (props) => {
     const { footerLinks, pages } = props;
     let { t, lang } = useTranslation();
@@ -33,7 +37,7 @@ const Home = (props) => {
                 <Header courseName={t("common:service-name")} />
                 <div className="govuk-width-container">
                     <Banner />
-                    <SearchResults />
+                    <SearchResults searchString={props.search.searchString} searchResultsObj={props.searchResultsObj} />
                 </div>
                 <Footer footerLinks={footerLinks} />
             </div>
@@ -41,38 +45,52 @@ const Home = (props) => {
     );
 };
 
+export  const getServerSideProps = wrapper.getServerSideProps (
+     store => async({ query, req, res }) => 
+        {
+            console.log('query-',query); 
+            const searchResultsObj = await getBasicSearch(query.q) || null;
+             store.dispatch(setSearchResults(searchResultsObj));
+             store.dispatch(setSearch(query.q));
+        }
+);
+
 // export const getServerSideProps = wrapper.getServerSideProps(
-//   async ({ locale, store, req, res }) => {
+//     async ({ locale, store, query, req, res }) => {
-//     const token = await getToken();
+//         //     const token = await getToken();
-//     let accessToken = token.access_token;
+//         //     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([
+//         //     const [pages, footerLinks, courseListContent] = await Promise.all([
-//       await getPages(accessToken, locale),
+//         //       await getPages(accessToken, locale),
-//       await getFooterLinks(accessToken, locale),
+//         //       await getFooterLinks(accessToken, locale),
-//       await getCourseList(accessToken, locale),
+//         //       await getCourseList(accessToken, locale),
-//     ]);
+//         //     ]);
-//     //const courseID = await getCourseID
+//         //     //const courseID = await getCourseID
-//     store.dispatch(setApiRoot(apiRoot));
+//         //     store.dispatch(setApiRoot(apiRoot));
-//     store.dispatch(setPages(pages));
+//         //     store.dispatch(setPages(pages));
-//     store.dispatch(setFooterLinks(footerLinks));
+//         //     store.dispatch(setFooterLinks(footerLinks));
-//     store.dispatch(setCourseListContent(courseListContent));
+//         //     store.dispatch(setCourseListContent(courseListContent));
+//         console.log(query);
+//         //store.dispatch(setSearch(query.search));
 //     }
 // );
 
-// const mapStateToProps = (state) => {
+const mapStateToProps = (state) => {
-//   //console.log(state);
+    console.log('mapstate',state);
 
-//   return {
+    return {
-//     apiroot: state.apiroot,
+        search: state.search,
-//     courseListContent: state.courseListContent.courseListContent,
+        searchResultsObj: state.searchResultsObj
-//     pages: state.pages.pages,
+        //         //     apiroot: state.apiroot,
-//     footerLinks: state.footerLinks.footerLinks,
+        //         //     courseListContent: state.courseListContent.courseListContent,
-//     regions: state.regions,
+        //         //     pages: state.pages.pages,
-//     sectors: state.sectors,
+        //         //     footerLinks: state.footerLinks.footerLinks,
-//     form: state.form,
+        //         //     regions: state.regions,
-//   };
+        //         //     sectors: state.sectors,
-// };
+        //         //     form: state.form,
+    };
+};
 
-export default Home; //connect(mapStateToProps)(Home);
+export default connect(mapStateToProps)(Home);

server.js

@@ -0,0 +1,25 @@
+const { createServer } = require('https');
+const { parse } = require('url');
+const { readFileSync } = require('fs');
+const next = require('next');
+
+const port = 3000;
+const dev = process.env.NODE_ENV !== 'production';
+const app = next({ dev });
+const handle = app.getRequestHandler();
+
+const httpsOptions = {
+  key: readFileSync('./certificates/privateKey.key'),
+  cert: readFileSync('./certificates/certificate.crt')
+};
+
+app.prepare()
+  .then(() => {
+    createServer(httpsOptions, (req, res) => {
+      const parsedUrl = parse(req.url, true);
+      handle(req, res, parsedUrl);
+    }).listen(port, err => {
+      if (err) throw err;
+      console.log(`> Ready on https://localhost:${port}`);
+    })
+  });

store/search/action.js

@@ -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,
+    });
+};

store/search/reducer.js

@@ -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;
+    }
+}

store/searchOutput/action.js

@@ -0,0 +1,18 @@
+export const searchResultsActionTypes = {
+    GETSEARCHRESULTS: "GETSEARCHRESULTS",
+    SETSEARCHRESULTS: "SETSEARCHRESULTS",
+    UPDATESEARCHRESULTS: "UPDATESEARCHRESULTS",
+};
+
+export const getSearchResultshObj = () => (dispatch) => {
+    return dispatch({
+        type: searchResultsActionTypes.GETSEARCHRESULTS,
+    });
+};
+
+export const setSearchResults = (searchResults) => (dispatch) => {
+    return dispatch({
+        type: searchResultsActionTypes.SETSEARCHRESULTS,
+        searchResultsObj: searchResults,
+    });
+};

store/searchOutput/reducer.js

@@ -0,0 +1,16 @@
+import { searchResultsActionTypes } from "./action";
+
+const searchResultsInitialState = {
+    searchResultsObj: {},
+};
+
+export default function reducer(state = searchResultsInitialState, action) {
+    switch (action.type) {
+        case searchResultsActionTypes.SETSEARCHRESULTS:
+            return {
+                searchResultsObj: action.searchResultsObj,
+            };
+        default:
+            return state;
+    }
+}

store/store.js

@@ -2,12 +2,16 @@ 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 searchResultsObj from "./searchOutput/reducer";
 import { reducer as formReducer } from "redux-form";
 import autoMergeLevel2 from "redux-persist/lib/stateReconciler/autoMergeLevel2";
 
 //COMBINING ALL REDUCERS
 const combinedReducer = combineReducers({
     progress,
+    search,
+    searchResultsObj
 });
 
 const reducer = (state = { progress: "{}" }, action) => {
@@ -68,9 +72,7 @@ const makeStore = ({ isServer }) => {
 
         const persistConfig = {
             key: "nextjs",
-      whitelist: [
+            whitelist: ["progress,search,searchResults"],
-        "progress"
-      ],
             storage,
             stateReconciler: autoMergeLevel2, // if needed, use a safer storage
         };