react-conduct

React data provider

Install

npm install react @types/react --save    
npm install react-conduct --save

or

yarn add react @types/react react-conduct

Usage

import React = require("react");
import ReactDOM = require("react-dom");
import {provide} from "react-conduct";

// Component for providing data
class TestComponent extends React.Component<{ 
        data1: string; // providing prop
    }, {}> {
    public render() {
        return ["Data1: ", this.props.data1];
    }
}    
const ProvidedComponent = provide(TestComponent) // component for providing
    ((props: {arg1: string})=> { // providers for every props
        return {
            resolve: async ({setProps}) => {
                setProps({data1: await Promise.resolve(props.arg1 + ", World!")});
            },
            error: (err)=> ["Error": err],
            loading: ()=> "Loading",
        };
    },
);
const el = <ProvidedComponent arg1="Hello" />;

ReactDOM.render(el, document.getElementById("root"));    

Examples

git clone https://github.com/arvitaly/react-conduct

cd react-conduct

npm install

node examples/counter

[Counter example](https://github.com/arvitaly/react-conduct/blob/master/examples/counter.ts)     

API

interface IDataProps<T> {
    status: "success" | "error" | "loading";
    data?: T;
    error?: any;
}
// Provider constructor
interface IProviderStatic<A, D> {
    new(args: A, onSuccess: (data: D) => void, onError: (err: any) => void): IProvider;
}    
// Provider
interface IProvider {
    dispose(): void;
}

Test

npm install
npm test