From ef3d0e4d7e4f5a7de8e8d47526e95013cc5c252f Mon Sep 17 00:00:00 2001
From: Dana Lambert <danalambert@catalyst.net.nz>
Date: Tue, 19 Oct 2021 09:03:42 +1300
Subject: [PATCH] Set next active only when location is selected

---
 frontend/src/components/Stepper.js                 | 8 ++++++--
 frontend/src/components/steps/location/Location.js | 2 +-
 frontend/src/components/steps/location/Map.js      | 5 +++--
 3 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/frontend/src/components/Stepper.js b/frontend/src/components/Stepper.js
index 51b6278..6d42c9f 100644
--- a/frontend/src/components/Stepper.js
+++ b/frontend/src/components/Stepper.js
@@ -20,17 +20,21 @@ const steps = [
 
 export default function StepperWizard(props) {
   const [activeStep, setActiveStep] = React.useState(0);
+  const [nextDisabled, setNextDisabled] = React.useState(true);
 
   const handleNext = () => {
     setActiveStep((prevActiveStep) => prevActiveStep + 1);
+    setNextDisabled(true);
   };
 
   const handleBack = () => {
     setActiveStep((prevActiveStep) => prevActiveStep - 1);
+    setNextDisabled(true);
   };
 
   const handleReset = () => {
     setActiveStep(0);
+    setNextDisabled(true);
   };
 
   let CurrentStep = activeStep >= steps.length ? steps[steps.length-1].component : steps[activeStep].component;
@@ -56,7 +60,7 @@ export default function StepperWizard(props) {
         </React.Fragment>
       ) : (
         <React.Fragment>
-          <CurrentStep {...props} />
+          <CurrentStep {...props} setNextDisabled={setNextDisabled} />
           <Box sx={{ display: 'flex', flexDirection: 'row', pt: 2, pb: 2, paddingRight: '3vw', paddingLeft: '3vw' }}>
             <Button
               color="inherit"
@@ -67,7 +71,7 @@ export default function StepperWizard(props) {
               Back
             </Button>
             <Box sx={{ flex: '1 1 auto' }} />
-            <Button onClick={handleNext}>
+            <Button onClick={handleNext} disabled={nextDisabled}>
               {activeStep === steps.length - 1 ? 'Finish' : 'Next'}
             </Button>
           </Box>
diff --git a/frontend/src/components/steps/location/Location.js b/frontend/src/components/steps/location/Location.js
index 6f5dc30..a5329b0 100644
--- a/frontend/src/components/steps/location/Location.js
+++ b/frontend/src/components/steps/location/Location.js
@@ -13,7 +13,7 @@ export default function LocationStep(props) {
     )
 
     const locationSelectionPanel = (
-        <LocationSelectorMap updateFilterState={props.updateFilterState} />
+        <LocationSelectorMap {...props} />
     )
 
     return (
diff --git a/frontend/src/components/steps/location/Map.js b/frontend/src/components/steps/location/Map.js
index d9f9025..4ec77cd 100644
--- a/frontend/src/components/steps/location/Map.js
+++ b/frontend/src/components/steps/location/Map.js
@@ -13,7 +13,8 @@ function LocationMarker(props) {
     click(e) {
       const newPosition = e.latlng;
       setPosition(newPosition);
-      props.updateCoordinateFilter({"latitude": newPosition.lat, "longitude": newPosition.lng});
+      props.updateFilterState({"latitude": newPosition.lat, "longitude": newPosition.lng});
+      props.setNextDisabled(false);
     },
   })
 
@@ -41,7 +42,7 @@ export default function Map(props) {
           attribution='&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
           url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
         />
-        <LocationMarker updateCoordinateFilter={props.updateFilterState} />
+        <LocationMarker {...props} />
         <FitNewZealandBounds />
       </MapContainer>
     </div>