Make sure items exists before manipulating data

eea · Jul 20, 2020 · 4565e57 · 4565e57
1 parent 5e32624
commit 4565e57
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 15 deletions.
diff --git a/src/components/manage/Blocks/DefaultView.jsx b/src/components/manage/Blocks/DefaultView.jsx
@@ -20,9 +20,9 @@ const DefaultView = props => {
   const providerUrl = data?.providerUrl || settings.providerUrl || null;
   useEffect(() => {
     if (
-      selectQuery.table &&
-      selectQuery.columnKey &&
-      selectQuery.columnValue &&
+      selectQuery?.table &&
+      selectQuery?.columnKey &&
+      selectQuery?.columnValue &&
       providerUrl &&
       !state.loading
     ) {

diff --git a/src/components/manage/Blocks/FacilityBlock/View.jsx b/src/components/manage/Blocks/FacilityBlock/View.jsx
@@ -28,23 +28,27 @@ const View = props => {
         <div className="flex flex-column mr-3 w-40">
           <h1 className="mb-0 bold light-blue">[facilityName1]</h1>
           <p className="mb-0 bold light-blue">Industrial activity</p>
-          <p>{state.items[0]?.mainActivity}</p>
+          <p>{state.items?.[0]?.mainActivity}</p>
         </div>
         <div className="banner flex">
           <div className="flex-item">
             <p className="lighter">Last report was submitted on:</p>
             <p className="bold">
-              {moment(state.items[0]?.eprtrReportingDate).format('DD MMM YYYY')}
+              {moment(state.items?.[0]?.eprtrReportingDate).format(
+                'DD MMM YYYY',
+              )}
             </p>
           </div>
           <div className="flex-item">
             <p className="bold">Reporting year</p>
-            <p className="lighter">{state.items[0]?.eprtrReportingYear}</p>
+            <p className="lighter">{state.items?.[0]?.eprtrReportingYear}</p>
           </div>
           <div className="flex-item">
             <p className="bold">Publish date</p>
             <p className="lighter">
-              {moment(state.items[0]?.eprtrReportingDate).format('DD MMM YYYY')}
+              {moment(state.items?.[0]?.eprtrReportingDate).format(
+                'DD MMM YYYY',
+              )}
             </p>
           </div>
         </div>
@@ -53,15 +57,15 @@ const View = props => {
         <h1 className="mb-0 bold light-blue">Competent Authority</h1>
         <p className="info">
           Last updated:{' '}
-          {moment(state.items[0]?.authLastUpdated).format('DD MMM YYYY')}
+          {moment(state.items?.[0]?.authLastUpdated).format('DD MMM YYYY')}
         </p>
       </div>
       <div className="mt-2 grid grid-cl-3 responsive metadata">
         {metadata.map(meta =>
-          state.items[0]?.[meta.id] ? (
+          state.items?.[0]?.[meta.id] ? (
             <div>
               <p className="bold mb-0">{meta.label}</p>
-              <p className="info dark">{state.items[0]?.[meta.id]}</p>
+              <p className="info dark">{state.items?.[0]?.[meta.id]}</p>
             </div>
           ) : meta.default ? (
             <div>

diff --git a/src/components/manage/Blocks/RegulatoryInformationBlock/View.jsx b/src/components/manage/Blocks/RegulatoryInformationBlock/View.jsx
@@ -57,15 +57,15 @@ const View = props => {
         <h1 className="bold light-blue">About the entity</h1>
         <GridMetadata
           gridColumns="2"
-          metadata={state.items[0]}
+          metadata={state.items?.[0]}
           metadataKeys={aboutEntityMetadata}
         />
       </div>
       <div className="flex flex-column mt-2">
         <h1 className="bold light-blue">BAT Conlcussions</h1>
         <div className="bat-container">
-          <a href={state.items[0]?.batPath} className="display-block mb-1">
-            {state.items[0]?.batFileName}
+          <a href={state.items?.[0]?.batPath} className="display-block mb-1">
+            {state.items?.[0]?.batFileName}
           </a>
           <GridMetadata
             gridColumns="2"
@@ -74,15 +74,15 @@ const View = props => {
           />
           <div className="hr mt-1 mb-1" />
           <div className="align-center">
-            <a href={state.items[0]?.batPath}>View BAT AELs</a>
+            <a href={state.items?.[0]?.batPath}>View BAT AELs</a>
           </div>
         </div>
       </div>
       <div className="flex flex-column mt-2">
         <h1 className="bold light-blue">Operating permit</h1>
         <GridMetadata
           gridColumns="2"
-          metadata={state.items[0]}
+          metadata={state.items?.[0]}
           metadataKeys={operatingPermitMetadata}
         />
       </div>