https://github.com/acdlite/relay-sink

Use Relay to fetch and store data outside of a React component
https://github.com/acdlite/relay-sink

Last synced: about 1 month ago
JSON representation

Use Relay to fetch and store data outside of a React component

• Host: GitHub
• URL: https://github.com/acdlite/relay-sink
• Owner: acdlite
• Created: 2015-09-27T05:16:27.000Z (about 9 years ago)
• Default Branch: master
• Last Pushed: 2017-06-19T15:46:13.000Z (over 7 years ago)
• Last Synced: 2024-04-08T00:21:04.986Z (8 months ago)
• Language: JavaScript
• Size: 11.7 KB
• Stars: 125
• Watchers: 4
• Forks: 4
• Open Issues: 1
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

• awesome-graphql - relay-sink - Use Relay to fetch and store data outside of a React component. (Libraries / JavaScript Libraries)
• awesome-relay - `relay-sink` - Use Relay to fetch and store data outside of a React component. (Libraries & Packages)
• awesome-graphql - relay-sink - Use Relay to fetch and store data outside of a React component. (Libraries / JavaScript Libraries)

README

        
relay-sink

----------

[![build status](https://img.shields.io/travis/acdlite/relay-sink/master.svg?style=flat-square)](https://travis-ci.org/acdlite/relay-sink)

[![npm version](https://img.shields.io/npm/v/relay-sink.svg?style=flat-square)](https://www.npmjs.com/package/relay-sink)

## Usage

```js

import { createSink } from 'relay-sink';

const TyrionSink = createSink({

  // Normal Relay Container configuration

  fragments: {

    tyrion: () => Relay.QL`

      fragment on Character {

        name,

        house

      }

    `

  }

});

// A sink is a Relay Container. Compose with parent Relay containers like

// normal. Note that `this.props.tyrion` and `fragments.tyrion` below are not

// the same value — the former points to a value inside Relay's global store,

// while the latter is the actual unwrapped data.

 {

  expect(fragments.tyrion.name).to.equal('Tyrion');

  expect(fragments.tyrion.house).to.equal('Lannister');

  // Do whatever you want with the data — e.g. dispatch it to a Flux store

  store.dispatch({

    type: UPDATE_TYRION,

    payload: fragments.tyrion

  });

}}/>

```