Issue to index generic record with generic key value in recipe due to draft wrapper

🐛 Bug Report

Using generic function arguments around produce causes type issues. Its probably best explained with an example (link to CodeSandbox below):

enum Foo {
  One,
  Two,
}

type Bar<F extends Foo> = Readonly<Record<F, number>>;

function modifyBar<F extends Foo>(bar: Bar<F>, foo: F, value: number): Bar<F> {
  return produce(bar, (draft) => {
    draft[foo] = value; // <-- Issue here
  });
}

The type error at the marked line is then: Type 'F' cannot be used to index type 'Draft<Readonly<Record<F, number>>>'.
A current workaround is to make the type Bar actually mutable (i.e. remove the Readonly wrapper) and then manually cast the recipe like (draft: Bar<F>) => { /* ... */ }. Both do not feel good or are not possible for the production circumstances.

Are there any alternatives to solve this properly?

Link to repro

Link to CodeSandbox

To Reproduce

Just inspect the error shown in the code editor.

Observed behavior

Type error that correct key type can't be used to index a Record wrapped as Draft.

Expected behavior

No type error and the produce just works as without a recipe.

Environment

We only accept bug reports against the latest Immer version.

• Immer version: v10.1.1
• I filed this report against the latest version of Immer
• Occurs with setUseProxies(true) (I don't know how to apply this, sorry)
• Occurs with setUseProxies(false) (ES5 only)

Start with the linked CodeSandbox at src/index.ts and reproduce the error on the draft[foo] assignment using Immer v10.1.1. Trace the TypeScript types involved in produce, Draft, and the readonly generic Record. Done means the generic readonly Record example type-checks without a manual cast while preserving the expected produce behavior.