+
;
+}
diff --git a/client/src/containers/projects/form/cost-inputs-overrides/index.tsx b/client/src/containers/projects/form/cost-inputs-overrides/index.tsx
new file mode 100644
index 00000000..1b6e4d18
--- /dev/null
+++ b/client/src/containers/projects/form/cost-inputs-overrides/index.tsx
@@ -0,0 +1,3 @@
+export default function CostInputsOverridesProjectForm() {
+ return
CostInputsOverridesProjectForm
;
+}
diff --git a/client/src/containers/projects/form/index.tsx b/client/src/containers/projects/form/index.tsx
new file mode 100644
index 00000000..ec2f7583
--- /dev/null
+++ b/client/src/containers/projects/form/index.tsx
@@ -0,0 +1,21 @@
+import AssumptionsProjectForm from "@/containers/projects/form/assumptions";
+import CostInputsOverridesProjectForm from "@/containers/projects/form/cost-inputs-overrides";
+import SetupProjectForm from "@/containers/projects/form/setup";
+
+import { Card } from "@/components/ui/card";
+
+export default function ProjectForm() {
+ return (
+
+ );
+}
diff --git a/client/src/containers/projects/form/setup/conservation-project-details/index.tsx b/client/src/containers/projects/form/setup/conservation-project-details/index.tsx
new file mode 100644
index 00000000..b6b2c6d9
--- /dev/null
+++ b/client/src/containers/projects/form/setup/conservation-project-details/index.tsx
@@ -0,0 +1,68 @@
+import * as React from "react";
+
+import {
+ PROJECT_SPECIFIC_EMISSION,
+ CARBON_REVENUES_TO_COVER,
+} from "@shared/entities/custom-project.entity";
+import { useAtom } from "jotai/index";
+
+import { projectFormState } from "@/app/projects/store";
+
+import { Card } from "@/components/ui/card";
+import {
+ FormControl,
+ FormField,
+ FormItem,
+ FormLabel,
+ FormMessage,
+} from "@/components/ui/form";
+import { Input } from "@/components/ui/input";
+
+export default function ConservationProjectDetails() {
+ const [{ setup: form }] = useAtom(projectFormState);
+
+ return (
+
+ Conservation project details
+
+ This information only applies for conservation projects
+
+
+ (
+
+
+ Initial carbon price assumption in $
+
+
+
+ {
+ form?.setValue(
+ "initialCarbonPriceAssumption",
+ Number(v.target.value),
+ );
+ await form?.trigger("initialCarbonPriceAssumption");
+ }}
+ />
+
+
+
+
+ )}
+ />
+
+ );
+}
diff --git a/client/src/containers/projects/form/setup/index.tsx b/client/src/containers/projects/form/setup/index.tsx
new file mode 100644
index 00000000..34347c4c
--- /dev/null
+++ b/client/src/containers/projects/form/setup/index.tsx
@@ -0,0 +1,313 @@
+"use client";
+
+import { useEffect } from "react";
+import * as React from "react";
+
+import { useForm } from "react-hook-form";
+
+import { zodResolver } from "@hookform/resolvers/zod";
+import { ACTIVITY } from "@shared/entities/activity.enum";
+import { ECOSYSTEM } from "@shared/entities/ecosystem.enum";
+import {
+ CombinedCustomProjectSchema,
+ CreateCustomProjectSchema,
+} from "@shared/schemas/custom-projects/create-custom-project.schema";
+import { useAtom } from "jotai";
+import { z } from "zod";
+
+import { client } from "@/lib/query-client";
+import { queryKeys } from "@/lib/query-keys";
+
+import { projectFormState, setupFormRef } from "@/app/projects/store";
+
+import { ACTIVITIES } from "@/containers/overview/filters/constants";
+import ConservationProjectDetails from "@/containers/projects/form/setup/conservation-project-details";
+import RestorationProjectDetails from "@/containers/projects/form/setup/restoration-project-detail";
+
+import {
+ Form,
+ FormControl,
+ FormDescription,
+ FormField,
+ FormItem,
+ FormLabel,
+ FormMessage,
+} from "@/components/ui/form";
+import { Input } from "@/components/ui/input";
+import { RadioGroup, RadioGroupItemBox } from "@/components/ui/radio-group";
+import {
+ Select,
+ SelectContent,
+ SelectItem,
+ SelectTrigger,
+ SelectValue,
+} from "@/components/ui/select";
+
+export type CreateCustomProjectForm = z.infer<
+ typeof CombinedCustomProjectSchema
+>;
+
+export default function SetupProjectForm() {
+ const [formStore, setForm] = useAtom(projectFormState);
+
+ const [, setSetupFormRef] = useAtom(setupFormRef);
+
+ const { queryKey } = queryKeys.projects.countries;
+ const { data: countryOptions } = client.projects.getProjectCountries.useQuery(
+ queryKey,
+ {},
+ {
+ queryKey,
+ select: (data) =>
+ data.body.data.map(({ name, code }) => ({ label: name, value: code })),
+ },
+ );
+
+ const form = useForm
({
+ resolver: zodResolver(CombinedCustomProjectSchema),
+ defaultValues: {
+ name: "",
+ activity: ACTIVITY.CONSERVATION,
+ ecosystem: ECOSYSTEM.SEAGRASS,
+ countryCode: countryOptions?.[0]?.value,
+ projectSize: 20,
+ // carbonRevenuesToCover: CARBON_REVENUES_TO_COVER.CAPEX_AND_OPEX,
+ initialCarbonPriceAssumption: 1000,
+ },
+ });
+
+ useEffect(() => {
+ setForm((prev) => ({ ...prev, setup: form }));
+ }, [form, setForm]);
+
+ console.log(form.getValues());
+
+ return (
+
+
+ );
+}
diff --git a/client/src/containers/projects/form/setup/restoration-project-detail/index.tsx b/client/src/containers/projects/form/setup/restoration-project-detail/index.tsx
new file mode 100644
index 00000000..d8ba4067
--- /dev/null
+++ b/client/src/containers/projects/form/setup/restoration-project-detail/index.tsx
@@ -0,0 +1,11 @@
+import { useAtom } from "jotai/index";
+
+import { projectFormState } from "@/app/projects/store";
+
+import { Card } from "@/components/ui/card";
+
+export default function RestorationProjectDetails() {
+ const [formStore] = useAtom(projectFormState);
+
+ return RestorationProjectDetails TBD;
+}
diff --git a/client/src/containers/projects/new/header.tsx b/client/src/containers/projects/new/header.tsx
new file mode 100644
index 00000000..27c5157a
--- /dev/null
+++ b/client/src/containers/projects/new/header.tsx
@@ -0,0 +1,46 @@
+"use client";
+
+import { FormProvider } from "react-hook-form";
+
+import { useAtom } from "jotai";
+
+import { projectFormState, setupFormRef } from "@/app/projects/store";
+
+import { Button } from "@/components/ui/button";
+import { SidebarTrigger } from "@/components/ui/sidebar";
+
+export default function Header() {
+ const [formStore] = useAtom(projectFormState);
+ const [setupRef] = useAtom(setupFormRef);
+
+ console.log({ setupRef });
+
+ console.log(formStore.setup?.formState.errors);
+
+ return (
+
+
+
+
Custom project
+
+
+
+
+
+