To fix the error, you should pass null as an initial value to the useRef hook. You don’t need to add | undefined:
React.useRef<HTMLInputElement>(null)
The error message says that the useRef function expects either an HTMLInputElement or null, but if you pass in nothing, it evaluates to undefined and that’s why get the error message:
Type 'undefined' is not assignable to type 'HTMLInputElement | null'