React-apollo: Typescript @graphql directive

[lifeiscontent]

Can someone point me to an example of how to use graphql as a directive from react-apollo in typescript?

[kandros]

As far as I know decorators in typescript does not support generics, so it should not be possible to use graphql HOC as decorator.

[lstanden]

It works fine, but there's some severe limitations, as I'm finding out today. One such limitation is you can't have any helper methods on your classes. For example, if you uncomment the foo getter here, it will fail to compile.

@graphql<Props, ViewerData>(ViewerQuery)
export default class NavLinks extends React.Component<Props> {
  /*
  get foo() {
    return 'hi';
  }
  */

  render() {
    return <h1>Hello, world</h1>;
  }
}

The GraphQL Test file has the best documentation I've found to date:
https://github.com/apollographql/react-apollo/blob/master/test/typescript-usage.tsx

The documentation on the official site is flat out wrong and doesn't even compile.