feat: [NR-NMP-112] Beef Cattle flow (#160)

bcgov · Feb 12, 2025 · 7eef0a5 · 7eef0a5
1 parent 968b3cc
commit 7eef0a5
Show file tree

Hide file tree

Showing 21 changed files with 738 additions and 154 deletions.
diff --git a/.gitignore b/.gitignore
@@ -361,5 +361,3 @@ poetry.toml
 pyrightconfig.json
 
 # End of https://www.toptal.com/developers/gitignore/api/node,java,python,go
-.env.template
-backend/.env.template
diff --git a/frontend/package-lock.json b/frontend/package-lock.json
diff --git a/frontend/package.json b/frontend/package.json
@@ -20,6 +20,7 @@
     "@fortawesome/react-fontawesome": "^0.2.2",
     "axios": "^1.7.9",
     "react": "^18.3.1",
+    "react-collapsed": "^4.2.0",
     "react-dom": "^18.3.1",
     "react-router-dom": "^6.28.0",
     "typography": "^0.16.24"

diff --git a/frontend/src/components/common/Card/card.styles.ts b/frontend/src/components/common/Card/card.styles.ts
@@ -25,6 +25,7 @@ export const CardWrapper = styled.div<CardWrapperProps>`
   text-align: center;
   position: relative;
   justify-content: ${(props) => props.justifyContent};
+  overflow: auto;
 `;
 
 export default CardWrapper;
diff --git a/frontend/src/components/common/Tabs/Tabs.tsx b/frontend/src/components/common/Tabs/Tabs.tsx
@@ -22,6 +22,7 @@ export function TabOptions({ tabs, activeTab, setActiveTab, clickable = true }:
           <Tab
             key={tab.id}
             active={index === activeTab}
+            clickable={clickable}
             onClick={() => clickable && setActiveTab && setActiveTab(index)}
           >
             {tab.label}

diff --git a/frontend/src/components/common/Tabs/tabs.styles.ts b/frontend/src/components/common/Tabs/tabs.styles.ts
@@ -7,9 +7,9 @@ export const TabsWrapper = styled.div`
   align-items: flex-end; // Align tabs to the bottom
 `;
 
-export const Tab = styled.button<{ active: boolean }>`
+export const Tab = styled.button<{ active: boolean; clickable: boolean }>`
   padding: 10px 20px;
-  cursor: pointer;
+  cursor: ${({ clickable }) => (clickable ? 'pointer' : 'default')};
   background-color: ${({ active }) => (active ? '#fff' : '#ccc')};
   color: ${({ active }) => (active ? '#000' : '#000')};
   border-bottom: ${({ active }) => (active ? 'none' : 'none')};

diff --git a/frontend/src/constants/BlankNMPFileYearData.ts b/frontend/src/constants/BlankNMPFileYearData.ts
@@ -0,0 +1,71 @@
+const blankNMPFileYearData = {
+  Year: '',
+  Fields: [],
+  // Keeping these properties to show what used to be stored in the NMP file
+  /*
+  Fields: [
+    {
+      Id: 0,
+      FieldName: '',
+      Area: 0,
+      Comment: null,
+      Nutrients: null,
+      HasNutrients: false,
+      Crops: [
+        {
+          id: 0,
+          cropId: '',
+          cropOther: null,
+          cropName: '',
+          cropTypeName: '',
+          yield: 0,
+          reqN: 0,
+          stdN: 0,
+          reqP2o5: 0,
+          reqK2o: 0,
+          remN: 0,
+          remP2o5: 0,
+          remK2o: 0,
+          crudeProtien: 0,
+          prevCropId: 0,
+          coverCropHarvested: null,
+          prevYearManureAppl_volCatCd: 0,
+          yieldHarvestUnit: 0,
+          yieldByHarvestUnit: 0,
+          plantAgeYears: null,
+          numberOfPlantsPerAcre: 0,
+          distanceBtwnPlantsRows: null,
+          willPlantsBePruned: false,
+          whereWillPruningsGo: null,
+          willSawdustBeApplied: false,
+        },
+      ],
+      FeedForageAnalyses: [],
+      SoilTest: null,
+      LeafTest: null,
+      HasSoilTest: false,
+      PreviousYearManureApplicationFrequency: '',
+      PreviousYearManureApplicationNitrogenCredit: null,
+      SoilTestNitrateOverrideNitrogenCredit: null,
+      IsSeasonalFeedingArea: false,
+      SeasonalFeedingArea: null,
+      FeedingDaysSpentInFeedingArea: null,
+      FeedingPercentageOutsideFeeingArea: null,
+      MatureAnimalCount: null,
+      GrowingAnimalCount: null,
+      MatureAnimalAverageWeight: null,
+      GrowingAnimalAverageWeight: null,
+      MatureAnimalDailyFeedRequirementId: 0,
+      GrowingAnimalDailyFeedRequirementId: 0,
+    },
+  ],
+  */
+  FarmAnimals: [],
+  FarmManures: [],
+  GeneratedManures: [],
+  ImportedManures: [],
+  SeparatedSolidManures: [],
+  ManureStorageSystems: [],
+};
+
+export default blankNMPFileYearData;
diff --git a/frontend/src/constants/DefaultNMPFile.ts b/frontend/src/constants/DefaultNMPFile.ts
@@ -11,11 +11,7 @@ const defaultNMPFile: NMPFile = {
     Manure: null,
     HasSelectedFarmType: false,
     ImportsManureCompost: false,
-    HasAnimals: false,
-    HasDairyCows: false,
-    HasBeefCows: false,
-    HasPoultry: false,
-    HasMixedLiveStock: false,
+    FarmAnimals: [],
     HasHorticulturalCrops: false,
     HasBerries: false,
     HasVegetables: false,
@@ -24,73 +20,7 @@ const defaultNMPFile: NMPFile = {
     UserJourney: 0,
   },
   unsaved: false,
-  years: [
-    {
-      Year: '',
-      Fields: [
-        {
-          Id: 0,
-          FieldName: '',
-          Area: 0,
-          Comment: null,
-          Nutrients: null,
-          HasNutrients: false,
-          Crops: [
-            {
-              id: 0,
-              cropId: '',
-              cropOther: null,
-              cropName: '',
-              cropTypeName: '',
-              yield: 0,
-              reqN: 0,
-              stdN: 0,
-              reqP2o5: 0,
-              reqK2o: 0,
-              remN: 0,
-              remP2o5: 0,
-              remK2o: 0,
-              crudeProtien: 0,
-              prevCropId: 0,
-              coverCropHarvested: null,
-              prevYearManureAppl_volCatCd: 0,
-              yieldHarvestUnit: 0,
-              yieldByHarvestUnit: 0,
-              plantAgeYears: null,
-              numberOfPlantsPerAcre: 0,
-              distanceBtwnPlantsRows: null,
-              willPlantsBePruned: false,
-              whereWillPruningsGo: null,
-              willSawdustBeApplied: false,
-            },
-          ],
-          FeedForageAnalyses: [],
-          SoilTest: null,
-          LeafTest: null,
-          HasSoilTest: false,
-          PreviousYearManureApplicationFrequency: '',
-          PreviousYearManureApplicationNitrogenCredit: null,
-          SoilTestNitrateOverrideNitrogenCredit: null,
-          IsSeasonalFeedingArea: false,
-          SeasonalFeedingArea: null,
-          FeedingDaysSpentInFeedingArea: null,
-          FeedingPercentageOutsideFeeingArea: null,
-          MatureAnimalCount: null,
-          GrowingAnimalCount: null,
-          MatureAnimalAverageWeight: null,
-          GrowingAnimalAverageWeight: null,
-          MatureAnimalDailyFeedRequirementId: 0,
-          GrowingAnimalDailyFeedRequirementId: 0,
-        },
-      ],
-      FarmAnimals: [],
-      FarmManures: [],
-      GeneratedManures: [],
-      ImportedManures: [],
-      SeparatedSolidManures: [],
-      ManureStorageSystems: [],
-    },
-  ],
+  years: [],
   LastAppliedFarmManureId: null,
   NMPReleaseVersion: 0,
 };

diff --git a/frontend/src/routes/ViewRouter.tsx b/frontend/src/routes/ViewRouter.tsx
@@ -6,6 +6,7 @@ import { Routes, Route } from 'react-router-dom';
 import LandingPage from '../views/LandingPage/LandingPage';
 import FarmInformation from '../views/FarmInformation/FarmInformation';
 import FieldAndSoil from '@/views/FieldAndSoil/FieldAndSoil';
+import AnimalsAndManure from '@/views/AnimalsAndManure/AnimalsAndManure';
 import CalculateNutrients from '@/views/CalculateNutrients/CalculateNutrients';
 
 export default function ViewRouter() {
@@ -27,6 +28,10 @@ export default function ViewRouter() {
         path="/calculate-nutrients"
         Component={CalculateNutrients}
       />
+      <Route
+        path="/animals-and-manure"
+        Component={AnimalsAndManure}
+      />
     </Routes>
   );
 }
diff --git a/frontend/src/types/NMPFile.ts b/frontend/src/types/NMPFile.ts
@@ -3,7 +3,7 @@
  */
 
 type NMPFile = {
-  farmDetails?: {
+  farmDetails: {
     Year?: string;
     FarmName?: string;
     FarmRegion?: number;
@@ -13,11 +13,7 @@ type NMPFile = {
     Manure?: any | null;
     HasSelectedFarmType?: boolean;
     ImportsManureCompost?: boolean;
-    HasAnimals?: boolean;
-    HasDairyCows?: boolean;
-    HasBeefCows?: boolean;
-    HasPoultry?: boolean;
-    HasMixedLiveStock?: boolean;
+    FarmAnimals?: string[];
     HasHorticulturalCrops?: boolean;
     HasBerries?: boolean;
     HasVegetables?: boolean;
@@ -26,7 +22,7 @@ type NMPFile = {
     UserJourney?: number;
   };
   unsaved?: boolean;
-  years?: Array<{
+  years: Array<{
     Year?: string;
     Fields?: Array<{
       Id?: number;

diff --git a/frontend/src/utils/useEventfulCollapse.ts b/frontend/src/utils/useEventfulCollapse.ts
@@ -0,0 +1,36 @@
+import { useCollapse, UseCollapseInput } from 'react-collapsed';
+
+export class ExpandEvent extends Event {
+  public initiator: string;
+
+  constructor(initiator: string) {
+    super('expand');
+    this.initiator = initiator;
+  }
+}
+
+interface UseEventfulCollapseInput extends UseCollapseInput {
+  id: string | number;
+}
+
+export function useEventfulCollapse(settings: UseEventfulCollapseInput) {
+  const { isExpanded, setExpanded, getCollapseProps, getToggleProps } = useCollapse({
+    ...settings,
+    onTransitionStateChange: (state) => {
+      if (state === 'expandStart') {
+        window.dispatchEvent(new ExpandEvent(settings.id.toString()));
+      }
+    },
+  });
+  window.addEventListener('expand', (e) => {
+    // If this is not the initiating element, collapse it
+    if ((e as ExpandEvent).initiator === settings.id) return;
+    setExpanded(false);
+  });
+  return {
+    isExpanded,
+    setExpanded,
+    getCollapseProps,
+    getToggleProps,
+  };
+}