message: Change react playground to function component
diff: import 'instantsearch.css/themes/algolia-min.css'
  -import React, { Component } from 'react'
  +import React from 'react'
  import {
  InstantSearch,
  InfiniteHits,
  @@ -22,9 +22,7 @@ const searchClient = instantMeiliSearch(
  }
  )
  -class App extends Component {
  - render() {
  - return (
  +const App = () => (
  <div className="ais-InstantSearch">
  <h1>MeiliSearch + React InstantSearch</h1>
  <h2>
  @@ -34,13 +32,10 @@ class App extends Component {
  </span>
  </h2>
  <p>
  - This is not the official Steam dataset but only for demo purpose.
  - Enjoy searching with MeiliSearch!
  + This is not the official Steam dataset but only for demo purpose. Enjoy
  + searching with MeiliSearch!
  </p>
  - <InstantSearch
  - indexName="steam-video-games"
  - searchClient={searchClient}
  - >
  + <InstantSearch indexName="steam-video-games" searchClient={searchClient}>
  <Stats />
  <div className="left-panel">
  <ClearRefinements />
  @@ -61,20 +56,16 @@ class App extends Component {
  </InstantSearch>
  </div>
  )
  - }
  -}
  -function Hit(props) {
  - return (
  - <div key={props.hit.id}>
  +const Hit = ({ hit }) => (
  + <div key={hit.id}>
  <div className="hit-name">
  - <Highlight attribute="name" hit={props.hit} />
  + <Highlight attribute="name" hit={hit} />
  </div>
  - <img src={props.hit.image} align="left" alt={props.hit.name} />
  - <div className="hit-info">price: {props.hit.price}</div>
  - <div className="hit-info">release date: {props.hit.releaseDate}</div>
  + <img src={hit.image} align="left" alt={hit.name} />
  + <div className="hit-info">price: {hit.price}</div>
  + <div className="hit-info">release date: {hit.releaseDate}</div>
  </div>
  )
  -}
  export default App
  