Wrong inference of T when using immer

[olegdunkan]

Playground

import { createStore } from "zustand";
import { immer } from "zustand/middleware/immer";


type Data<T> = {
  data: T[];
}

function f<T>() {
  return createStore(
    immer<Data<T>>((set) => ({
      data: [],
      addValue: (value: T) =>
        set((state) => {
          state.data.push(value) //error, state.data infered as Draft<T> but WritableDraft<T> is expected 
        }),
    })),
  )
}

[dai-shi]

We recommend typing the state from the top: https://tsplay.dev/NldkGN

But, that doesn't help.

If we don't have generics, it works: https://tsplay.dev/wRkxQN

It doesn't infer as WritableDraft<number[]> though.

[olegdunkan]

Now I see, It is limitation of inference in immer, but i can use produce given it types that i needed

type Data<T> = {
  data: T[];
}

function f<T>(t:Data<T>, v:T) {
  return produce<Data<T>, Data<T>>(t, draft => {draft.data.push(v)}); //ok, draft's type is Data<T>
}

in zustand-immer I can only cast to Draft<T>

import { createStore } from "zustand";
import { immer } from "zustand/middleware/immer";


type Data<T> = {
  data: T[];
  addValue:(value:T)=>void;
}

function f<T>() {
  return createStore(
    immer<Data<T>>((set) => ({
      data: [],
      addValue: (value: T) =>
        set((state) => {
          state.data.push(value as Draft<T>) //ok, but it is workaround  
        }),
    })),
  )
}