json-git-redux

Official json-git bindings for Redux.

Installation

It is avaible through npm:

npm install json-git-redux

Usage

Setup

First, you must registered the reducer with your repositories and the middleware:

import {
    applyMiddleware,
    combineReducers,
    createStore,
} from 'redux'
import createRepository from 'json-git'
import {
    createMiddleware as createJsonGitMiddleware,
    createReducer as createJsonGitReducer,
} from 'json-git-redux';

import reducers from '<project-path>/reducers'

// Instanciate all your repositories here
// You can use any name you like as key
const repositories = {
    myRepository: createRepository(),
};

// Add the reducer to your store on the `jsonGit` key
// Then add the middleware
const store = createStore(
    combineReducers({
        ...reducers,
        jsonGit: createJsonGitReducer(repositories),
    }),
    applyMiddleware(createJsonGitMiddleware()),
);

The middleware is responsible for dispatching succeeded/failed actions about write actions.

Write operations with action creators

json-git-redux provides 4 action creators to perform write operations on your repositories:

• checkout(repositoryName, branch [, create=false]) creates and/or changes the current branch on a repository
• commit(repositoryName, author, message, tree) creates a new commit on the current branch of a repository
• merge(repositoryName, author, branch [, resolver]) merges a branch into the current branch on a repository
• revert(repositoryName, author, commitHash, [, resolver]) reverts the changes introduced by a commit on a repository

To use them, just import them from json-git-redux:

import React, {
    Component,
    PropTypes,
} from 'react';
import { connect } from 'react-redux';
import {
    checkout,
    commit,
    merge,
    revert,
} from 'json-git-redux';

class Foo extends Component {
    constructor(props, context) {
        super(props, context);

        this.onClick = this.onClick.bind(this);
    }

    onClick() {
        const { commit } = this.props;

        commit('myRepository', 'robin', 'first commit', {
            foo: 'bar',
        });
    }

    render() {
        return (
            <button onClick={this.onClick}>Commit</button>
        );
    }
}

Foo.propTypes = {
    checkout: PropTypes.func.isRequired,
    commit: PropTypes.func.isRequired,
    merge: PropTypes.func.isRequired,
    revert: PropTypes.func.isRequired,
};

export default connect(state => (
    head: state.jsonGit.heads.myRepository,
), {
    checkout,
    commit,
    merge,
    revert,
})(Foo);

Note that you must subscribe your component to the head of your repository if you want it to be refreshed at each change (head: state.jsonGit.heads.myRepository).

Read operations with selectors

json-git-redux provides 4 selectors to perform read operations on your repositories:

• apply(repositoryName, patch [, resolver]) applies a patch to the current tree of a repository and returns the result
• getDiff(repositoryName, left, right) generates a JSON Patch between two branches or commits in a repository
• getJSON(repositoryName) exports a snapshot of a repository
• getLog(repositoryName) returns the full history of a repository
• getTree(repositoryName) returns the current tree of a repository
• subscribe(repositoryName, subscriber) subscribe a subscriber to a repository
• unsubscribe(repositoryName, subscriber) unsubscribe a subscriber from a repository

To use them, just import them from json-git-redux:

import React, {
    Component,
    PropTypes,
} from 'react';
import { connect } from 'react-redux';
import {
    apply,
    getDiff,
    getJSON,
    getLog,
    getTree,
} from 'json-git-redux';

class Foo extends Component {
    render() {
        const tree = getTree('myRepository');

        return (
            <pre>{tree}</pre>
        );
    }
}

Foo.propTypes = {};

export default Foo;

Action types

Type	Description
CHECKOUT_FAILED	When a checkout failed
CHECKOUT_SUCCEEDED	When a checkout succeed
CHECKOUT	When a checkout is performed
COMMIT_FAILED	When a commit failed
COMMIT_SUCCEEDED	When a commit succeed
COMMIT	When a commit is performed
MERGE_FAILED	When a merge failed
MERGE_SUCCEEDED	When a merge succeed
MERGE	When a merge is performed
REVERT_FAILED	When a revert failed
REVERT_SUCCEEDED	When a revert succeed
REVERT	When a revert is performed

Development

Install dependencies with yarn. You're then good to go.

To run the tests, just do npm test.

Contribute

All contributions are welcome and must pass the tests. If you add a new feature, please write tests for it.

License

This application is available under the MIT License.