export-mike

import React from 'react';

export default props => {
  const messageBuilt = plural(props);
  return <span>{messageBuilt}</span>;
};

export const plural = ({ message, ...rest }) => {
  const messageBuilt = Object.keys(rest).reduce((messageTemplate, key) => {
    if (!Array.isArray(rest[key])) {

export-mike

import React from 'react';
import Api from '../Api';
import Loading from '../components/Loading';
import Title from '../components/Title';

const withRequest = ({ fetch, prop, defaultState, LoadingComponent }) => Component => class WithRequest extends React.Component {
  state = {
    [prop]: defaultState,
    loading: false,
    error: false

export-mike

import React, { Component } from 'react';
import PropTypes from 'prop-types';

export default (propName, propType, contextProp) => {
  return {
    Provider: createProvider(propName, propType, contextProp),
    Hoc: createHigherOrderComponent(propName, propType, contextProp)
  }
};

export-mike

import React, { Component } from 'react';
import PropTypes from 'prop-types';

export default (propName, propType, contextProp) => {
  return {
    Provider: createProvider(propName, propType, contextProp),
    Hoc: createHigherOrderComponent(propName, propType, contextProp)
  }
};

export-mike

require('dotenv').config();
const { GraphQLClient } = require('graphql-request');
const client = new GraphQLClient(process.env.ENDPOINT, { headers: {
	'Authorization': `Bearer ${process.env.ACCESS_TOKEN}`
}});

const query = T => `
	query Get${T}s {
		all${T}s {
			id

export-mike

import { compose, pure } from 'recompose'
import { Component } from 'react'
import Radium from 'radium' // great styling library! I
// I'd also consider styled-components now its really neat and much more react style

/** for example purposes we've got some other components that are not defined,
  I've added a spinner which would render a CSS animation in place of the table.

  I've got a Button comonent which renders the styled buttons we have in the screenshot, they could have clicks attached.

export-mike

 yarn add webpack@^2 babel-core babel-loader babel-preset-react babel-preset-stage-2 prettier eslint@^3 react@^15 react-dom@^15enzyme nightmare jest eslint-config-prettier prettier-eslint-cli styled-components --dev && git init && git ignore-io node && echo '{"extends":"prettier"}' > .eslintrc && echo '{"presets": ["stage-2", "react"]}' > .babelrc

export-mike

import compose from 'recompose/compose';
import EventEmitter from 'event-emitter';

const combineReducers = reducersMap => {
  const arrayOfReducers = Object.keys(reducersMap)
                          .reduce((acc, r) => [...acc, reducersMap[r]], []);
  return compose.apply(null, arrayOfReducers);
}

const dispatch = reducers => action => reducers(action);

export-mike

/**
 * Utility method to create a reducer from a map,
 * with initial state
 * @param initialState
 * @param reducerMap
 * @returns {Function}
 */
export default function createReducer(initialState, reducerMap) {

  return (state = initialState, action) => {

export-mike

#!/usr/bin/env bash
rm -rf views containers components
mkdir views && cd views
react-docgen ../../src/views/  --resolver findAllComponentDefinitions --ignore test | ../buildDocs && cd ..
mkdir containers && cd containers
react-docgen ../../src/containers/  --resolver findAllComponentDefinitions --ignore test | ../buildDocs && cd ..
mkdir components && cd components
react-docgen ../../src/components/  --resolver findAllComponentDefinitions --ignore test | ../buildDocs && cd ..