feat: Add country (#42)

* feat: add country input * feat: add country to planter details * fix: add checks and sort registrations array * fix: change sort
Greenstand · Mar 12, 2021 · d9abefa · d9abefa
1 parent efee5b6
commit d9abefa
Showing 1 changed file with 30 additions and 15 deletions.
diff --git a/src/components/PlanterDetail.js b/src/components/PlanterDetail.js
@@ -57,7 +57,7 @@ const useStyle = makeStyles((theme) => ({
 }));
 
 const PlanterDetail = (props) => {
-  const [planterRegistration, setPlanterRegistration] = React.useState(null);
+  const [planterRegistrations, setPlanterRegistrations] = React.useState(null);
   const [editDialogOpen, setEditDialogOpen] = React.useState(false);
   const [planter, setPlanter] = React.useState({});
   const classes = useStyle();
@@ -69,35 +69,32 @@ const PlanterDetail = (props) => {
       if (planter && planter.id !== planterId) {
         setPlanter({});
       }
-
       if (planterId) {
         const match = await props.plantersDispatch.getPlanter({
           id: planterId,
         });
         setPlanter(match);
 
         if (
-          !planterRegistration ||
-          planterRegistration.planterId !== planterId
+          !planterRegistrations ||
+          (planterRegistrations.length > 0 &&
+            planterRegistrations[0].planter_id !== planterId)
         ) {
-          setPlanterRegistration(null);
+          setPlanterRegistrations(null);
           api.getPlanterRegistrations(planterId).then((registrations) => {
             if (registrations && registrations.length) {
-              setPlanterRegistration(registrations[0]);
+              const sortedRegistrations = registrations.sort((a, b) =>
+                a.created_at > b.created_at ? 1 : -1,
+              );
+              setPlanterRegistrations(sortedRegistrations);
             }
           });
         }
       }
     }
-
     loadPlanterDetail();
     // eslint-disable-next-line
-  }, [
-    planterId,
-    planterRegistration,
-    props.plantersState.planters,
-    props.plantersDispatch,
-  ]);
+  }, [planterId, props.plantersState.planters, props.plantersDispatch]);
 
   function handleEditClick() {
     setEditDialogOpen(true);
@@ -195,11 +192,29 @@ const PlanterDetail = (props) => {
               </Typography>
             </Grid>
             <Divider />
+            <Grid container direction="column" className={classes.box}>
+              <Typography variant="subtitle1">Country</Typography>
+              <Typography variant="body1">
+                {(planterRegistrations &&
+                  planterRegistrations
+                    .map((item) => item.country)
+                    .filter(
+                      (country, i, arr) =>
+                        country && arr.indexOf(country) === i,
+                    )
+                    .join(', ')) ||
+                  '---'}
+              </Typography>
+            </Grid>
+            <Divider />
             <Grid container direction="column" className={classes.box}>
               <Typography variant="subtitle1">Registered</Typography>
               <Typography variant="body1">
-                {(planterRegistration &&
-                  getDateTimeStringLocale(planterRegistration.createdAt)) ||
+                {(planterRegistrations &&
+                  planterRegistrations.length > 0 &&
+                  getDateTimeStringLocale(
+                    planterRegistrations[0].created_at,
+                  )) ||
                   '---'}
               </Typography>
             </Grid>