Cleaned up code for mapping state to jsx in SearchPage
This commit is contained in:
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user