React-apollo: Add flow typings

[jbaxleyiii]

[rricard]

Still not done ? I could do that if still interested...

[helfer]

@rricard yes, please do!

[rricard]

Will do that for apollo-client as well...

[Grmiade]

Any update on this?

[helfer]

@Grmiade what kind of flow typings are you looking for? For queries, we usually generate flow types with apollo-codegen. If you're looking for flow typings for the react-apollo API, we'd be happy to get a PR from someone to add them (if that's possible).

[jbaxleyiii]

Starting on this project this week 👍

[TSMMark]

Hey guys what is this issue regarding exactly? I'm using apollo-codegen and it works great.

However, I have another issue which may or may not be related to this issue.

If I type the props of an inner / unconnected component, it does not make it up to the connected component, after all the higher-order components are applied. For example:

class MyInnerComponent extends Component {
  props: {
    myProp: string
  }

  // ... etc

}

const MyConnectedComponent = compose(
  connect(mapStateToProps, null, null, { withRef: true }),
  graphql(query, queryOptions), 
  graphql(mutation, mutationOptions) // mutationOptions includes withRef: true
)(MyInnerComponent)

// Flow notices the invalid number type
<MyInnerComponent myProp={5} />

// Flow does not notice the invalid number type here. Sad!
<MyConnectedComponent myProp={5} />

Not sure if it matters but both queryOptions and mutationOptions contain withRef: true.

Am I doing something wrong?

[TSMMark]

I think I got something working. I'm manually typing the connected component, like so:

const MyConnectedComponent: Class<React$Component<DefaultProps, Props, State>> = compose(

The only issue with that is that type Props includes Apollo props such as data. To make it work I broke Props type into pieces using flow intersection types &.

const MyConnectedComponent: Class<React$Component<DefaultProps, OwnProps, State>> = compose(

[stale[bot]]

This issue has been automatically marked as stale becuase it has not had recent activity. It will be closed if not further activity occurs. Thank you for your contributions to React Apollo!

[stale[bot]]

This issue has been automatically labled because it has not had recent activity. If you have not received a response from anyone, please mention the repository maintainer (most likely @jbaxleyiii). It will be closed if no further activity occurs. Thank you for your contributions to React Apollo!

[stale[bot]]

This issue has been automatically labled because it has not had recent activity. If you have not received a response from anyone, please mention the repository maintainer (most likely @jbaxleyiii). It will be closed if no further activity occurs. Thank you for your contributions to React Apollo!