inProgress-team / react-native-meteor

Meteor Reactivity for your React Native application :)
MIT License
693 stars 210 forks source link

Integration with GraphQL #261

Open michaelspeed opened 7 years ago

michaelspeed commented 7 years ago

Any example of how to connect meteor with graphql for react native? Apollo docs has this http://dev.apollodata.com/core/meteor.html but will this work with react-native-meteor?

donedgardo commented 7 years ago

You can create a higher order component with apollo and connect that to the createMeteor. Like you would with redux example and meteor.

bsbechtel commented 7 years ago

@donedgardo Could you provide an example? I'm struggling to understand what you're describing. Thanks

donedgardo commented 7 years ago

@bsbechtel @michaelspeed So first you would have to create a network interface from your react-native to your meteor server. Use react-apollo docs for this. In the uri key you would point to your graphql server which would be hosted in your meteor server ('assuming its hosted in meteor'): http://locahost:3000/graphql or https://www.my-app.com/graphql. ref.

After having your provider setup connected to your server's graphl endpoint: You would do this to get meteor and apollo data in a component:

...
import React, { Component } from 'react';
import Meteor, { createContainer } from 'react-native-meteor';
import { graphql } from 'react-apollo';

class NormalComponent extends Component {
  ...
}

const MeteorContainer = createContainer(params=>{
  // here params.data would be apollo data from query
  return {
    currentUser: Meteor.user()
  }
}, NormalComponent);

export default graphql(gql`
  query TodoAppQuery {
    todos {
      id
      text
    }
  }
`)(MeteorContainer);

Noticed my NormalComponent is wrapped first by a Meteor Container, then wrapped again in the graphql. That's what I meant with Higher order components.

bsbechtel commented 7 years ago

@donedgardo and @michaelspeed I actually found a gist showing how to pass the user through the apollo context the other day (the suggested way of handling user auth with graphql/apollo): https://gist.github.com/elie222/2ea0e1548dc0c634342fed942f6ea207

Hopefully both answers help others struggling with this!

pisacode commented 5 years ago

Does it work properly? Anyone tried it out?