Nicer Package Manager

    @centarius/state-hoc

    0.1.6 • Public • Published

    @centarius/state-hoc npm

    state-hoc plugin for centarius.

    Introduction

    Centarius State HOC is created to reduce boilerplate in your render function.

    Centarius State HOC is using CentariusConsumer from packages centarius to get current state from centarius component.

    You can pass options like LoadingComponent and ErrorComponent to maximize user experience while fetching data takes lot times.

    Install

    $ npm install --save-dev @centarius/state-hoc

    OR

    $ yarn add @centarius/state-hoc

    API

    The API is as same as Connect HOC by React-Redux

    TL;DR All static methods will be hoisted

    centariusStateHoc: ({ LoadingComponent = null, ErrorComponent = null }) => (Component: React.Component<any, any>) => WrappedComponent: React.Component<any, any>

    Usage

    // Home.js
    import React from 'react';
    import { NavLink } from 'react-router-dom';
    import centariusStateHoc from '@centarius/state-hoc'
    
    class Home extends React.Component {
      static async getInitialProps({ req, res, match }) {
        const stuff = await CallMyApi();
        return { stuff };
      }
    
      render() {
        return (
          <div>
            <NavLink to="/about">About</NavLink>
            <h1>Home</h1>
            <div>{this.props.data.stuff}</div>
          </div>
        );
      }
    }
    
    export default centariusStateHoc({
      LoadingComponent: () => <div>Loading...</div>,
      ErrorComponent: () => <div>Error!</div>
    })(Home);

    Support

    Any issues or questions can be sent to the centarius monorepo.

    Please be sure to specify that you are using @centarius/state-hoc.

    License

    MIT © Ray Andrew

    Install

    npm i @centarius/state-hoc

    DownloadsWeekly Downloads

    1

    Version

    0.1.6

    License

    MIT

    Unpacked Size

    8.11 kB

    Total Files

    5

    Last publish

    Collaborators

    • rayandrew