Aurelia Store, immerjs and TypeScript

In a demo app, I am integration Aurelia Store. Since immerjs looks like a nice addition to ease state management (mostly to avoid spread operator everywhere), I decided to give it a try.

Following this example, I modified my action into:

function logout(state) {
    return produce(state, (draft: IState) => {
        draft.authentication = null;
    });
}

But I get this error from the TS compiler:

 TS2345: Argument of type '(state: any) => <Base extends (draft: IState) => void>(base?: Base, ...rest: unknown[]) => any' is not assignable to parameter of type 'Reducer<IState, any[]>'.
  Type '<Base extends (draft: IState) => void>(base?: Base, ...rest: unknown[]) => any' is not assignable to type 'false | IState | Promise<false | IState>'.
    Type '<Base extends (draft: IState) => void>(base?: Base, ...rest: unknown[]) => any' is missing the following properties from type 'Promise<false | IState>': then, catch, [Symbol.toStringTag]

I managed to work around this by using immerjs currying:

const logout = produce((draft: IState) => {
        draft.authentication = null;
        performRouterNavigation(draft, 'login');
    });

Any idea where this comes from and how to get rid of it while using functions like in the example? It’s not a big deal since there is a work around (which is readable and a little more compact but you can’t use logout.name to give your action a name), but I still want to know an answer :wink: (and I think, since the example does it this way, others will encounter this issue).

1 Like

In the function signature logout above you havent defined the type of state, I guess thats part of the problem since the produce call cant properly resolve its first argument.

2 Likes

That was it, thanks.

1 Like