dumb refactor but sunk cost is to great keep pushing

src/app/_components/CalenderFormField.tsx

@@ -0,0 +1,54 @@
+import { format } from "date-fns";
+import { CalendarIcon } from "lucide-react";
+import type { Control, FieldValues, Path } from "react-hook-form";
+import { Button } from "~/components/ui/button";
+import { Calendar } from "~/components/ui/calendar";
+import { FormControl, FormField, FormItem, FormLabel } from "~/components/ui/form";
+import { Input } from "~/components/ui/input";
+import { Popover, PopoverContent, PopoverTrigger } from "~/components/ui/popover";
+import { cn } from "~/lib/utils";
+export default function CalendarFormField<T extends FieldValues>(params: { control: Control<T>, name: Path<T>, label: string }) {
+  return (
+    <FormField
+      control={params.control}
+      name={params.name}
+      render={({ field }) => (
+        <FormItem className="flex flex-col">
+          <FormLabel>{params.label}</FormLabel>
+          <Popover>
+            <PopoverTrigger asChild>
+              <FormControl>
+                <Button
+                  variant={"outline"}
+                  className={cn(
+                    "w-[240px] pl-3 text-left font-normal",
+                    !field.value && "text-muted-foreground"
+                  )}
+                >
+                  {field.value ? (
+                    format(field.value, "PPP")
+                  ) : (
+                    <span>Pick a date</span>
+                  )}
+                  <CalendarIcon className="ml-auto h-4 w-4 opacity-50" />
+                </Button>
+              </FormControl>
+            </PopoverTrigger>
+            <PopoverContent className="w-auto p-0" align="start">
+              <Calendar
+                mode="single"
+                selected={field.value}
+                onSelect={field.onChange}
+                disabled={(date) =>
+                  date > new Date() || date < new Date("1900-01-01")
+                }
+                initialFocus
+                captionLayout="dropdown"
+              />
+            </PopoverContent>
+          </Popover>
+        </FormItem>
+      )}
+    />
+  )
+}

src/app/_components/DependentText.tsx

@@ -0,0 +1,10 @@
+export default function DependentText(params: {true:string,false:string,bool:boolean}) {
+  return (
+    <>
+      { params.bool ?
+        params.true :
+        params.false
+      }
+    </>
+  )
+}

src/app/_components/MdeFormField.tsx

@@ -0,0 +1,25 @@
+import MDEditor from "@uiw/react-md-editor";
+import type { Control, FieldValues, Path } from "react-hook-form";
+import { FormControl, FormField, FormItem, FormLabel } from "~/components/ui/form";
+export default function MdeFormField<T extends FieldValues>(params: { control: Control<T>, name: Path<T>, label: string, dataColorMode: "dark"|"light" }) {
+  return (
+    <FormField
+      control={params.control}
+      name={params.name}
+      render={({ field }) => (
+        <FormItem>
+          <FormLabel>
+            Description
+          </FormLabel>
+          <FormControl>
+            <MDEditor
+              value={field.value ? field.value : ""}
+              onChange={field.onChange}
+              data-color-mode={params.dataColorMode}
+            />
+          </FormControl>
+        </FormItem>
+      )}
+    />
+  )
+}

src/app/_components/MutationFormMessage.tsx

@@ -0,0 +1,21 @@
+import { FormMessage } from "~/components/ui/form";
+
+interface Error {
+    message: string
+}
+
+export default function DependentFormMessaage( params: {trueStatus: string, falseStatus: string, falseError?: Error|null, trueError?:Error|null, bool: boolean} ) {
+  return (
+    <>
+    {
+      params.bool ? 
+      <FormMessage className={params.trueStatus == "success" ? "text-green-500" : "text-red-500"}>
+        {params.trueError ? params.trueError.message : params.trueStatus}
+      </FormMessage> :
+      <FormMessage className={params.falseStatus == "success" ? "text-green-500" : "text-red-500"}>
+        {params.falseError ? params.falseError.message : params.falseStatus}
+      </FormMessage>
+    }
+    </>
+  )
+}

src/app/_components/SelectFormField.tsx

@@ -0,0 +1,29 @@
+import type { ReactNode } from "react";
+import type { Control, FieldValues, Path } from "react-hook-form";
+import { FormField,FormControl, FormItem, FormLabel } from "~/components/ui/form";
+import { Select, SelectContent, SelectTrigger, SelectValue } from "~/components/ui/select";
+export default function SelectFormField<T extends FieldValues>(params: { control: Control<T>, name: Path<T>, label: string, defaultValue:string|undefined, placeholder:string|undefined, children: ReactNode}) {
+  return (
+    <FormField
+      control={params.control}
+      name={params.name}
+      render={({ field }) => (
+        <FormItem>
+          <FormLabel>
+            {params.label}
+          </FormLabel>
+          <Select onValueChange={field.onChange} value={field.value == null ? undefined : field.value} defaultValue={params.defaultValue}>
+            <FormControl>
+              <SelectTrigger>
+                <SelectValue placeholder={params.placeholder} />
+              </SelectTrigger>
+            </FormControl>
+            <SelectContent>
+                {params.children}
+            </SelectContent>
+          </Select>
+        </FormItem>
+      )}
+    />
+  )
+}

src/app/_components/TextInputFormField.tsx

@@ -0,0 +1,17 @@
+import type { Control, FieldValues, Path } from "react-hook-form";
+import { FormField, FormItem, FormLabel } from "~/components/ui/form";
+import { Input } from "~/components/ui/input";
+export default function TexttInputFormField<T extends FieldValues>(params: { control: Control<T>, name: Path<T>, label:string }) {
+  return (
+  <FormField
+    control={params.control}
+    name={params.name}
+    render={({ field }) => (
+      <FormItem className="flex flex-col">
+        <FormLabel>{params.label}</FormLabel>
+          <Input placeholder="release link" onChange={field.onChange} value={field.value == null ? undefined : field.value} />
+      </FormItem>
+    )}
+  />
+  )
+}