build fix and updated myportal layout

components/case/summaryTypes/pinswg_dnsid.js

@@ -1,21 +1,50 @@
 import { useRouter } from "next/router";
+import Head from "next/head";
+import { useEffect, useRef, ReactElement } from "react";
+
 import useTranslation from "next-translate/useTranslation";
 import jsonpath from "jsonpath";
-import _ from "lodash";
+import _, { round } from "lodash";
 import transLookup from "../../../data/lookuptranslations.json";
 
+import GoogleMapComponent from "../../mapping/";
+
+import OSPoint from "ospoint";
+
 const Pinswg_dnsid = (props) => {
     let { t } = useTranslation();
     const { casesObj, detailsObj, formatDates, linkedCasesList } = props;
 
     const router = useRouter();
     const { locale } = router;
+    const point = {};
+    const siteCoords = {};
+    let center = {};
+
+    point = new OSPoint(
+        detailsObj.pinswg_anticipatedgridreferencenorthingtext,
+        detailsObj.pinswg_anticipatedgridreferenceeastingtext
+    );
+    siteCoords = point.toOSGB36();
+    //console.log(siteCoords);
+    center = {
+        id: "",
+        lat: isNaN(parseFloat(siteCoords.latitude))
+            ? 52.412272
+            : parseFloat(siteCoords.latitude),
+        lng: isNaN(parseFloat(siteCoords.longitude))
+            ? -3.437989
+            : parseFloat(siteCoords.longitude),
+    };
+
+    const zoom = isNaN(parseFloat(siteCoords.latitude)) ? 7 : 12;
+
     return (
         <>
             {detailsObj.pinswg_projectdescription != null ? (
                 <div className="govuk-grid-row">
                     <div className="flex-container grid-row govuk-body case">
-                        <div className="govuk-grid-column-full">
+                        <div className="govuk-grid-column-one-half">
                             <h2 className="govuk-heading-m govuk-!-margin-bottom-7">
                                 {t("case:summary-project-details-label")}
                             </h2>
@@ -51,6 +80,22 @@ const Pinswg_dnsid = (props) => {
                                     : ""}
                             </p> */}
                         </div>
+                        {/* {process.env.SHOWMAPS == "true" && ( */}
+                        <div className="govuk-grid-column-one-half">
+                            <div
+                                style={{
+                                    height: "40vh",
+                                    width: "100%",
+                                }}
+                            >
+                                <GoogleMapComponent
+                                    center={center}
+                                    zoom={zoom}
+                                />
+                                {/* <OSMapComponent center={center} zoom={zoom} /> */}
+                            </div>
+                        </div>
+                        {/* )} */}
                     </div>
                 </div>
             ) : (