reducer custom dispatch type is not assignable types of property dispatch are incompatible

Problem

The problem is the return type on your createTestStore function. You creating a store a a specific type (Store<CombinedState<{ global: GlobalStateShape; }>, SetSelectedAccount >) and then you are returning it as just Store with no generics. The default type for Store is the Store<any, AnyAction> which you see in your error message.

You might think that this wouldn’t be a problem because your store is more specific, so it should be assignable to Store, right? But specificity gets backwards when you are dealing with function arguments like those of Dispatch. The return type says that you are returning a store which is capable of dispatching AnyAction, but in reality you are only capable of dispatching the type SetSelectedAccount, so your store is not assignable to the broader type.

Solutions

The easiest thing to do is just remove that return type : State entirely. You’ve already typed the store variable which you are returning, so you don’t really need it.

You could also move the type annotation from the variable store to the function return. FYI the redux CombinedState utility type doesn’t really do anything, CombinedState<{ global: GlobalStateShape; }> is the same as { global: GlobalStateShape; }

export function createTestStore(isInternal: boolean): Store<{ global: GlobalStateShape; }, SetSelectedAccount> {
    return createStore(rootReducer, {
        global: getGlobalInitialState(isInternal)
    });
}

CLICK HERE to find out more related problems solutions.

Leave a Comment

Your email address will not be published.

Scroll to Top