did a lot... chagned model, made restaurant recommendations page, made route for editing user based on kevins food preferences, refactored duplicate code, uncamelcased components

Author: lucaslevin1

client/components/GoogleMap.js

@@ -0,0 +1,30 @@
+import React, {Component} from 'react'
+import {withGoogleMap, GoogleMap, Marker} from 'react-google-maps'
+const {
+  MarkerWithLabel
+} = require('react-google-maps/lib/components/addons/MarkerWithLabel')
+
+const Map = props => {
+  const {longitude, latitude} = props
+  console.log(props)
+  const GoogleMapExample = withGoogleMap(props => (
+    <GoogleMap defaultCenter={{lat: latitude, lng: longitude}} defaultZoom={13}>
+      <MarkerWithLabel
+        position={{lat: latitude, lng: longitude}}
+        labelAnchor={new google.maps.Point(0, 0)}
+        labelStyle={{}}
+      >
+        <div />
+      </MarkerWithLabel>
+    </GoogleMap>
+  ))
+  return (
+    <div>
+      <GoogleMapExample
+        containerElement={<div style={{height: `200px`, width: '600px'}} />}
+        mapElement={<div style={{height: `100%`}} />}
+      />
+    </div>
+  )
+}
+export default Map

client/components/google-map.js

@@ -9,4 +9,4 @@ export {default as MergedAuth} from './merged-auth'
 export {default as Homepage} from './homepage'
 export {default as Restaurant} from './restaurant-list'
 export {default as Options} from './options'
-export {default as Profile} from './profile'
+export {default as Recommendations} from './recommendations'

client/components/index.js

