Merged PR 799: pagination on dns results fix

pagination on dns results fix

Related work items: #7427

.env.local

@@ -4,7 +4,7 @@ ACCESS_TOKEN_ENDPOINT = https://login.microsoftonline.com/
 //ESNR Tenant
 TENANT = a8d860de-d5e1-45af-8376-d93f02e6b502
 //WGO Tenant
-TENANT = 9ac1a5ab-cd58-409e-a1b6-6b10422a68f5
+//TENANT = 9ac1a5ab-cd58-409e-a1b6-6b10422a68f5
 GRANT_TYPE = "client_credentials"
 
 HASHKEY = 028ffbae928d7191c0017f298260995f901d78eabde1436c0af0423459cc3715832136d84f68818d3a96399467b52143e273d4f3bf4ae190848891535421cd6c
@@ -37,11 +37,11 @@ RELAYPATH = "test-pedw-hc"
 
 
 //Prod Oauth WGO
-CLIENT_ID = 3e4141a3-1fbd-454e-98f0-7f3a4f14a3cc
-CLIENT_SECRET = mJN7Q~lFu.xFGa5KCc.zwIm_fJAWxajyQaFo~
-RELAY_ROOT = https://prod-pedw-ns.servicebus.windows.net/prod-pedw-hc/
-RELAYURI = "prod-pedw-ns.servicebus.windows.net"
-RELAYPATH = "prod-pedw-hc"
+//CLIENT_ID = 3e4141a3-1fbd-454e-98f0-7f3a4f14a3cc
+//CLIENT_SECRET = mJN7Q~lFu.xFGa5KCc.zwIm_fJAWxajyQaFo~
+//RELAY_ROOT = https://prod-pedw-ns.servicebus.windows.net/prod-pedw-hc/
+//RELAYURI = "prod-pedw-ns.servicebus.windows.net"
+//RELAYPATH = "prod-pedw-hc"
 
 
 GOOGLE_TAG_MANAGER = GTM-T78CBC3
@@ -63,7 +63,8 @@ I18N_DOMAIN = "cymru.local"
 GG_PROVIDER_CONFIG_ENDPOINT = "https://api.ete.access.service.gov.uk/.well-known/openid-configuration"
 GG_CLIENT_ID = 5vTukeSpN7d6uBV7YLb7A5wOctzzkZ
 GG_CLIENT_SECRET = z1PGLAKPxIhjMBegTdzX22AayIORc1GsCbMQZ6mieBn7zChjzzxup5lkIByEmsYS
-GG_REDIRECT_URI = "http://localhost:3000"
+//GG_REDIRECT_URI = "http://localhost:3000"
+GG_REDIRECT_URI = "https://dev-planningcasework.service.gov.wales"
 
 NEXT_PUBLIC_GG_CLIENT_ID = 5vTukeSpN7d6uBV7YLb7A5wOctzzkZ
 NEXT_PUBLIC_GG_REDIRECT_URI = "http://localhost:3000"

actions/index.js

@@ -183,7 +183,12 @@ export const getBasicDNSSearch = (searchString) => {
         });
 };
 
