A component wrapper for Muut's IO-Client for React applications.

Install

npm install muut-io-react or yarn add muut-io-react

Usage

import React, { Component } from 'react'
import muutIO from 'muut-io-react'
import YourCommunity from './YourCommunity'

class App extends Component {
  render() {
    const { data, api, isLoaded } = this.props
    if (isLoaded) {
      return <YourCommunity data={data} api={api} />
    } else {
      return <span>Loading...</span>
    }
  }
}

export default muutIO({ path: '/playground', expand_all: true })(App)

muutIO is a higher order component that adds data, api, and isLoaded props to your component.

isLoaded prop is false by default, and only becomes true once the provided community, in this case playground, is loaded.

data is the initial data of your community

api is to be used for listening events and for making api calls.

For more information on data and api props, please check the IO-Client repository.

Demo

A working demo is provided in the demo folder of this repository. The demo uses redux and immutability-helper to manage the app's state.

You can run the demo by cloning this repository and running:

npm install && npm start or yarn install && yarn start

Open localhost:8080 in your browser