From b5addadbbed6594f5450524ca988092b7bcc8c2a Mon Sep 17 00:00:00 2001
From: Jazlene Rae Guevarra <43012576+jguevarra@users.noreply.github.com>
Date: Mon, 24 Jun 2024 17:07:36 -0400
Subject: [PATCH] Data Header Logic Rewrite (#113)

* dataheader logic rewrite

* jasmin's changes for displaying new fields
---
 src/app-bundles/base-data-bundle.js           | 25 ++++++++++++++
 src/app-bundles/data-entry-bundle.js          | 21 +-----------
 src/app-bundles/index.js                      |  2 ++
 src/app-bundles/sites-bundle.js               |  7 ++--
 .../datasheets/components/dataHeader.js       | 33 +++++++++++--------
 .../datasheets/pages/site-datasheet.js        | 14 +++-----
 .../datasheets/tables/fishDsTable.js          |  2 +-
 .../datasheets/tables/suppDsTable.js          |  4 +++
 .../forms/missouriRiverForm.js                | 10 +++---
 .../gridCellRenderers/mrIdCellRenderer.js     |  4 +--
 .../gridCellRenderers/siteIdCellRenderer.js   |  3 --
 11 files changed, 66 insertions(+), 59 deletions(-)
 create mode 100644 src/app-bundles/base-data-bundle.js

diff --git a/src/app-bundles/base-data-bundle.js b/src/app-bundles/base-data-bundle.js
new file mode 100644
index 0000000..7a8bcda
--- /dev/null
+++ b/src/app-bundles/base-data-bundle.js
@@ -0,0 +1,25 @@
+const baseDataBundle = {
+  name: 'baseData',
+
+  getReducer: () => {
+    const initialData = {
+      data: [],
+    };
+
+    return (state = initialData, { type, payload }) => {
+      switch (type) {
+        case 'UPDATE_BASE_DATA':
+          return {
+            ...state,
+            data: { ...state.data, ...payload },
+          };
+        default:
+          return state;
+      }
+    };
+  },
+
+  selectBaseData: state =>  state.baseData.data,
+};
+
+export default baseDataBundle;
diff --git a/src/app-bundles/data-entry-bundle.js b/src/app-bundles/data-entry-bundle.js
index 8f1398c..0607906 100644
--- a/src/app-bundles/data-entry-bundle.js
+++ b/src/app-bundles/data-entry-bundle.js
@@ -24,7 +24,6 @@ export default {
         items: [],
         totalCount: 0,
       },
-      headerData: {},
       lastParams: {},
       currentTab: 0,
     };
@@ -104,8 +103,6 @@ export default {
             },
           };
 
