Skip to content

chore(mapDispatchToProps): port to typescript #1760

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 5 commits into from
Jul 8, 2021
Merged

chore(mapDispatchToProps): port to typescript #1760

Show file tree
Hide file tree
Changes from 3 commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
d9200e1
chore(mapDispatchToProps): port to typescript
tony-go Jul 7, 2021
b1e300f
chore: resolve conflicts
tony-go Jul 7, 2021
86f3f91
Merge branch 'typescript-port' into ts-port-mdtp
tony-go Jul 7, 2021
5331a1e
fix: types
tony-go Jul 8, 2021
eb87735
fix: add FixTypeLater
tony-go Jul 8, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
15 changes: 11 additions & 4 deletions src/connect/mapDispatchToProps.js → src/connect/mapDispatchToProps.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,21 +1,28 @@
import { ActionCreator, ActionCreatorsMapObject, Dispatch } from 'redux'
import bindActionCreators from '../utils/bindActionCreators'
import { wrapMapToPropsConstant, wrapMapToPropsFunc } from './wrapMapToProps'

export function whenMapDispatchToPropsIsFunction(mapDispatchToProps) {
export function whenMapDispatchToPropsIsFunction(
mapDispatchToProps: ActionCreatorsMapObject | ActionCreator<any>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

✋ It won't ever be a single action creator. It's either an object with action creators inside, a function that accepts dispatch and returns the bound action creators object, or nothing.

You might be able to use the types I pasted into selectorFactory.ts in this file.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I put a FixTypeLater, I'll try to crack it today.

) {
return typeof mapDispatchToProps === 'function'
? wrapMapToPropsFunc(mapDispatchToProps, 'mapDispatchToProps')
: undefined
}

export function whenMapDispatchToPropsIsMissing(mapDispatchToProps) {
export function whenMapDispatchToPropsIsMissing(
mapDispatchToProps: ActionCreatorsMapObject | ActionCreator<any>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

✋ Here, it's probably just undefined.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Shoul I let the !mapDispatchToProps check ?

) {
return !mapDispatchToProps
? wrapMapToPropsConstant((dispatch) => ({ dispatch }))
: undefined
}

export function whenMapDispatchToPropsIsObject(mapDispatchToProps) {
export function whenMapDispatchToPropsIsObject(
mapDispatchToProps: ActionCreatorsMapObject | ActionCreator<any>
) {
return mapDispatchToProps && typeof mapDispatchToProps === 'object'
? wrapMapToPropsConstant((dispatch) =>
? wrapMapToPropsConstant((dispatch: Dispatch) =>
bindActionCreators(mapDispatchToProps, dispatch)
)
: undefined
Expand Down
10 changes: 8 additions & 2 deletions src/connect/wrapMapToProps.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { Dispatch } from 'redux'
import { ActionCreatorsMapObject, Dispatch, ActionCreator } from 'redux'

import { FixTypeLater } from '../types'
import verifyPlainObject from '../utils/verifyPlainObject'
Expand All @@ -20,7 +20,13 @@ export function wrapMapToPropsConstant(
// could be a dispatch function in some cases (ex: whenMapDispatchToPropsIsMissing)
// and a state object in some others (ex: whenMapStateToPropsIsMissing)
// eslint-disable-next-line no-unused-vars
getConstant: (dispatch: Dispatch) => { dispatch?: Dispatch }
getConstant: (dispatch: Dispatch) =>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

✋ This should probably be reworked to be more generic and flexible - maybe like:

getConstant: <T>(value: T) => ( () => T)

In other words, whatever you pass in, it returns a function that returns that thing.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It doesn't match with the usage of wrapMapToPropsConstant made by whenMapDispatchToPropsIsMissing:

 wrapMapToPropsConstant((dispatch: Dispatch) => ({
      dispatch,
 }))

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good point, it's not just a passthrough

| {
dispatch?: Dispatch
dependsOnOwnProps?: boolean
}
| ActionCreatorsMapObject
| ActionCreator<any>
) {
return function initConstantSelector(dispatch: Dispatch) {
const constant = getConstant(dispatch)
Expand Down
5 changes: 3 additions & 2 deletions src/utils/bindActionCreators.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,9 @@ import { ActionCreatorsMapObject, Dispatch } from 'redux'
export default function bindActionCreators(
actionCreators: ActionCreatorsMapObject,
dispatch: Dispatch
) {
const boundActionCreators: ActionCreatorsMapObject<any> = {}
): ActionCreatorsMapObject {
const boundActionCreators: ActionCreatorsMapObject = {}

for (const key in actionCreators) {
const actionCreator = actionCreators[key]
if (typeof actionCreator === 'function') {
Expand Down