# PlurallWait

This component encapsulates the asynchronous rendering logic present in many of our applications.

It receives a promise and render a `loading` animation until the promise is resolved. Then it renders the children ([as a function](https://www.google.com/url?sa=t&rct=j&q=&esrc=s&source=web&cd=2&cad=rja&uact=8&ved=0ahUKEwiB0sbbkvTaAhWGDpAKHUsxAPgQFgg1MAE&url=https%3A%2F%2Fcdb.reacttraining.com%2Fuse-a-render-prop-50de598f11ce&usg=AOvVaw0nfcnSpgrWnjaZ556Xkw_1)).

## How to use

You can use it with a promise:

```
class MyComponent extends React.Component {
  componentDidMount() {
    const requestPromise = fetch('http://qualquercoisa.com')
    this.setState({ requestPromise })
  }

  render() {
    return (
      <Wait payload={this.requestPromise}>
        {data => <div>{data}</div>}
      </Wait>
    )
  }
}
```

Or with a plain object:

```
class MyComponent extends React.Component {
  componentDidMount() {
    fetch('http://qualquercoisa.com').then(data => {
      this.setState({ data })
    })
  }

  render() {
    return (
      <Wait payload={this.state.data}>
        {data => <div>{data}</div>}
      </Wait>
    )
  }
}
```
