28 lines
977 B
TypeScript
28 lines
977 B
TypeScript
import { FieldHookConfig, useField } from "formik";
|
|
import NejDropzone from "./NejDropzone";
|
|
import { Accept } from "react-dropzone";
|
|
|
|
/**
|
|
* Renders a file input field with dropzone functionality.
|
|
*
|
|
* @param props - The component props.
|
|
* @param props.single - Whether to allow only one file to be uploaded
|
|
* @param props.accept - Array of supported file extensions.
|
|
* @returns {JSX.Element} The rendered file input field.
|
|
*/
|
|
export function FileField({ single, accept, ...props }: FieldHookConfig<File | File[]> & { single?: boolean, accept?: Accept | string }) {
|
|
const [field, meta, helpers] = useField(props);
|
|
|
|
/**
|
|
* Handles the upload of files.
|
|
*
|
|
* @param {Array<File>} files - The files to be uploaded.
|
|
*/
|
|
function onUpload(files) {
|
|
console.log(files)
|
|
field.onChange({ target: { value: single ? files[0] : files, name: field.name } });
|
|
}
|
|
|
|
return <NejDropzone value={field.value} accept={accept} onDrop={onUpload} single={single} />;
|
|
}
|