+ {JSON.stringify(values, null, 2)}
+ ,
+ );
+ } catch (error) {
+ console.error("Form submission error", error);
+ toast.error("Failed to submit the form. Please try again.");
+ }
+ }
+
+ return (
+
+
+ );
+}
diff --git a/src/components/ui/file-upload.tsx b/src/components/ui/file-upload.tsx
new file mode 100644
index 0000000..5e08a36
--- /dev/null
+++ b/src/components/ui/file-upload.tsx
@@ -0,0 +1,363 @@
+"use client";
+
+import { Input } from "~/components/ui/input";
+import { cn } from "~/lib/utils";
+import type { Dispatch, SetStateAction } from "react";
+import {
+ createContext,
+ forwardRef,
+ useCallback,
+ useContext,
+ useEffect,
+ useRef,
+ useState,
+} from "react";
+import type {
+ DropzoneState,
+ FileRejection,
+ DropzoneOptions,
+} from "react-dropzone";
+import { useDropzone } from "react-dropzone";
+import { toast } from "sonner";
+import { Trash2 as RemoveIcon } from "lucide-react";
+import { buttonVariants } from "~/components/ui/button";
+
+type DirectionOptions = "rtl" | "ltr" | undefined;
+
+type FileUploaderContextType = {
+ dropzoneState: DropzoneState;
+ isLOF: boolean;
+ isFileTooBig: boolean;
+ removeFileFromSet: (index: number) => void;
+ activeIndex: number;
+ setActiveIndex: Dispatch