how to add required validation to file upload input without using register()?

[yelnyafacee]

I need to add the required validation input to a file upload input field,

but if I use react-hook-form register the onFileChangeCapture() code and the ref (inputFileRef) breaks and got overwritten by register

anyone know how to fix this? Thanks

codesandbox link: https://codesandbox.io/p/sandbox/hungry-gianmarco-vdht3c?file=%2Fpages%2Findex.js&selection=%5B%7B%22endColumn%22%3A24%2C%22endLineNumber%22%3A58%2C%22startColumn%22%3A24%2C%22startLineNumber%22%3A58%7D%5D

[leapful]

@yelnyafacee

You need to exclude ref and onChange from register() method from passing to input element then apply manually your custom handler with react-hook-form handler on those props to make it work.

Working demo: https://codesandbox.io/p/sandbox/jovial-http-xdye7y?file=%2Fpages%2Findex.js&selection=%5B%7B%22endColumn%22%3A17%2C%22endLineNumber%22%3A212%2C%22startColumn%22%3A17%2C%22startLineNumber%22%3A212%7D%5D