diff options
Diffstat (limited to 'src/SearchResults.js')
-rw-r--r-- | src/SearchResults.js | 77 |
1 files changed, 77 insertions, 0 deletions
diff --git a/src/SearchResults.js b/src/SearchResults.js new file mode 100644 index 0000000..030c448 --- /dev/null +++ b/src/SearchResults.js @@ -0,0 +1,77 @@ +import React, { Component } from 'react'; +import './SearchResults.css'; + +class SearchResult extends Component { + + badge(f) { + if (this.props.data.udf[f]) { + return ( + <span className="badge"> + {this.props.data.udf[f].label}{' '} + </span> + ); + } else { + return null; + } + } + + image() { + const src = this.props.data['image-url']; + if (src) { + return (<img src={src} alt="" />); + } else { + return null; + } + } + + render() { + + return ( + <div className="Result"> + <h3>{this.props.data.name}</h3> + + <div className="image"> + {this.image()} + </div> + + <div className="details"> + {this.badge('udf_3')} + {this.badge('udf_2')} + {this.badge('udf_1')} + {this.props.data.childcare ? (<span className="badge">Childcare</span>) : null} + + <p>{this.props.data.description}</p> + + <p> + <span className="label">Day</span>: {this.props.data.meetingDay.label}{" "} + <span className="label">Time</span>: {this.props.data.meetingTime.label}{" "} + <span className="label">Location</span>: {this.props.data.area.label} + </p> + </div> + </div> + ); + } + +} + +class SearchResults extends Component { + + render() { + let results = this.props.results.map((result) => { + return ( + <SearchResult key={result.id} data={result}></SearchResult> + ); + }); + + return ( + <div className="SearchResults"> + <p className="result-count">Found {results.length} groups</p> + {results} + </div> + ); + } + +} + +export default SearchResults; + |