ForFarmTeam/ForFarm
1
0
Fork 0
mirror of https://github.com/ForFarmTeam/ForFarm.git synced 2025-12-19 22:14:08 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat: update harvest and planting detail forms to handle data changes and improve type safety

Browse Source
This commit is contained in:
THIS ONE IS A LITTLE BIT TRICKY KRUB 2025-03-13 20:23:45 +07:00
parent f7f64562ab
commit 4ffb6567ba
3 changed files with 82 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

63
frontend/app/(sidebar)/setup/harvest-detail-form.tsx
View File

@ -24,7 +24,11 @@ import { Button } from "@/components/ui/button";
type harvestSchema = z.infer<typeof harvestDetailsFormSchema>;
export default function HarvestDetailsForm() {
export default function HarvestDetailsForm({
onChange,
}: {
onChange: (data: harvestSchema) => void;
}) {
const form = useForm<harvestSchema>({
resolver: zodResolver(harvestDetailsFormSchema),
defaultValues: {
@ -38,9 +42,15 @@ export default function HarvestDetailsForm() {
expectedYieldPerAcre: 0,
},
});
const onSubmit: (data: harvestSchema) => void = (data) => {
onChange(data);
};
return (
<Form {...form}>
<form className="grid grid-cols-3 gap-5">
<form
className="grid grid-cols-3 gap-5"
onSubmit={form.handleSubmit(onSubmit)}
>
<FormField
control={form.control}
name="daysToFlower"
@ -57,6 +67,13 @@ export default function HarvestDetailsForm() {
id="daysToFlower"
className="w-96"
{...field}
onChange={(e) => {
// convert to number
const value = e.target.value
? parseInt(e.target.value, 10)
: "";
field.onChange(value);
}}
/>
</div>
</div>
@ -81,6 +98,13 @@ export default function HarvestDetailsForm() {
id="daysToMaturity"
className="w-96"
{...field}
onChange={(e) => {
// convert to number
const value = e.target.value
? parseInt(e.target.value, 10)
: "";
field.onChange(value);
}}
/>
</div>
</div>
@ -105,6 +129,13 @@ export default function HarvestDetailsForm() {
id="harvestWindow"
className="w-96"
{...field}
onChange={(e) => {
// convert to number
const value = e.target.value
? parseInt(e.target.value, 10)
: "";
field.onChange(value);
}}
/>
</div>
</div>
@ -129,6 +160,13 @@ export default function HarvestDetailsForm() {
id="estimatedLossRate"
className="w-96"
{...field}
onChange={(e) => {
// convert to number
const value = e.target.value
? parseInt(e.target.value, 10)
: "";
field.onChange(value);
}}
/>
</div>
</div>
@ -178,6 +216,13 @@ export default function HarvestDetailsForm() {
id="estimatedRevenue"
className="w-96"
{...field}
onChange={(e) => {
// convert to number
const value = e.target.value
? parseInt(e.target.value, 10)
: "";
field.onChange(value);
}}
/>
</div>
</div>
@ -202,6 +247,13 @@ export default function HarvestDetailsForm() {
id="expectedYieldPer100ft"
className="w-96"
{...field}
onChange={(e) => {
// convert to number
const value = e.target.value
? parseInt(e.target.value, 10)
: "";
field.onChange(value);
}}
/>
</div>
</div>
@ -226,6 +278,13 @@ export default function HarvestDetailsForm() {
id="expectedYieldPerAcre"
className="w-96"
{...field}
onChange={(e) => {
// convert to number
const value = e.target.value
? parseInt(e.target.value, 10)
: "";
field.onChange(value);
}}
/>
</div>
</div>

55
frontend/app/(sidebar)/setup/page.tsx
View File

@ -4,48 +4,31 @@ import PlantingDetailsForm from "./planting-detail-form";
import HarvestDetailsForm from "./harvest-detail-form";
import { Separator } from "@/components/ui/separator";
import GoogleMapWithDrawing from "@/components/google-map-with-drawing";
import {
plantingDetailsFormSchema,
harvestDetailsFormSchema,
} from "@/schemas/application.schema";
import { z } from "zod";
type plantingSchema = z.infer<typeof plantingDetailsFormSchema>;
type harvestSchema = z.infer<typeof harvestDetailsFormSchema>;
export default function SetupPage() {
type PlantingDetails = {
daysToEmerge: number;
plantSpacing: number;
rowSpacing: number;
plantingDepth: number;
averageHeight: number;
isPerennial: boolean;
autoCreateTasks: boolean;
startMethod?: string;
lightProfile?: string;
soilConditions?: string;
plantingDetails?: string;
pruningDetails?: string;
};
const [plantingDetails, setPlantingDetails] =
useState<PlantingDetails | null>(null);
const [harvestDetails, setHarvestDetails] = useState(null);
const [plantingDetails, setPlantingDetails] = useState<plantingSchema | null>(
null
);
const [harvestDetails, setHarvestDetails] = useState<harvestSchema | null>(
null
);
const [mapData, setMapData] = useState(null);
// handle planting details submission
const handlePlantingDetailsChange = (data: {
daysToEmerge: number;
plantSpacing: number;
rowSpacing: number;
plantingDepth: number;
averageHeight: number;
isPerennial: boolean;
autoCreateTasks: boolean;
startMethod?: string;
lightProfile?: string;
soilConditions?: string;
plantingDetails?: string;
pruningDetails?: string;
}) => {
const handlePlantingDetailsChange = (data: plantingSchema) => {
setPlantingDetails(data);
};
// handle harvest details submission
const handleHarvestDetailsChange = (data: SetStateAction<null>) => {
const handleHarvestDetailsChange = (data: harvestSchema) => {
setHarvestDetails(data);
};
@ -54,9 +37,11 @@ export default function SetupPage() {
setMapData(data);
};
// log the changes
useEffect(() => {
console.log(plantingDetails);
}, [plantingDetails]);
console.log(harvestDetails);
}, [plantingDetails, harvestDetails]);
const handleSubmit = () => {
if (!plantingDetails || !harvestDetails || !mapData) {
@ -105,7 +90,7 @@ export default function SetupPage() {
</div>
<Separator className="mt-3" />
<div className="mt-10 flex justify-center">
{/* <HarvestDetailsForm onChange={handleHarvestDetailsChange} /> */}
<HarvestDetailsForm onChange={handleHarvestDetailsChange} />
</div>
{/* Map Section */}

17
frontend/app/(sidebar)/setup/planting-detail-form.tsx
View File

@ -23,23 +23,8 @@ import {
import { Textarea } from "@/components/ui/textarea";
import { Switch } from "@/components/ui/switch";
import { Button } from "@/components/ui/button";
import { useState } from "react";
type plantingSchema = z.infer<typeof plantingDetailsFormSchema>;
interface FormData {
daysToEmerge: number;
plantSpacing: number;
rowSpacing: number;
plantingDepth: number;
averageHeight: number;
startMethod?: string;
lightProfile?: string;
soilConditions?: string;
plantingDetails?: string;
pruningDetails?: string;
isPerennial: boolean;
autoCreateTasks: boolean;
}
export default function PlantingDetailsForm({
onChange,
@ -64,7 +49,7 @@ export default function PlantingDetailsForm({
},
});
const onSubmit = (data: FormData) => {
const onSubmit = (data: plantingSchema) => {
onChange(data);
};
return (