Merge pull request #18 from CIAT-DAPA/develop

Develop

Author: jchemutt

src/src/components/LayersMarkers/LayersMarkers.jsx

@@ -5,13 +5,17 @@ import {
     Marker,
 
     Tooltip,
+
+    useMap
 
   } from "react-leaflet";
 import L from "leaflet";
+import { useEffect } from "react";
 import './LayersMarkers'
 import { useContext } from "react";
 import { DataContext } from "../../context/context";
 import Configuration from "../../conf/Configuration";
+import config from './config.json';
 
 const LayersMarkers=({option1Checked,option2Checked,accessions,
     clickedMarkerIndices,
@@ -37,6 +41,29 @@ const LayersMarkers=({option1Checked,option2Checked,accessions,
             }
             setClickedMarkerIndices(newSet);
           };
+
+          const map = useMap();
+          const { iso, project } = useContext(DataContext);
+        
+          useEffect(() => {
+      
+        
+            if (accessions.length === 0 && layerr.length > 0 && project === "bolder") {
+              
+        
+              if (iso && config.COUNTRY_BOUNDS[iso]) {
+                const bounds = L.latLngBounds(config.COUNTRY_BOUNDS[iso]);
+                
+        
+                if (map) {
+                  map.flyToBounds(bounds, { padding: [50, 50] });
+                }
+              } else {
+                console.warn("No bounds found for ISO:", iso);
+              }
+            }
+          }, [accessions, layerr, project, iso, map]);
+          
         return (
           <>
             {option1Checked == true &&

src/src/components/LayersMarkers/config.json

@@ -0,0 +1,8 @@
+{
+  "COUNTRY_BOUNDS": {
+    "UG": [[-1.482, 29.573], [4.231, 35.000]], 
+    "TZ": [[-11.761, 29.338], [-0.95, 40.636]],
+    "BJ": [[6.225, 0.775], [12.409, 3.851]], 
+    "GH": [[4.738, -3.244], [11.174, 1.191]] 
+  }
+}

src/src/components/filterLeft/FilterLeft.jsx

@@ -46,6 +46,7 @@ function FilterLeft({
   const [filteredCountries, setFilteredCountries] = useState(response);
   const { project, setProject } = useContext(DataContext);
   const [compProject, setCompProject] = useState('');
+  const [majorCrops, setMajorCrops] = useState([]);
   const bolderCountries = response.filter((country) =>
     config.BOLDER_COUNTRIES.includes(country.name)
   );
@@ -60,9 +61,10 @@ function FilterLeft({
     );
 
     setShowLandraceGroups(project === "lga");
+    setMajorCrops([]);
   };
 
-  const [majorCrops, setMajorCrops] = useState([]);
+  
   useEffect(() => {
     if (compProject) {
       if (config.PROJECT_CROPS[compProject]) {
@@ -122,6 +124,11 @@ function FilterLeft({
     );
     setCountryIso(selectedCountry.iso_2);
     setIso(selectedCountry.iso_2);
+
+    if (compProject === "bolder" && selectedCountry) {
+      const countryCrops = config.BOLDER_CROPS[selectedCountry.name] || [];
+      setMajorCrops(countryCrops);
+    }
     //console.log(selectedCountry.iso_2)
     setTimeout(() => {
       setIndexStep(1);
@@ -326,7 +333,7 @@ const overlayInfo = "Info: your CSV file must have the following columns: 'id',
           </Col>
         </Row>
 
-        {majorCrops && (
+        {majorCrops.length > 0 ? (
           <CheckFilter
             title="Major Crops"
             toolTipTitle="Step 3"
@@ -337,7 +344,19 @@ const overlayInfo = "Info: your CSV file must have the following columns: 'id',
             idOnboarding="select-majorCrop"
             indexStep={indexStep}
             setIndexStep={setIndexStep}
-          ></CheckFilter>
+          />
+        ) : (
+          <CheckFilter
+            title="Major Crops"
+            toolTipTitle="Step 3"
+            toolTipDescription="No crops available"
+            onDataChange={handleDataMajorCropChange}
+            onChange={shouldReset}
+            crop={[]}
+            idOnboarding="select-majorCrop"
+            indexStep={indexStep}
+            setIndexStep={setIndexStep}
+          />
         )}
 
         {showLandraceGroups && carouselMajorItemsNow && carouselMajorItemsNow.length == 1 && (

src/src/components/filterLeft/config.json

@@ -5,6 +5,14 @@
       "Tanzania, United Republic of",
       "Uganda"
     ],
+
+    "BOLDER_CROPS": {
+      "Benin":["Bambara groundnut","Black Fonio","Jutemallow","Sweetberry","White Fonio"],
+      "Ghana":["Amaranth caudatus","Amaranth dubius","Amaranth (Red)","Amaranth hypochondriacus","Baobab","Sesame","Turkeyberry"],
+      "Tanzania, United Republic of":["Bambara groundnut","Eleusine indica (CWR)","Finger millet","Moringa oleifera","Sweetpotato"],
+      "Uganda":["Cenchrus caudatus (CWR)","Cenchrus mezianus (CWR)", "Cenchrus procerus (CWR)", "Cenchrus ramosus (CWR)","Cenchrus unisetus (CWR)","Cowpea","Cucurbita moschata","Cucurbita pepo","Jackfruit","Pearl millet","Pumpkin"]
+    },
+
     "PROJECT_CROPS": {
       "bolder": [
       "Amaranth caudatus",

src/src/components/map/Map.js

@@ -147,8 +147,13 @@ function Map({
         .then((response) => {
           setShow(false);
           if (response.data[0].accessions.length === 0) {
+            if (project === 'lga'){
             setShowg(true);
             setCarouselMajorItems([]);
+            }else{
+              setAccessions([])
+            }
+            
           } else {
             setAccessions(response.data.flatMap((crop) => crop.accessions));
           }
@@ -223,8 +228,13 @@ function Map({
         .then((response) => {
           setShow(false);
           if (response.data[0].accessions.length === 0) {
-            setShowg(true);
-            setCarouselMajorItems([]);
+            if (project === 'lga'){
+              setShowg(true);
+              setCarouselMajorItems([]);
+              }else{
+                setAccessions([])
+              }
+            
           } else {
             setAccessions(response.data.flatMap((crop) => crop.accessions));
           }
@@ -292,9 +302,12 @@ function Map({
         if (flatMapAccesons.length > 0) {
           setAccessions(flatMapAccesons);
         } else {
-          setShowg(true);
+          if (project === 'lga'){
+            setShowg(true);
+            setCarouselMajorItems([]);
+            }
           setAccessions([]);
-          setCarouselMajorItems([]);
+          
         }
       });
     }
@@ -324,8 +337,13 @@ function Map({
           setAccessions(flatMapAccesions);
         } else {
           setAccessions([]);
-          setShowg(true);
-          setCarouselMajorItems([]);
+          if (project === 'lga'){
+            setShowg(true);
+            setCarouselMajorItems([]);
+            }else{
+              setAccessions([])
+            }
+          
         }
       });
     }