adding the harvest plan stuff to the field page

src/harvestPlan/DuplicateHarvestPlan.tsx

@@ -7,16 +7,17 @@ import {
   TextField
 } from "@mui/material";
 import ResponsiveDialog from "common/ResponsiveDialog";
+import { Option } from "common/SearchSelect";
 import { Field, HarvestPlan, Task } from "models";
 import moment from "moment";
 import { pond } from "protobuf-ts/pond";
-import { useGlobalState, useHarvestPlanAPI, useTaskAPI } from "providers";
+import { useFieldAPI, useGlobalState, useHarvestPlanAPI, useTaskAPI } from "providers";
 import { useCallback, useEffect, useState } from "react";
 
 interface Props {
   open: boolean;
   close: () => void;
-  fields: Field[];
+  fields?: Field[];
   plan: HarvestPlan;
 }
 
@@ -29,6 +30,8 @@ export default function DuplicateHarvestPlan(props: Props) {
   const harvestPlanAPI = useHarvestPlanAPI();
   const taskAPI = useTaskAPI();
   const [ready, setReady] = useState(false);
+  const [fieldOptions, setFieldOptions] = useState<Field[]>([])
+  const fieldAPI = useFieldAPI();
 
   const loadTasks = useCallback(() => {
     taskAPI.listTasks(50, 0, "asc", "start", plan.key(), undefined).then(resp => {
@@ -41,9 +44,25 @@ export default function DuplicateHarvestPlan(props: Props) {
     loadTasks();
   }, [loadTasks]);
 
+  useEffect(()=>{
+    if(fields){
+      //if fields were passed in use those
+      setFieldOptions(fields)
+    }else{
+      //otherwise load them
+      fieldAPI.listFields(50, 0, "asc", "fieldName").then(resp => {
+        setFieldOptions(resp.data.fields.map(f => Field.create(f)))
+      }).catch(err => {
+        
+      })
+    }
+  },[fields])
+
+  //this should load the fields here
+
   const duplicate = () => {
     let planSettings = HarvestPlan.clone(plan).settings;
-    planSettings.field = fields[newFieldIndex].key();
+    planSettings.field = fieldOptions[newFieldIndex].key();
     planSettings.createDate = moment.now();
     if (title !== "") {
       planSettings.title = title;
@@ -69,7 +88,7 @@ export default function DuplicateHarvestPlan(props: Props) {
           value={newFieldIndex}
           onChange={e => setNewFieldIndex(+e.target.value)}
           color="primary">
-          {fields.map((option, i) => (
+          {fieldOptions.map((option, i) => (
             <MenuItem key={option.key()} value={i}>
               {option.fieldName()}
             </MenuItem>
@@ -98,8 +117,8 @@ export default function DuplicateHarvestPlan(props: Props) {
           color="primary"
           disabled={
             !ready ||
-            (fields[newFieldIndex] &&
-              !fields[newFieldIndex].permissions.includes(pond.Permission.PERMISSION_WRITE))
+            (fieldOptions[newFieldIndex] &&
+              !fieldOptions[newFieldIndex].permissions.includes(pond.Permission.PERMISSION_WRITE))
           }>
           Duplicate
         </Button>

src/harvestPlan/HarvestPlanActions.tsx

@@ -13,7 +13,7 @@ import ShareObjectIcon from "@mui/icons-material/Share";
 import ObjectUsersIcon from "@mui/icons-material/AccountCircle";
 import ObjectTeamsIcon from "@mui/icons-material/SupervisedUserCircle";
 import { pond } from "protobuf-ts/pond";
-import React, { useState } from "react";
+import React, { useEffect, useState } from "react";
 import ObjectUsers from "user/ObjectUsers";
 import ShareObject from "user/ShareObject";
 import { isOffline } from "utils/environment";
@@ -43,7 +43,7 @@ const useStyles = makeStyles((theme: Theme) => ({
 interface Props {
   plan: HarvestPlan;
   planField: Field;
-  fieldList: Field[];
+  fieldList?: Field[];
   permissions: pond.Permission[];
   refreshCallback: (updatedPlan?: HarvestPlan) => void;
   hideNew?: boolean;
@@ -215,7 +215,7 @@ export default function HarvestPlanActions(props: Props) {
               setUpdatePlan(true);
               setOpenState({ ...openState, settings: true });
             }}>
-            <Edit /> Edit or Add Activity
+            <Edit /> Activities
           </Button>
         )}
         <IconButton

src/harvestPlan/HarvestPlanDisplay.tsx

@@ -10,7 +10,7 @@ import {
 import { Notes } from "@mui/icons-material";
 import GrainDescriber from "grain/GrainDescriber";
 import { Field, HarvestPlan } from "models";
-import React, { useState } from "react";
+import React, { useEffect, useState } from "react";
 import { getThemeType } from "theme";
 import Chat from "chat/Chat";
 import { pond } from "protobuf-ts/pond";
@@ -23,7 +23,7 @@ interface Props {
   permissions: pond.Permission[];
   planField: Field;
   loading: boolean;
-  fieldList: Field[];
+  fieldList?: Field[];
   changePlan: (updatedPlan?: HarvestPlan) => void;
 }
 
@@ -175,7 +175,7 @@ export default function HarvestPlanDisplay(props: Props) {
             <Typography
               variant="h5"
               style={{ fontWeight: 700, marginTop: "auto", marginBottom: "auto" }}>
-              Crop Plan{plan.key() !== "" ? " - " + plan.settings.title : " - None Found"}
+              {plan.key() !== "" ? plan.settings.title : "None Found"}
             </Typography>
             {!isMobile && permissions.includes(pond.Permission.PERMISSION_WRITE) && (
               <HarvestPlanActions

src/harvestPlan/HarvestPlanTable.tsx

@@ -0,0 +1,26 @@
+import { Box } from "@mui/material"
+import ResponsiveTable from "common/ResponsiveTable"
+import { useHarvestPlanAPI } from "providers"
+import { useCallback, useEffect, useState } from "react"
+
+interface Props {
+  field?: string
+}
+export default function HarvestPlanTable(props: Props){
+  const {field} = props
+  const harvestAPI = useHarvestPlanAPI()
+  const [page, setPage] = useState(0)
+  const [pageSize, setPageSize] = useState(10)
+  
+  useEffect(()=>{
+    harvestAPI.listHarvestPlans(pageSize, page*pageSize, "asc", "name", field).then(resp => {
+      console.log(resp)
+    })
+  },[page, pageSize, field])
+
+  return (
+    <Box>
+
+    </Box>
+  )
+}