diff --git a/app/components/general-layout.tsx b/app/components/general-layout.tsx index f740ef1..568013c 100644 --- a/app/components/general-layout.tsx +++ b/app/components/general-layout.tsx @@ -174,13 +174,6 @@ export const GeneralLayout = ({ children }: React.PropsWithChildren) => { ); }; - -const UploadFormSchema = z.object({ - uppyFiles: z.array(z.any()).min(1, { - message: "At least one file must be uploaded", - }), -}); - const UploadFileForm = () => { const { getRootProps, @@ -193,44 +186,21 @@ const UploadFileForm = () => { upload, } = useUppy(); - const [form, fields] = useForm({ - constraint: getZodConstraint(UploadFormSchema), - shouldValidate: "onInput", - onValidate: ({ formData }) => { - const result = parseWithZod(formData, { - schema: UploadFormSchema, - }); - return result; - }, - onSubmit: (e) => { - e.preventDefault(); - return upload(); - }, - }); - const inputProps = getInputProps(); - const files = useInputControl({ - key: fields.uppyFiles.key, - name: fields.uppyFiles.name, - formId: form.id - }); const isUploading = state === "uploading"; const isCompleted = state === "completed"; const hasErrored = state === "error"; const hasStarted = state !== "idle" && state !== "initializing"; - const isValid = form.valid || getFiles().length > 0; + const isValid = getFiles().length > 0; const getFailedState = (id: string) => failedFiles.find((file) => file.id === id); - console.log({ files: getFiles() }); - return ( <> Upload Files -
{!hasStarted ? (
{ aria-hidden key={new Date().toISOString()} multiple - name={fields.uppyFiles.name} + name="uppyFiles[]" {...inputProps} - value={files.value} - onChange={() => { - //@ts-expect-error -- conform has shitty typeinference for controls - files.change(getFiles()); - }} />

Drag & Drop Files or Browse

@@ -268,7 +233,6 @@ const UploadFileForm = () => { @@ -302,12 +266,12 @@ const UploadFileForm = () => { ) : null} - ); }; diff --git a/app/components/lib/uppy.ts b/app/components/lib/uppy.ts index b342ea7..4fbd6d0 100644 --- a/app/components/lib/uppy.ts +++ b/app/components/lib/uppy.ts @@ -57,14 +57,12 @@ export function useUppy() { "completed" | "idle" | "initializing" | "error" | "uploading" >("initializing"); - const [inputProps, setInputProps] = useState< - | { + const [inputProps, setInputProps] = useState<{ ref: typeof inputRef; type: "file"; onChange: (event: ChangeEvent) => void; } - | object - >({}); + >(); // eslint-disable-next-line @typescript-eslint/no-explicit-any const [failedFiles, setFailedFiles] = useState, Record>[]>([]) const getRootProps = useMemo( @@ -76,7 +74,6 @@ export function useUppy() { //@ts-expect-error -- dumb html inputRef.current.value = null; inputRef.current.click(); - console.log("clicked", { input: inputRef.current }); } }, role: "presentation",