-export const getBasicDNSSearchPaged = (pageNumber, orderBy, fieldSort) => {
+export const getBasicDNSSearchPaged = (
+    pageNumber,
+    orderBy,
+    fieldSort,
+    showNumberOfRecords
+) => {
     return axios
         .get(
             "/api/endpoint/getbasicdnssearchpaged_api?pageNumber=" +
@@ -191,7 +196,9 @@ export const getBasicDNSSearchPaged = (pageNumber, orderBy, fieldSort) => {
                 "&orderby=" +
                 orderBy +
                 "&fieldSort=" +
-                fieldSort
+                fieldSort +
+                "&showNumberOfRecords=" +
+                showNumberOfRecords
         )
         .then((res) => res.data)
         .catch((error) => {
@@ -775,6 +782,8 @@ export const updateCase = async (
         data: data,
     };
 
+    console.log(data);
+
     return axios(config)
         .then((res) => {
             return res.data;

components/search/dnssearchresults.js

@@ -38,6 +38,7 @@ const DNSSearchResults = (props) => {
 
     var resultsArr = searchResultsObj.value || [];
 
+    const [searchLoaded, setSearchLoaded] = useState(false);
     const [showSpinnerState, setShowSpinnerState] = useState(false);
 
     let spinnerState = () => {
@@ -311,7 +312,7 @@ const DNSSearchResults = (props) => {
     const getSearchPageResults = (pageNumber, orderBy, fieldSort) => {
         //console.log(advancedSearch, searchString, pageNumber);
 
-        getBasicDNSSearchPaged(pageNumber, orderBy, fieldSort)
+        getBasicDNSSearchPaged(pageNumber, orderBy, fieldSort, selectedOption)
             .then((data) => {
                 return data;
             })
@@ -338,9 +339,13 @@ const DNSSearchResults = (props) => {
     };
 
     useEffect(() => {
-        if (selectedOption) {
-            setShowSpinnerState(true);
-            getSearchPageResults(1, orderByState, fieldSortState);
+        if (searchLoaded) {
+            if (selectedOption) {
+                setShowSpinnerState(true);
+                getSearchPageResults(1, orderByState, fieldSortState);
+            }
+        } else {
+            setSearchLoaded(true);
         }
     }, [selectedOption]);
     return (
@@ -362,29 +367,31 @@ const DNSSearchResults = (props) => {
                     </ul>
                 </div>
             </div>
-            <div id="recordCountSelect" className="govuk-grid-row">
-                <div className="govuk-form-group">
-                    <label className="govuk-label-s " htmlFor="sort">
-                        {t("search:searchresults-show-records-label-a")}
-                        <select
-                            onChange={(e) => {
-                                setSelectedOption(e.target.value);
-                            }}
-                            value={selectedOption}
-                            className="govuk-select"
-                            id="showNumberOfRecords"
-                            name="showNumberOfRecords"
-                        >
-                            <option value="5">5</option>
-                            <option value="10">10</option>
-                            <option value="20">20</option>
-                            <option value="30">30</option>
-                            <option value="50">50</option>
-                        </select>{" "}
-                        {t("search:searchresults-show-records-label-b")}
-                    </label>
+            {searchResultsObj["@odata.count"] > 5 && (
+                <div id="recordCountSelect" className="govuk-grid-row">
+                    <div className="govuk-form-group">
+                        <label className="govuk-label-s " htmlFor="sort">
+                            {t("search:searchresults-show-records-label-a")}
+                            <select
+                                onChange={(e) => {
+                                    setSelectedOption(e.target.value);
+                                }}
+                                value={selectedOption}
+                                className="govuk-select"
+                                id="showNumberOfRecords"
+                                name="showNumberOfRecords"
+                            >
+                                <option value="5">5</option>
+                                <option value="10">10</option>
+                                <option value="20">20</option>
+                                <option value="30">30</option>
+                                <option value="50">50</option>
+                            </select>{" "}
+                            {t("search:searchresults-show-records-label-b")}
+                        </label>
+                    </div>
                 </div>
-            </div>
+            )}
             {resultsArr.length > 0 ? (
                 ResultsView(resultsArr)
             ) : (

pages/api/endpoint/getbasicdnssearchpaged_api.js

@@ -1,7 +1,7 @@
 import axios from "axios";
 import CryptoJS from "crypto-js";
 import _ from "lodash";
-import { getToken, azureHeadersPaged } from "../../../actions";
+import { getToken, azureHeadersPagedCustom } from "../../../actions";
 
 const WORDKEY = process.env.HASHKEY;
 
@@ -27,6 +27,7 @@ export default async function ApiProxy(req, res) {
 
     var orderby = req.query.orderby;
     var fieldSort = req.query.fieldSort;
+    var showNumberOfRecords = req.query.showNumberOfRecords;
 
     var queryUrl =
         "incidents?$select=description,numberofchildincidents,_accountid_value,_customerid_value,_pinswg_associatedlpa_value,_ownerid_value,pinswg_appealcasetype,statuscode,ticketnumber,title, _primarycontactid_value&$expand=primarycontactid($select=fullname)&$filter=pinswg_appealcasetype eq 846040011 and pinswg_publishtoweb eq true&$orderby=" +
@@ -41,7 +42,7 @@ export default async function ApiProxy(req, res) {
     return axios
         .get(
             WEBAPI_URL + queryUrl + hashAPIPath(queryUrl),
-            azureHeadersPaged(token.access_token)
+            azureHeadersPagedCustom(token.access_token, showNumberOfRecords)
         )
         .then(({ data }) => {
             var dataStr;

pages/api/endpoint/getlpa_api.js

@@ -32,7 +32,6 @@ export default async function ApiProxy(req, res) {
             azureHeaders(token.access_token)
         )
         .then(({ data }) => {
-            console.log(data);
             res.status(200).json(data);
         })
         .catch(({ err }) => {