Greed-React

Greed Container for React

This modules purpose is to provide a more intimate abstraction for creating queries and mutations in react applications. This module itself uses the greed module under the covers. Hopefully this abstraction lends itself well to you when knee deep in application level code.

Install

npm install --save greed-react

Usage

import React from 'react';
import pot from './greedInstance.js';
import { container } from 'greed-react';

function someComponent (props) {
  return (
    <div>
      <p>{props.count}</p>
      <button>Increment</button>
      <button>Decrement</button>
    </div>
  );
}

//default
export default container(
  someComponent,
  containerDefaults(props),
  containerQueries(props),
  containerMutations(props)
);

function containerDefaults (props) {
  return {
    vars: {
      id: 0
    },
    count: gql`
      count: (id: $id){
        count
      }
    `
  };
}

function containerQueries (props) {
  return {
    vars: {
      id: 0
    },
    loadMoreCounts: gql`
      count: (id: $id){
        count
      }
    `
  };
}

function containerMutations (props) {
  return {
    vars: {
      id: 0
    },
    incrementCount (handler) {
      gql`
        count: (id: $id){
          count
        }
      `;
      return handler(result);
    },
    decrementCount (handler) {
      gql`
        count: (id: $id){
          count
        }
      `;
      return handler(result);
    }
  };
}