Reducible Node

This small library is inspired by redux and is as small.

This is mostly here to inrtroduce a new concept called reducible. Redux encourages you to have separate files for you reducers and your components (react, etc...). Yet Graph-QL encourages you to have your component and the data it needs in the same file.

This new concept tries to have the best of both worlds. With a trade-off of cource. You'll lose hydration/dehydration.

A reducible is an object/class/module that has data and a reduce method:

export type Reducible<T extends Reducible<any>> = T & {
  reduce(action: Action<any>): Reducible<T>;
};

As an example take the following class:

class MyState extends Reducible<MyState> {
    public readonly value: string;

    public constructor(value: string) {
        this.value = value;
    }

    public reduce(action: Action<any>): this {
        if (action.type === 'MY_ACTION') {
            return new MyState(action.payload);
        }

        return this;
    }
}

You can then use and build a node for your component:

import * as React from 'react';
import { buildNode } from 'reducible-node';

const node = buildNode(() => ({
  myState: new MyState(),
}));

type Props = { node: typeof node['state'] };

class MyComponent extends React.Component<Props> {
  public render() {
    const { node: { myState } } = this.props;

    return <div>{myState.value}</div>;
  }
}

// Later on how to patch node with MyComponent

Installation

You can install this package with the following command:

npm install reducible-node

Typings

The typescript type definitions are also available and are installed with npm.

License

This project is licensed under the MIT license.