WIP

client/package.json

@@ -7,7 +7,8 @@
     "build": "next build",
     "start": "next start",
     "lint": "next lint",
-    "lint:fix": "next lint --fix"
+    "lint:fix": "next lint --fix",
+    "check-types": "tsc"
   },
   "dependencies": {
     "@hookform/resolvers": "3.9.0",

client/src/app/auth/api/[...nextauth]/config.ts

@@ -1,4 +1,5 @@
 import { cookies } from "next/headers";
+
 import { UserWithAccessToken } from "@shared/dtos/users/user.dto";
 import { LogInSchema } from "@shared/schemas/auth/login.schema";
 import type {

client/src/app/projects/new/page.tsx

@@ -1,3 +1,5 @@
+import { ACTIVITY } from "@shared/entities/activity.enum";
+import { ECOSYSTEM } from "@shared/entities/ecosystem.enum";
 import {
   dehydrate,
   HydrationBoundary,
@@ -17,6 +19,20 @@ export default async function CreateCustomProjectPage() {
     queryFn: () => client.customProjects.getAvailableCountries.query(),
   });
 
+  const defaultActivity = ACTIVITY.CONSERVATION;
+  const defaultEcosystem = ECOSYSTEM.SEAGRASS;
+
+  await queryClient.prefetchQuery({
+    queryKey: queryKeys.customProjects.assumptions({
+      ecosystem: defaultEcosystem,
+      activity: defaultActivity,
+    }).queryKey,
+    queryFn: () =>
+      client.customProjects.getDefaultAssumptions.query({
+        query: { ecosystem: defaultEcosystem, activity: defaultActivity },
+      }),
+  });
+
   return (
     <HydrationBoundary state={dehydrate(queryClient)}>
       <CreateCustomProject />

client/src/app/providers.tsx

@@ -17,7 +17,7 @@ import { TooltipProvider } from "@/components/ui/tooltip";
 
 let browserQueryClient: QueryClient | undefined = undefined;
 
-function getQueryClient() {
+export function getQueryClient() {
   if (isServer) {
     // Server: always make a new query client
     return makeQueryClient();

client/src/components/ui/accordion.tsx

@@ -47,7 +47,7 @@ const AccordionContent = React.forwardRef<
 >(({ className, children, ...props }, ref) => (
   <AccordionPrimitive.Content
     ref={ref}
-    className="overflow-hidden text-sm data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down"
+    className="data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down overflow-hidden text-sm"
     {...props}
   >
     <div className={cn("pb-4 pt-0", className)}>{children}</div>

client/src/components/ui/radio-group.tsx

@@ -7,8 +7,6 @@ import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
 
 import { cn } from "@/lib/utils";
 
-import { Label } from "@/components/ui/label";
-
 const RadioGroup = React.forwardRef<
   React.ElementRef<typeof RadioGroupPrimitive.Root>,
   React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Root>
@@ -55,14 +53,15 @@ const RadioGroupItemBox = React.forwardRef<
   RadioGroupItemBoxProps
 >(({ className, checked, label, description, value, ...radioProps }, ref) => {
   return (
-    <div
+    <label
       className={cn(
         "cursor-pointer rounded-xl border border-border p-4",
         className,
         {
           "border-primary": checked,
         },
       )}
+      htmlFor={value}
     >
       <div className="flex items-center gap-2">
         <RadioGroupItem
@@ -72,12 +71,12 @@ const RadioGroupItemBox = React.forwardRef<
           checked={checked}
           {...radioProps}
         />
-        <Label htmlFor={value}>{label}</Label>
+        <span>{label}</span>
       </div>
       {description && (
         <p className="pl-6 text-sm text-muted-foreground">{description}</p>
       )}
-    </div>
+    </label>
   );
 });
 

client/src/containers/projects/form/assumptions/columns.tsx

@@ -1,21 +1,11 @@
-import React from "react";
-
-import { useFormContext } from "react-hook-form";
-
 import { createColumnHelper } from "@tanstack/react-table";
 
 import { formatNumber } from "@/lib/format";
 
+import CellValue from "@/containers/projects/form/cell-value";
 import { DataColumnDef } from "@/containers/projects/form/cost-inputs-overrides/constants";
 import { CreateCustomProjectForm } from "@/containers/projects/form/setup";
 
-import {
-  FormControl,
-  FormField,
-  FormItem,
-  FormMessage,
-} from "@/components/ui/form";
-import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
 
 export type AssumptionsFormProperty =
@@ -24,68 +14,48 @@ export type AssumptionsFormProperty =
 const columnHelper =
   createColumnHelper<DataColumnDef<AssumptionsFormProperty>>();
 
-export const COLUMNS = () => {
-  const form = useFormContext<CreateCustomProjectForm>();
-
-  return [
-    columnHelper.accessor("label", {
-      header: () => <span>Cost</span>,
-      cell: (props) => {
-        return (
-          <Label
-            tooltip={{
-              title: props.getValue(),
-              // todo: update with descriptions
-              content: props.getValue(),
-            }}
-          >
-            {props.getValue()}
-          </Label>
-        );
-      },
-    }),
-    columnHelper.accessor("defaultValue", {
-      header: () => <span>Base value</span>,
-      cell: (props) => {
-        const value = props.getValue();
-        if (value === null || value === undefined) {
-          return "-";
+export const COLUMNS = [
+  columnHelper.accessor("label", {
+    header: () => <span>Cost</span>,
+    cell: (props) => {
+      return (
+        <Label
+          tooltip={{
+            title: props.getValue(),
+            // todo: update with descriptions
+            content: props.getValue(),
+          }}
+        >
+          {props.getValue()}
+        </Label>
+      );
+    },
+  }),
+  columnHelper.accessor("defaultValue", {
+    header: () => <span>Base value</span>,
+    cell: (props) => {
+      const value = props.getValue();
+      if (value === null || value === undefined) {
+        return "-";
+      }
+
+      if (!Number(value)) return value;
+
+      return formatNumber(Number(value));
+    },
+  }),
+  columnHelper.accessor("unit", {
+    header: () => <span>Unit</span>,
+  }),
+  columnHelper.accessor("value", {
+    header: () => <span>Override value</span>,
+    cell: (props) => (
+      <CellValue
+        name={
+          props.row.original
+            .property as keyof CreateCustomProjectForm["assumptions"]
         }
-
-        if (!Number(value)) return value;
-
-        return formatNumber(Number(value));
-      },
-    }),
-    columnHelper.accessor("unit", {
-      header: () => <span>Unit</span>,
-    }),
-    columnHelper.accessor("value", {
-      header: () => <span>Override value</span>,
-      cell: (props) => {
-        return (
-          <FormField
-            control={form.control}
-            /*
-            // @ts-expect-error fix later */
-            name={props.row.original.property}
-            render={({ field }) => (
-              <FormItem>
-                <FormControl>
-                  <Input
-                    type="number"
-                    placeholder="Insert value"
-                    min={0}
-                    {...field}
-                    value={field.value as number}
-                  />
-                </FormControl>
-                <FormMessage />
-              </FormItem>
-            )}
-          />
-        );
-      },
-    }),
-  ];
-};
+      />
+    ),
+  }),
+];

client/src/containers/projects/form/assumptions/index.tsx

@@ -56,17 +56,19 @@ export default function AssumptionsProjectForm() {
             label: name,
             unit,
             property:
-              `assumption.${ASSUMPTIONS_NAME_TO_DTO_MAP[name as keyof typeof ASSUMPTIONS_NAME_TO_DTO_MAP]}` as AssumptionsFormProperty,
+              `assumptions.${ASSUMPTIONS_NAME_TO_DTO_MAP[name as keyof typeof ASSUMPTIONS_NAME_TO_DTO_MAP]}` as AssumptionsFormProperty,
             defaultValue: value,
-            value: "",
+            value: Number(value),
           })),
       },
     );
 
+  // const c = useMemo(() => COLUMNS(), []);
+
   const table = useReactTable({
     // @ts-expect-error fix later
     data: isSuccess ? data : NO_DATA,
-    columns: COLUMNS(),
+    columns: COLUMNS,
     getCoreRowModel: getCoreRowModel(),
   });
 

client/src/containers/projects/form/cell-value.tsx

@@ -0,0 +1,45 @@
+import { useFormContext } from "react-hook-form";
+
+import { CreateCustomProjectForm } from "@/containers/projects/form/setup";
+
+import {
+  FormControl,
+  FormField,
+  FormItem,
+  FormMessage,
+} from "@/components/ui/form";
+import { Input } from "@/components/ui/input";
+
+export default function CellValue({
+  name,
+}: {
+  name: keyof CreateCustomProjectForm;
+}) {
+  const form = useFormContext<CreateCustomProjectForm>();
+
+  return (
+    <FormField
+      control={form.control}
+      name={name}
+      render={({ field }) => {
+        // eslint-disable-next-line @typescript-eslint/no-unused-vars
+        const { value, ...restField } = field;
+
+        return (
+          <FormItem>
+            <FormControl>
+              <Input
+                {...restField}
+                type="number"
+                placeholder="Insert value"
+                min={0}
+                defaultValue={field.value as number}
+              />
+            </FormControl>
+            <FormMessage />
+          </FormItem>
+        );
+      }}
+    />
+  );
+}