Help with rendering reddit comment

app.jsx

import React, { Component } from "react";

const Entry = ({ entry: { name, game } }) => (
  <div>
    <h3>{name}</h3>
    <p>{game}</p>
  </div>
);

const CHANNELS = [
  "ESL_SC2",
  "OgamingSC2",
  "cretetion",
  "freecodecamp",
  "storbeck",
  "habathcx",
  "RobotCaleb",
  "noobs2ninjas"
];

export default class App extends Component {
  state = {
    data: null,
    promise: null
  };

  componentDidMount() {
    this.loadData();
  }

  loadData() {
    this.setState({
      promise: Promise.all(
        CHANNELS
          .map(
            channel =>
            // assuming this API returns a JSON array of objects in the response
              fetch(`https://wind-bow.gomix.me/twitch-api/channels/${channel}`)
                .then(response => response.json())
          )
      )
        .then(data => this.setState({ data }))
        .catch(error => console.log(error))
        .finally(() => this.setState({ promise: null }))
    });
  }

  render() {
    const { promise, data } = this.state;

    if (promise !== null) {
      return 'Loading!';
    }

    if (data === null) {
      return 'Failed to load data!';
    }


    return (
      <div>
        {
          data.map(
            channelEntries => (
              <div>{channelEntries.map(entry => <Entry entry={entry}/>)}</div>
            )
          )
        }
      </div>
    );
  }
}

https://www.reddit.com/r/reactjs/comments/5pi3r7/help_with_rendering_components_that_load_async/