// Imports go here
const MAX_FILE_SIZE = 500000
const ACCEPTED_IMAGE_TYPES = [
"image/jpeg",
"image/jpg",
"image/png",
"image/webp",
]
const formSchema = z.object({
course_id: z.string().min(1, { message: "Course name is required" }),
year: z.string().min(1, { message: "Year is required" }),
subject_id: z.string().min(1, { message: "Subject is required" }),
lesson: z.string().min(1, { message: "Lesson is required" }),
title: z.string().min(1, { message: "Title is required" }),
file: z
.any()
.refine((files) => files?.length == 1, "Image is required.")
.refine(
(files) => files?.[0]?.size <= MAX_FILE_SIZE,
`Max file size is 5MB.`
)
.refine(
(files) => ACCEPTED_IMAGE_TYPES.includes(files?.[0]?.type),
".jpg, .jpeg, .png and .webp files are accepted."
),
})
export default function UploadForm() {
// component code
const form = useForm({
resolver: zodResolver(formSchema),
})
return(
// Other input fields and form tag
<FormField
control={form.control}
name="file"
render={({ field }) => (
<FormItem>
<FormLabel>File</FormLabel>
<Input {...field} onChange={handleUpload} type="file" />
<FormMessage />
</FormItem>
)}
/>
//rest of the code