@@ -9,6 +9,10 @@ class mergedAuth extends Component {
         <Grid columns={2} divided>
           <Grid.Column>
             <h1>Sign Up</h1>
+            <p>
+              Create an account to get personalized recommendations based on
+              your favorite cuisines.
+            </p>
             <Signup />
           </Grid.Column>
           <Grid.Column>

client/components/merged-auth.js

@@ -4,8 +4,6 @@ import {connect} from 'react-redux'
 import {Link} from 'react-router-dom'
 import {logout} from '../store'
 import {Menu, Grid, MenuItem} from 'semantic-ui-react'
-import {reset as resetWeights} from '../store/weighSources'
-import {reset as resetFilters} from '../store/filters'
 
 class Navbar extends Component {
   constructor() {
@@ -46,7 +44,7 @@ class Navbar extends Component {
             // The navbar will show these links after you log in
             <React.Fragment>
               <Menu.Item>
-                <Link to="/profile">Profile</Link>
+                <Link to="/recommendations">Recommendations</Link>
               </Menu.Item>
               <Menu.Item>
                 <Link to="#" onClick={handleClick}>

client/components/navbar.js

@@ -0,0 +1,57 @@
+import React, {Component} from 'react'
+import {connect} from 'react-redux'
+import {Card} from 'semantic-ui-react'
+import {restaurantSort, restaurantScorer} from '../helperFuncs'
+import RestaurantCard from './restaurant-card'
+
+class Profile extends Component {
+  render() {
+    const {user, restaurants} = this.props
+    const userStr = user.email.slice(0, user.email.indexOf('@'))
+    return (
+      <div>
+        <h1>Recommendations for {userStr}</h1>
+        <h3>Based on cuisines you've liked, we recommend:</h3>
+        {user.likedCuisines.map(cuisine => {
+          return (
+            <React.Fragment key={cuisine}>
+              <h4>{cuisine}</h4>
+              <Card.Group>
+                {restaurantSort(
+                  restaurants.filter(restaurant => {
+                    if (restaurant.cuisineType[0].title === cuisine) {
+                      restaurant.score = restaurantScorer(
+                        restaurant.reviews,
+                        5,
+                        5,
+                        5,
+                        5
+                      )
+                      return true
+                    }
+                  })
+                )
+                  .slice(0, 8)
+                  .map(restaurant => {
+                    return (
+                      <RestaurantCard
+                        restaurant={restaurant}
+                        key={restaurant.id}
+                      />
+                    )
+                  })}
+              </Card.Group>
+            </React.Fragment>
+          )
+        })}
+      </div>
+    )
+  }
+}
+
+const mapState = state => ({
+  user: state.user,
+  restaurants: state.restaurantReducer.restaurants
+})
+
+export default connect(mapState)(Profile)

client/components/profile.js

@@ -16,6 +16,7 @@ import {
   Loader,
   Dimmer
 } from 'semantic-ui-react'
+import {restaurantSort, restaurantScorer} from '../helperFuncs'
 
 class RestaurantList extends Component {
   constructor() {
@@ -41,8 +42,9 @@ class RestaurantList extends Component {
       foursquareWeight,
       restaurants
     } = this.props
+
     restaurants.forEach(restaurant => {
-      restaurant.score = this.restaurantScore(
+      restaurant.score = restaurantScorer(
         restaurant.reviews,
         yelpWeight,
         zomatoWeight,
@@ -72,57 +74,6 @@ class RestaurantList extends Component {
     this.setState({loading: false})
   }
 
-  restaurantScore = (
-    reviews,
-    yelpWeight,
-    zomatoWeight,
-    googleWeight,
-    foursquareWeight
-  ) => {
-    let totalWeight = yelpWeight
-    let reviewsString = ''
-    reviews.forEach(review => {
-      reviewsString += review.source
-    })
-    const reviewsLength = reviews.length
-
-    if (reviewsString.indexOf('Zomato') !== -1) totalWeight += zomatoWeight
-    if (reviewsString.indexOf('Google') !== -1) totalWeight += googleWeight
-    if (reviewsString.indexOf('Foursquare') !== -1)
-      totalWeight += foursquareWeight
-
-    function weighter(sourceWeight, review) {
-      const weight = sourceWeight / totalWeight * reviewsLength
-      let denominator
-      if (review.source === 'Foursquare') {
-        denominator = 10
-      } else {
-        denominator = 5
-      }
-      const rating = review.rating / denominator
-      return weight * rating
-    }
-
-    return Math.round(
-      reviews
-        .map(review => {
-          if (review.source === 'Yelp') {
-            return weighter(yelpWeight, review)
-          } else if (review.source === 'Zomato') {
-            return weighter(zomatoWeight, review)
-          } else if (review.source === 'Google') {
-            return weighter(googleWeight, review)
-          } else if (review.source === 'Foursquare') {
-            return weighter(foursquareWeight, review)
-          }
-        })
-        .reduce((accum, currentVal) => accum + currentVal, 0) /
-        reviews.length *
-        100,
-      0
-    )
-  }
-
   async handleChange(event) {
     await this.props.updateSearchBar(event.target.value)
 
@@ -187,7 +138,7 @@ class RestaurantList extends Component {
     } = this.props
 
     this.props.restaurants.forEach(restaurant => {
-      restaurant.score = this.restaurantScore(
+      restaurant.score = restaurantScorer(
         restaurant.reviews,
         yelpWeight,
         zomatoWeight,
@@ -230,23 +181,11 @@ class RestaurantList extends Component {
         />
         <Divider hidden />
         <Card.Group>
-          {restaurants
-            .sort((restaurant1, restaurant2) => {
-              if (restaurant2.reviews.length === restaurant1.reviews.length) {
-                if (restaurant2.score === restaurant1.score) {
-                  return restaurant2.id - restaurant1.id
-                } else {
-                  return restaurant2.score - restaurant1.score
-                }
-              } else {
-                return restaurant2.reviews.length - restaurant1.reviews.length
-              }
-            })
-            .map(restaurant => {
-              return (
-                <RestaurantCard restaurant={restaurant} key={restaurant.id} />
-              )
-            })}
+          {restaurantSort(restaurants).map(restaurant => {
+            return (
+              <RestaurantCard restaurant={restaurant} key={restaurant.id} />
+            )
+          })}
         </Card.Group>
       </React.Fragment>
     )

client/components/recommendations.js

@@ -13,7 +13,7 @@ import {
   ListItem
 } from 'semantic-ui-react'
 import ApplePie from './pie-chart'
-import Map from './GoogleMap'
+import Map from './google-map'
 
 const dollarSignHelper = expenseRating => {
   if (expenseRating === 0) return 'No Expense Rating Yet'

client/components/restaurant-list.js

@@ -0,0 +1,64 @@
+export const restaurantSort = restaurantArr => {
+  return restaurantArr.sort((restaurant1, restaurant2) => {
+    if (restaurant2.reviews.length === restaurant1.reviews.length) {
+      if (restaurant2.score === restaurant1.score) {
+        return restaurant2.id - restaurant1.id
+      } else {
+        return restaurant2.score - restaurant1.score
+      }
+    } else {
+      return restaurant2.reviews.length - restaurant1.reviews.length
+    }
+  })
+}
+
+export const restaurantScorer = (
+  reviews,
+  yelpWeight,
+  zomatoWeight,
+  googleWeight,
+  foursquareWeight
+) => {
+  let totalWeight = yelpWeight
+  let reviewsString = ''
+  reviews.forEach(review => {
+    reviewsString += review.source
+  })
+  const reviewsLength = reviews.length
+
+  if (reviewsString.indexOf('Zomato') !== -1) totalWeight += zomatoWeight
+  if (reviewsString.indexOf('Google') !== -1) totalWeight += googleWeight
+  if (reviewsString.indexOf('Foursquare') !== -1)
+    totalWeight += foursquareWeight
+
+  function weighter(sourceWeight, review) {
+    const weight = sourceWeight / totalWeight * reviewsLength
+    let denominator
+    if (review.source === 'Foursquare') {
+      denominator = 10
+    } else {
+      denominator = 5
+    }
+    const rating = review.rating / denominator
+    return weight * rating
+  }
+
+  return Math.round(
+    reviews
+      .map(review => {
+        if (review.source === 'Yelp') {
+          return weighter(yelpWeight, review)
+        } else if (review.source === 'Zomato') {
+          return weighter(zomatoWeight, review)
+        } else if (review.source === 'Google') {
+          return weighter(googleWeight, review)
+        } else if (review.source === 'Foursquare') {
+          return weighter(foursquareWeight, review)
+        }
+      })
+      .reduce((accum, currentVal) => accum + currentVal, 0) /
+      reviews.length *
+      100,
+    0
+  )
+}

client/components/SingleRestaurant.js client/components/single-restaurant.js

@@ -2,8 +2,8 @@ import React, {Component} from 'react'
 import {connect} from 'react-redux'
 import {withRouter, Route, Switch} from 'react-router-dom'
 import PropTypes from 'prop-types'
-import {MergedAuth, Homepage, Profile} from './components'
-import SingleRestaurant from './components/SingleRestaurant'
+import {MergedAuth, Homepage, Recommendations} from './components'
+import SingleRestaurant from './components/single-restaurant'
 import {me} from './store'
 
 /**
@@ -31,7 +31,7 @@ class Routes extends Component {
           <Switch>
             {/* Routes placed here are only available after logging in */}
             <Route path="/home" component={Homepage} />
-            <Route path="/profile" component={Profile} />
+            <Route path="/recommendations" component={Recommendations} />
           </Switch>
         )}
         {/* Displays our Login component as a fallback */}