Add ability to add suggestions to UI

js/components/RecordLunch.js

@@ -3,18 +3,19 @@ var React = require('react');
 var ReactBootstrap = require('react-bootstrap');
 var FormGroup = ReactBootstrap.FormGroup;
 var ControlLabel = ReactBootstrap.ControlLabel;
+var Grid = ReactBootstrap.Grid;
+var Row = ReactBootstrap.Row;
+var Col = ReactBootstrap.Col;
 
 var Multiselect = require('react-widgets').Multiselect;
 
-var models = require('../models')
-var Attendee = models.Attendee
+var models = require('../models');
+var Attendee = models.Attendee;
+
+var NewSuggestion = require('./NewSuggestion');
 
 module.exports = React.createClass({
 	displayName: "RecordLunch",
-	getInitialState: function() {
-		return {
-		};
-	},
 	getAttendeeList: function() {
 		var attendeeList = [];
 		for (var attendeeId in this.props.attendees) {
@@ -52,9 +53,25 @@ module.exports = React.createClass({
 	},
 	render: function() {
 		var attendeeList = this.getAttendeeList();
+
+		var suggestionIds = Object.keys(this.props.suggestions);
+		suggestionIds.sort();
+		var suggestions = [];
+		for (var i in suggestionIds) {
+			var suggestion = this.props.suggestions[suggestionIds[i]];
+			suggestions.push((
+				<Row key={suggestion.SuggestionId}>
+					<Col xs={4}>{this.props.attendees[suggestion.AttendeeId].Name}</Col>
+					<Col xs={1}></Col>
+					<Col xs={4}>{suggestion.RestaurantName}</Col>
+				</Row>
+			));
+		}
+
 		return (
 			<div><form>
-				<FormGroup>
+				<Grid><Row><Col xs={12}>
+				<FormGroup controlId="attendees">
 				<ControlLabel>Attendees</ControlLabel>
 				<Multiselect
 					value={attendeeList}
@@ -65,6 +82,21 @@ module.exports = React.createClass({
 					onChange={this.onChangeAttendees}
 					onCreate={this.onCreateAttendee} />
 				</FormGroup>
+				</Col></Row>
+				<Row>
+					<Col xs={4}><ControlLabel>Suggested By:</ControlLabel></Col>
+					<Col xs={1}></Col>
+					<Col xs={4}><ControlLabel>Restaurant Name:</ControlLabel></Col>
+				</Row>
+				{suggestions}
+				</Grid>
+				<FormGroup controlId="newsuggestion">
+				<NewSuggestion
+					createSuggestion={this.props.createSuggestion}
+					attendees={this.props.attendees}
+					suggestions={this.props.suggestions}
+					popularSuggestions={this.props.popularSuggestions} />
+				</FormGroup>
 			</form></div>
 		);
 	}