content: import React from 'react'
  import FavoriteSearchesStore from '../../stores/FavoriteSearches'
  import { Link } from 'react-router-dom'
  
  class FavoriteSearches extends React.Component {
    constructor (props) {
      super(props)
      this.state = { favoriteSearches: FavoriteSearchesStore.getData() }
    }
    editFavoriteSearch (action, searchText) {
      const updated = FavoriteSearchesStore[action](searchText)
      this.setState({ favoriteSearches: updated })
    }
    render () {
      const results = [...this.state.favoriteSearches.values()].sort().map(searchResult => {
        return (
          <div className='ui label' key={searchResult}>
            {searchResult}
            <i onClick={this.editFavoriteSearch.bind(this, 'delete', searchResult)} className='delete icon' />
          </div>
        )
      })
      const header = results.length === 0
        ? <Link to='/'>Looks like you don't have any saved! Try searching for a gem first?</Link>
        : 'Favorite Searches'
      return (
        <div className='ui container'>
          <h1 className='ui red center aligned header'>{header}</h1>
          <div className='ui three column centered grid'>
            {results}
          </div>
        </div>
      )
    }
  }
  
  export default FavoriteSearches
  