How do I correctly use setValue in a generic setting?

[TreeMage]

Hi :)

I am trying to wrap the setValue function exposed by useFormContext to only set a value under certain conditions, but can't seem to get the typing correct.

Sandbox

My use case looks something like this:

type FormFields = {
  field1: number;
  field2: string | undefined
};

const SomeComponent = () => {
  const { setValue } = useFormContext<FormFields>();
  
  const setValueIfDefined = <K extends keyof FormFields>(key: K, value: FormFields[K] | undefined) => {
    if(!value) return;
    setValue(key, value);
  }
  setValueIfDefined('field1', 7);
  return null;
}

I am however unable to call setValue like this, due to:

TS2345: Argument of type NonNullable<FormFields[K]> is not assignable to parameter of type

K extends `${infer K}.${infer R}` ? K extends keyof FormFields ? R extends Path<FormFields[K]> ? PathValue<...> : never : K extends `${number}` ? never : never : K extends keyof FormFields ? FormFields[K] : K extends `${number}` ? never : never

I am using TS 4.9.5 and react-hook-form 7.43.3

Any insight would be greatly appreciated!

[davidlhw]

i'm also facing a similar issue and came across #4694 from 2021 that doesn't seem to help much

the easiest workaround seems to just be to ts-ignore it, but of course that's less than ideal