-        case 'UPDATED_HEADER_DATA':
-          return { ...state, headerData: payload };
         case 'UPDATE_CURRENT_TAB':
           return {
             ...state,
@@ -154,7 +151,6 @@ export default {
   selectDataEntry: state => state.dataEntry,
   selectDataEntryData: state => state.dataEntry.data.length ? state.dataEntry.data[0] : {},
   selectDataEntryLastParams: state => state.dataEntry.lastParams,
-  selectHeaderData: state => state.dataEntry.headerData,
   selectCurrentTab: state => state.dataEntry.currentTab,
   selectDataEntryTotalCount: state => state.dataEntry.totalCount,
 
@@ -176,22 +172,6 @@ export default {
     store.doDomainSampleUnitTypesFetch();
   },
 
-  doFetchHeaderData: (siteId, office, year, project) => ({ dispatch, apiGet }) => {
-    const url = '/psapi/headerData?' + new URLSearchParams({
-      siteId: siteId,
-      office: office,
-      year: year,
-      project: project,
-    });
-
-    apiGet(url, (_err, body) => {
-      dispatch({
-        type: 'UPDATED_HEADER_DATA',
-        payload: body,
-      });
-    });
-  },
-
   doMoRiverDatasheetLoadData: (id) => ({ store }) => {
     // Load data
     store.doFetchFishDataEntry({ mrId: id, id: store.selectUserRole().id }, null, false);
@@ -232,6 +212,7 @@ export default {
             type: 'missouriRiver',
           },
         });
+        dispatch({ type: 'UPDATE_BASE_DATA', payload: { mrId: body?.items?.[0]?.mrId, mrFid: body?.items?.[0]?.mrFid } });
 
         if (store.selectDataEntryTotalCount() === 0) {
           if (ignoreToast) { tWarning(toastId, 'No Missouri River datasheet(s) found.'); }
diff --git a/src/app-bundles/index.js b/src/app-bundles/index.js
index 2d5476b..a55fa18 100644
--- a/src/app-bundles/index.js
+++ b/src/app-bundles/index.js
@@ -24,6 +24,7 @@ import usersBundle from './users-bundle';
 import sitesDatasheetBundle from './sites-datasheet-bundle';
 import exportsBundle from './exports/exports-bundle';
 import loadingBundle from './loading-bundle';
+import baseDataBundle from './base-data-bundle';
 
 // Mock Token User
 const mockTokenApplicationAdmin =
@@ -63,4 +64,5 @@ export default composeBundles(
   sitesDatasheetBundle,
   exportsBundle,
   loadingBundle,
+  baseDataBundle
 );
diff --git a/src/app-bundles/sites-bundle.js b/src/app-bundles/sites-bundle.js
index fc5b6f1..e17a5bc 100644
--- a/src/app-bundles/sites-bundle.js
+++ b/src/app-bundles/sites-bundle.js
@@ -79,11 +79,8 @@ export default {
 
     apiGet(url, (err, body) => {
       if (!err) {
-        dispatch({
-          type: 'SITES_UPDATED_ITEMS',
-          payload: body,
-        });
-        dispatch({ type: 'SITES_FETCH_FINISHED' });
+        dispatch({ type: 'SITES_UPDATED_ITEMS', payload: body });
+        siteId && dispatch({ type: 'UPDATE_BASE_DATA', payload: body?.items?.[0] });
       } else {
         dispatch({ type: 'SITES_FETCH_ERROR', payload: err });
       }
diff --git a/src/app-pages/data-entry/datasheets/components/dataHeader.js b/src/app-pages/data-entry/datasheets/components/dataHeader.js
index 033a0c3..8d76977 100644
--- a/src/app-pages/data-entry/datasheets/components/dataHeader.js
+++ b/src/app-pages/data-entry/datasheets/components/dataHeader.js
@@ -8,10 +8,11 @@ import { Row } from 'app-pages/data-entry/edit-data-sheet/forms/_shared/helper';
 import '../../dataentry.scss';
 
 const DataHeader = connect(
-  'selectHeaderData',
+  'selectBaseData',
+  'selectRouteParams',
   ({
-    headerData,
-    id,
+    baseData,
+    routeParams
   }) =>  (
     <Card className='mb-3'>
       <Card.Body>
@@ -20,27 +21,27 @@ const DataHeader = connect(
             <Row className='border-bottom'>
               <div className='col-sm-2'>
                 <b className='mr-2'>Site ID:</b>
-                {id || '--'}
+                {baseData?.siteId || '--'}
               </div>
               <div className='col-sm-2'>
                 <b className='mr-2'>Year:</b>
-                {headerData?.[0]?.year || '--'}
+                {baseData?.year || '--'}
               </div>
               <div className='col-sm-2'>
                 <b className='mr-2'>Field Office:</b>
-                {headerData?.[0]?.fieldoffice || '--'}
+                {baseData?.fieldoffice || '--'}
               </div>
               <div className='col-sm-2'>
                 <b className='mr-2'>Project:</b>
-                {headerData?.[0]?.project || '--'}
+                {baseData?.projectId || '--'}
               </div>
               <div className='col-sm-2'>
                 <b className='mr-2'>Segment:</b>
-                {headerData?.[0]?.segment || '--'}
+                {baseData?.segmentId || '--'}
               </div>
               <div className='col-sm-2'>
                 <b className='mr-2'>Season:</b>
-                {headerData?.[0]?.season || '--'}
+                {baseData?.season || '--'}
               </div>
             </Row>
           </div>
@@ -48,20 +49,26 @@ const DataHeader = connect(
             <Row>
               <div className='col-sm-2'>
                 <b className='mr-2'>Sample Unit Type:</b>
-                {headerData?.[0]?.sampleUnitType || '--'}
+                {baseData?.sampleUnitType || '--'}
               </div>
               <div className='col-sm-2'>
                 <b className='mr-2'>Sample Unit:</b>
-                {headerData?.[0]?.bend || '--'}
+                {baseData?.bend || '--'}
               </div>
               <div className='col-sm-2'>
                 <b className='mr-2'>R/N:</b>
-                {headerData?.[0]?.bendrn || '--'}
+                {baseData?.bendrn || '--'}
               </div>
               <div className='col-sm-2'>
                 <b className='mr-2'>Bend River Mile:</b>
-                {headerData?.[0]?.bendrivermile || '--'}
+                {baseData?.bendRiverMile || '--'}
               </div>
+              {(routeParams?.form === 'missouriRiver-edit' || routeParams?.form === 'missouriRiver-create') && (
+                <div className='col-sm-4'>
+                  <b className='mr-2'>MR FID:</b>
+                  {baseData?.mrFid || '--'}
+                </div>
+              )}
             </Row>
           </div>
         </Row>
diff --git a/src/app-pages/data-entry/datasheets/pages/site-datasheet.js b/src/app-pages/data-entry/datasheets/pages/site-datasheet.js
index 3a10e15..5710dd3 100644
--- a/src/app-pages/data-entry/datasheets/pages/site-datasheet.js
+++ b/src/app-pages/data-entry/datasheets/pages/site-datasheet.js
@@ -11,22 +11,18 @@ import SearchDsTable from '../tables/searchDsTable';
 const SiteDatasheet = connect(
   'doSitesDatasheetLoadData',
   'doUpdateSitesDatasheetParams',
-  'selectSitesData',
+  'selectBaseData',
   'selectMoriverSitesDatasheetTotalResults',
   'selectSearchEffortSitesDatasheetTotalResults',
   ({
     doSitesDatasheetLoadData,
     doUpdateSitesDatasheetParams,
-    sitesData,
+    baseData,
     moriverSitesDatasheetTotalResults,
-    searchEffortSitesDatasheetTotalResults,
+    searchEffortSitesDatasheetTotalResults
   }) => {
     const [currentTab, setCurrentTab] = useState(0);
-
-    const siteId = sitesData?.[0]?.siteId ?? null;
-    const fieldoffice = sitesData?.[0]?.fieldoffice ?? null;
-    const year = sitesData?.[0]?.year ?? null;
-    const projectId = sitesData?.[0]?.projectId ?? null;
+    const siteId = baseData?.siteId ?? null;
 
     useEffect(() => {
       const params = { siteId: siteId };
@@ -45,7 +41,7 @@ const SiteDatasheet = connect(
           </div>
         </div>
         {/* Top Level Info */}
-        <DataHeader id={siteId} />
+        <DataHeader />
         {/* Tab Container */}
         <Card>
           <Card.Header text='Datasheet Workflows' />
diff --git a/src/app-pages/data-entry/datasheets/tables/fishDsTable.js b/src/app-pages/data-entry/datasheets/tables/fishDsTable.js
index 491ffe8..e3acbdf 100644
--- a/src/app-pages/data-entry/datasheets/tables/fishDsTable.js
+++ b/src/app-pages/data-entry/datasheets/tables/fishDsTable.js
@@ -181,7 +181,7 @@ const FishDsTable = connect(
                 isRequired: true 
               }} 
             />
-            <AgGridColumn field='length' cellEditor='numberEditor' />
+            <AgGridColumn field='length' cellEditor='floatEditor' />
             <AgGridColumn field='weight' cellEditor='floatEditor' />
             <AgGridColumn field='countF' headerName='Count' cellEditor='numberEditor' />
             <AgGridColumn 
diff --git a/src/app-pages/data-entry/datasheets/tables/suppDsTable.js b/src/app-pages/data-entry/datasheets/tables/suppDsTable.js
index a7f7d7d..7b41be7 100644
--- a/src/app-pages/data-entry/datasheets/tables/suppDsTable.js
+++ b/src/app-pages/data-entry/datasheets/tables/suppDsTable.js
@@ -139,6 +139,10 @@ const SuppDsTable = connect(
             <AgGridColumn field='checkby' headerName='Checked' cellEditor='textEditor' sortable unSortIcon />
             <AgGridColumn field='approved' cellEditor='selectEditor' cellEditorParams={{ options: YNNumOptions, type: 'number' }} sortable unSortIcon />
             <AgGridColumn field='speciesId' headerName='Species' cellEditor='numberEditor' sortable unSortIcon />
+            <AgGridColumn field='netrivermile' headerName='Net River Mile' cellEditor='numberEditor' editable={false}/>
+            <AgGridColumn field='length' headerName='Length' cellEditor='textEditor' editable={false} />
+            <AgGridColumn field='weight' headerName='Weight' cellEditor='textEditor' editable={false} />
+            <AgGridColumn field='condition' headerName='Condition' cellEditor='numberEditor' editable={false} />
             <AgGridColumn field='recorder' cellEditor='textEditor' sortable unSortIcon />
             <AgGridColumn field='tagnumber' cellEditor='textEditor' width={125} sortable unSortIcon />
             <AgGridColumn field='pitrn' headerName='PIT R/N/Z' cellEditor='selectEditor' cellEditorParams={{ options: visualAssessmentOptions }} sortable unSortIcon />
diff --git a/src/app-pages/data-entry/edit-data-sheet/forms/missouriRiverForm.js b/src/app-pages/data-entry/edit-data-sheet/forms/missouriRiverForm.js
index dd549bc..42e8f25 100644
--- a/src/app-pages/data-entry/edit-data-sheet/forms/missouriRiverForm.js
+++ b/src/app-pages/data-entry/edit-data-sheet/forms/missouriRiverForm.js
@@ -42,7 +42,7 @@ const MissouriRiverForm = connect(
   'doDomainsSetSite2Fetch',
   'doResetMoRiverDataEntryData',
   'selectDataEntryData',
-  'selectSitesData',
+  'selectBaseData',
   'selectDomainsMeso',
   'selectDomainsStructureFlow',
   'selectDomainsStructureMod',
@@ -66,7 +66,7 @@ const MissouriRiverForm = connect(
     doDomainsSetSite2Fetch,
     doResetMoRiverDataEntryData,
     dataEntryData,
-    sitesData,
+    baseData,
     domainsMeso,
     domainsStructureFlow,
     domainsStructureMod,
@@ -95,9 +95,7 @@ const MissouriRiverForm = connect(
     const [isNoTurbidity, setIsNoTurbidity] = useState(false);
     const [isNoVelocity, setIsNoVelocity] = useState(false);
 
-    const siteId = edit ? state['siteId'] : sitesData[0].siteId;
     const isCreate = routeParams.form.split('-')[1] === 'create';
-    const data = sitesData[0];
     const formComplete = true;  
 
     const handleChange = e => {
@@ -214,7 +212,7 @@ const MissouriRiverForm = connect(
           setIsNoVelocity(false);
         }
       } else {
-        handleSelect('siteId', Number(data.siteId));
+        handleSelect('siteId', Number(baseData?.siteId));
       }
     }, [edit, dataEntryData]);
 
@@ -236,7 +234,7 @@ const MissouriRiverForm = connect(
           </div>
         </div>
         {/* Top Level Info */}
-        <DataHeader id={siteId} />
+        <DataHeader />
         {/* Approval */}
         {/* TO DO: include component props */}
         <Approval />
diff --git a/src/common/gridCellRenderers/mrIdCellRenderer.js b/src/common/gridCellRenderers/mrIdCellRenderer.js
index 4e47a24..57d1407 100644
--- a/src/common/gridCellRenderers/mrIdCellRenderer.js
+++ b/src/common/gridCellRenderers/mrIdCellRenderer.js
@@ -16,7 +16,7 @@ const MrIdCellRenderer = connect(
     type,
     tab = 0,
   }) => {
-    const handleChange = () => {
+    const handleClick = () => {
       doUpdateCurrentTab(tab);
       doFetchMoRiverDataEntry({ tableId: getMrId()}, () => doUpdateUrl(uri), false);
     };
@@ -53,7 +53,7 @@ const MrIdCellRenderer = connect(
         variant='link'
         className='p-0 mb-1'
         text={getTypeText()}
-        handleClick={handleChange}
+        handleClick={handleClick}
       />
     );
   });
diff --git a/src/common/gridCellRenderers/siteIdCellRenderer.js b/src/common/gridCellRenderers/siteIdCellRenderer.js
index eae6096..b65187b 100644
--- a/src/common/gridCellRenderers/siteIdCellRenderer.js
+++ b/src/common/gridCellRenderers/siteIdCellRenderer.js
@@ -5,12 +5,10 @@ import Button from 'app-components/button';
 import SitesFormModal from 'app-pages/data-entry/sites-list/components/modals/sitesForm';
 
 const SiteIdCellRenderer = connect(
-  'doFetchHeaderData',
   'doSitesFetch',
   'doUpdateUrl',
   'doModalOpen',
   ({
-    doFetchHeaderData,
     doSitesFetch,
     doUpdateUrl,
     doModalOpen,
@@ -19,7 +17,6 @@ const SiteIdCellRenderer = connect(
     value,
   }) => {
     const handleCallback = () => {
-      doFetchHeaderData(data?.siteId, data?.fieldoffice, data?.year, data?.projectId);
       doUpdateUrl('/sites-list/datasheet');
     };