Cleaned up code for mapping state to jsx in SearchPage

This commit is contained in:
Ken Jannette
2018-04-20 16:58:26 -04:00
parent 58f54cd119
commit 71f5d958e8

View File

@@ -37,30 +37,28 @@ class SearchPage extends Component {
</div>
<div className="search-books-results">
<ol className="books-grid">
this.state.results.map((result) => (
<li key={result.id}>
<div className="book">
<div className="book-top">
<div className="book-cover" style={{ width: 128, height: 193, backgroundImage: `url("${ result.imageLinks.thumbnail }")` }}></div>
<div className="book-shelf-changer">
<select name={result.id} onChange={onSelect}>
<option value="none">Move to...</option>
<option value="currentlyReading">Currently Reading</option>
<option value="wantToRead">Want to Read</option>
<option value="read">Read</option>
<option value="none">None</option>
</select>
</div>
</div>
<div className="book-title">{result.title}</div>
<div className="book-authors">{result.authors}</div>
</div>
</li>
)
{
this.state.results.map((result) => {
return <li key={result.id}>
<div className="book">
<div className="book-top">
<div className="book-cover" style={{ width: 128, height: 193, backgroundImage: `url("${ result.imageLinks.thumbnail }")` }}></div>
<div className="book-shelf-changer">
<select name={result.id} onChange={onSelect}>
<option value="none">Move to...</option>
<option value="currentlyReading">Currently Reading</option>
<option value="wantToRead">Want to Read</option>
<option value="read">Read</option>
<option value="none">None</option>
</select>
</div>
</div>
<div className="book-title">{result.title}</div>
<div className="book-authors">{result.authors}</div>
</div>
</li>
}
}
</ol>
</div>
</div>