Home page trip name (#40)

* add traveler name to homepage trips, add proptype checks * remove console logs
kimberlypn · Apr 22, 2018 · 19a8538 · 19a8538
1 parent 794d517
commit 19a8538
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 2 deletions.
diff --git a/travelpal/assets/js/components/Home.jsx b/travelpal/assets/js/components/Home.jsx
@@ -25,7 +25,7 @@ function Home(props) {
   let suggestedFlights = _.map(filterFlights(props.flights), (uu, key) =>
     <FlightCard key={key} origin={uu.origin} dest={uu.dest} dateFrom={uu.date_from}
       dateTo={uu.date_to} price={uu.price} airlines={uu.airlines} duration={uu.duration} />);
-  let bookedTrips = _.map(props.bookedTrips, (bb, key) => <HomePageTripCard key={key}
+  let bookedTrips = _.map(props.bookedTrips, (bb, key) => <HomePageTripCard key={key} traveler={bb.user.name}
       destination={bb.destination} startDate={bb.start_date} endDate={bb.end_date} summary={bb.summary} hotel={bb.hotel}/>).slice(1).slice(-10);
 
   return (

diff --git a/travelpal/assets/js/components/HomePageTripCard.jsx b/travelpal/assets/js/components/HomePageTripCard.jsx
@@ -4,7 +4,7 @@ import PropTypes from 'prop-types';
 import api from '../api';
 
 // Renders the details of a hotel
-export default function HomePageTripCard({destination, startDate, endDate, summary, hotel}) {
+export default function HomePageTripCard({traveler, destination, startDate, endDate, summary, hotel}) {
   const hotelName = hotel ? hotel.name : ""
   const hotelImage = hotel ? hotel.image_src : ""
 
@@ -17,6 +17,7 @@ export default function HomePageTripCard({destination, startDate, endDate, summa
       <h5 className="card-header">{toDateReadable(startDate)}  -  {toDateReadable(endDate)}</h5>
       <div className="card-body row">
         <div className="col-9">
+          <p className="card-tetx">Traveler: {traveler}</p>
           <p className="card-tetx">Destination: {destination}</p>
           <p className="card-text">Summary: {summary}</p>
           <p className="card-text">Staying at: {hotelName}</p>
@@ -30,4 +31,9 @@ export default function HomePageTripCard({destination, startDate, endDate, summa
 };
 
 HomePageTripCard.propTypes = {
+  traveler: PropTypes.string.isRequired,
+  destination: PropTypes.string.isRequired,
+  startDate: PropTypes.string.isRequired,
+  endDate: PropTypes.string.isRequired,
+  summary: PropTypes.string.isRequired,
 };