Skip to content
master
Go to file
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
 
 
 
 
 
 
ios
 
 
 
 
src
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

README.md

React Native + ExNavigation + Relay

This is a sample repository that shows how to integrate React Native with ExNavigation and Relay

It is connecting to this boilerplate code graphql-dataloader-boilerplate

alt tag

Description

  • data folder contains schema(.json/.graphql) of your backend graphql server, it will be used by Relay to compile your Relay.QL queries to code.
  • plugins folder has babelRelayPlugin configuration, that tells to Relay with schema.json it should use to compile Relay.QL queries

.babelrc for Relay

{
    "presets": [
        "react-native",
        "react-native-stage-0/decorator-support"
    ],
    "plugins": [
        "./plugins/babelRelayPlugin"
    ],
}

Obs.: react-native-stage-0/decorator-support is to enable @withNavigation needed by ex-navigation

RelayStore.js

It is a custom Relay.Store that enables you to change your Network Layer. For instance, when you want to set the user token.

  • Usage:
RelayStore.reset(
  new Relay.DefaultNetworkLayer('http://localhost:5000/graphql')
);

RelayUtils.js

Based on https://gist.github.com/janicduplessis/f513032eb37cdde5d050d9ce8cf0b92a by @janicduplessis Provides a very handy function to create a Relay.Renderer container to fetch data from Relay

  • Usage:
import { createRenderer } from './RelayUtils'
export default createRenderer(RelayApp, {
  queries: ViewerQuery,
  fragments: {
    viewer: () => Relay.QL`
      fragment on Viewer {
        users(first: 10) {
          edges {
            node {
              name
            }
          }
        }
      }
    `,
  },
});

Ex-Navigation + Relay

  1. You should use createRenderer helper in any component that will be pushed into a StackNavigation
You can’t perform that action at this time.