TypeScript: not possible to use a component's `store` and `context` props when wrapped with `connect` HOC

[cebamps]

What version of React, ReactDOM/React Native, Redux, and React Redux are you using?

• React: 18.2.0
• ReactDOM: 18.2.0
• Redux: @reduxjs/toolkit 2.2.2
• React Redux: 9.1.0

What is the current behavior?

Components connected to Redux using the connect HOC do not type-check when used with TypeScript if they have one of the following props not connected to Redux:

• an optional prop named context
  • known limitation of this PR (it works when the prop is mandatory), but not filed as an issue: Omit built-in context prop if user component props include context #1958 (comment)
• a prop named store (could not find this reported anywhere)

This is unfortunate for me, because I work on a webapp in the domain of app stores, where store is a prop name we often use (and context as well).

The following compilation error messages are demonstrated in this demo:

Type '"android"' is not assignable to type '"android" & Store<any, UnknownAction, unknown>'.
Type '"here"' is not assignable to type '"here" & Context<ReactReduxContextValue<any, UnknownAction> | null>'.

What is the expected behavior?

I should be able to provide the component the store or context props without a type error.

Perhaps with some way of opting out of the context and store props offered by the connect HOC at the type level, or a more complete handling of these props that does not interfere when connecting a component that expects them (extending the existing ConnectPropsMaybeWithoutContext approach).

(For reference, older versions of the TypeScript types (from DefinitelyTyped) did not expose the react-redux context and store props in connected components, though I understand this is not something you would want to go back to.)

Which browser and OS are affected by this issue?

n/a

Did this work in previous versions of React Redux?

• Yes

[markerikson]

store and context are props that the connect wrapper specifically looks for. Think of them as being similar to the key and ref props from React - you can't use those names, they're reserved.

Afraid we have no plans to make changes to connect's types or behavior going forward. It's there, it works, but it's effectively deprecated - I'd strongly recommend using the hooks API instead, which won't have this concern because it's all your own components.

[cebamps]

Thanks for the quick response, I understand. It is a tad annoying as it makes the upgrade from react-redux 7 a highly breaking change in my specific case, but we will find a way.