Load listing details from the server

backend/build/server.js

@@ -76,15 +76,61 @@
 
 	var db = void 0;
 
-	router.get('/search/listings', function () {
+	router.get('/search/listings/:id', function () {
 	  var _ref = _asyncToGenerator(regeneratorRuntime.mark(function _callee(req, res, next) {
-	    var bounds, minPrice, maxPrice, minSize, maxSize, rooms, adType, category, sort, page, pins, properties, query, _bounds$split$map, _bounds$split$map2, lat1, lng1, lat2, lng2, box, price, and, allRooms, or, size, allCategories, _or, cnt, all;
+	    var id, listings, listing;
-
 	    return regeneratorRuntime.wrap(function _callee$(_context) {
 	      while (1) {
 	        switch (_context.prev = _context.next) {
 	          case 0:
 	            _context.prev = 0;
+	            id = req.params.id;
+	            listings = db.collection('listings');
+	            _context.next = 5;
+	            return listings.findOne({ _id: new ObjectID(id) });
+
+	          case 5:
+	            listing = _context.sent;
+
+	            if (listing) {
+	              res.json(listing);
+	            } else {
+	              res.status(404);
+	            }
+
+	            res.end();
+	            _context.next = 14;
+	            break;
+
+	          case 10:
+	            _context.prev = 10;
+	            _context.t0 = _context['catch'](0);
+
+	            console.log('error:', _context.t0);
+	            next(_context.t0);
+
+	          case 14:
+	          case 'end':
+	            return _context.stop();
+	        }
+	      }
+	    }, _callee, undefined, [[0, 10]]);
+	  }));
+
+	  return function (_x, _x2, _x3) {
+	    return _ref.apply(this, arguments);
+	  };
+	}());
+
+	router.get('/search/listings', function () {
+	  var _ref2 = _asyncToGenerator(regeneratorRuntime.mark(function _callee2(req, res, next) {
+	    var bounds, minPrice, maxPrice, minSize, maxSize, rooms, adType, category, sort, page, pins, properties, query, _bounds$split$map, _bounds$split$map2, lat1, lng1, lat2, lng2, box, price, and, allRooms, or, size, allCategories, _or, cnt, all, isPins;
+
+	    return regeneratorRuntime.wrap(function _callee2$(_context2) {
+	      while (1) {
+	        switch (_context2.prev = _context2.next) {
+	          case 0:
+	            _context2.prev = 0;
 	            bounds = req.query.bounds || '';
 	            minPrice = req.query.minPrice;
 	            maxPrice = req.query.maxPrice;
@@ -192,11 +238,11 @@
 	            }
 
 	            console.log('QUERY: ', query);
-	            _context.next = 25;
+	            _context2.next = 25;
 	            return properties.find(query).count();
 
 	          case 25:
-	            cnt = _context.sent;
+	            cnt = _context2.sent;
 
 
 	            res.header('X-Total-Count', cnt);
@@ -205,55 +251,83 @@
 	              //"sort": [['field1','asc'], ['field2','desc']]
 	              "sort": [['price', 'asc']]
 	            });
+	            isPins = pins === "true";
 
-	            if (!(pins !== "true")) {
+	            if (isPins) {
-	              _context.next = 34;
+	              _context2.next = 35;
 	              break;
 	            }
 
-	            _context.next = 31;
+	            _context2.next = 32;
 	            return all.skip(20 * page).limit(20).toArray();
 
-	          case 31:
+	          case 32:
-	            all = _context.sent;
+	            all = _context2.sent;
-	            _context.next = 37;
+	            _context2.next = 38;
 	            break;
 
-	          case 34:
+	          case 35:
-	            _context.next = 36;
+	            _context2.next = 37;
 	            return all.toArray();
 
-	          case 36:
-	            all = _context.sent;
-
 	          case 37:
+	            all = _context2.sent;
+
+	          case 38:
 
 	            if (all.length > 0) {
 	              res.header('X-Last-Record-Id', [].concat(_toConsumableArray(all)).pop()._id);
 	            }
 
-	            res.json(all);
+	            if (isPins) {
+	              res.json(all.map(function (val) {
+	                return {
+	                  _id: val._id,
+	                  loc: val.loc
+	                };
+	              }));
+	            } else {
+	              res.json(all.map(function (_ref3) {
+	                var _id = _ref3._id,
+	                    address = _ref3.address,
+	                    images = _ref3.images,
+	                    price = _ref3.price,
+	                    rooms = _ref3.rooms,
+	                    size = _ref3.size,
+	                    time = _ref3.time;
+	                return {
+	                  _id: _id,
+	                  address: address,
+	                  images: [images[0]],
+	                  price: price,
+	                  rooms: rooms,
+	                  size: size,
+	                  time: time
+	                };
+	              }));
+	            }
+
 	            res.end();
-	            _context.next = 46;
+	            _context2.next = 47;
 	            break;
 
-	          case 42:
+	          case 43:
-	            _context.prev = 42;
+	            _context2.prev = 43;
-	            _context.t0 = _context['catch'](0);
+	            _context2.t0 = _context2['catch'](0);
 
-	            console.log('error:', _context.t0);
+	            console.log('error:', _context2.t0);
-	            next(_context.t0);
+	            next(_context2.t0);
 
-	          case 46:
+	          case 47:
 	          case 'end':
-	            return _context.stop();
+	            return _context2.stop();
 	        }
 	      }
-	    }, _callee, undefined, [[0, 42]]);
+	    }, _callee2, undefined, [[0, 43]]);
 	  }));
 
-	  return function (_x, _x2, _x3) {
+	  return function (_x4, _x5, _x6) {
-	    return _ref.apply(this, arguments);
+	    return _ref2.apply(this, arguments);
 	  };
 	}());
 

backend/server.js

@@ -14,6 +14,25 @@ const AGENTURA_KEY = process.env.AGENTURA_KEY || '1somethingverysecret';
 
 let db;
 
+router.get('/search/listings/:id', async (req, res, next) => {
+  try {
+    const id = req.params.id;
+
+    const listings = db.collection('listings');
+    const listing = await listings.findOne({_id: new ObjectID(id)});
+    if (listing) {
+      res.json(listing);
+    } else {
+      res.status(404);
+    }
+
+    res.end();
+  } catch (e) {
+    console.log('error:', e);
+    next(e);
+  }
+});
+
 router.get('/search/listings', async (req, res, next) => {
   try {
     const bounds       = req.query.bounds || '';
@@ -126,7 +145,9 @@ router.get('/search/listings', async (req, res, next) => {
       "sort": [['price','asc']]
     });
 
-    if (pins !== "true") {
+    const isPins = pins === "true";
+
+    if (!isPins) {
       all = await all.skip(20 * page).limit(20).toArray();
     } else {
       all = await all.toArray();
@@ -136,7 +157,32 @@ router.get('/search/listings', async (req, res, next) => {
       res.header('X-Last-Record-Id', [...all].pop()._id);
     }
 
-    res.json(all);
+    if (isPins) {
+      res.json(all.map(val => {
+        return {
+          _id: val._id,
+          loc: val.loc
+        }
+      }));
+    } else {
+      res.json(all.map(({_id,
+                       address,
+                       images,
+                       price,
+                       rooms,
+                       size,
+                       time
+      }) => ({
+        _id,
+        address,
+        images: [images[0]],
+        price,
+        rooms,
+        size,
+        time
+      })));
+    }
+
     res.end();
   } catch (e) {
     console.log('error:', e);

web/components/Listings.js

@@ -1,6 +1,7 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
 import {formatPrice} from '../lib/helpers';
+import {loadListing} from '../lib/api';
 
 export default class Listings extends React.Component {
   constructor(props) {
@@ -32,12 +33,22 @@ export default class Listings extends React.Component {
   }
 
   onListingClick(id) {
-    this.props.dispatch({
+
-      type: 'VIEW_LISTING_DETAILS',
+    loadListing(id).then(l => l.text()).then(l => {
-      action: {
+      console.log('listing loaded', l);
-        id
+      this.props.dispatch({type: 'VIEW_LISTING_DETAILS', action: {
-      }
+        id,
+        listing: JSON.parse(l)
+      }});
     });
+
+
+    //this.props.dispatch({
+    //type: 'VIEW_LISTING_DETAILS',
+    //action: {
+    //id
+    //}
+    //});
   }
 
   onMouseEnter (id) {

web/components/Main.js

@@ -3,7 +3,7 @@ import Filters from './Filters';
 import Listings from './Listings';
 import ListingDetails from './ListingDetails';
 import { pacSelectFirst } from '../helpers/googleMaps';
-import { loadProperties, loadSeen } from '../lib/api'
+import { loadProperties, loadSeen, loadListing} from '../lib/api'
 import { handleMessage } from '../lib/handlers'
 
 class Main extends React.Component {
@@ -195,7 +195,7 @@ class Main extends React.Component {
           const marker = new google.maps.Marker({
             position : myLatLng,
             map      : map,
-            title    : prop.title,
+            //title    : prop.title,
             icon     : this.isSeen(prop._id) ? this.visitedMarkerIcon() : this.defaultMarkerIcon(),
             id       : prop._id
           });
@@ -231,9 +231,15 @@ class Main extends React.Component {
             }
 
             marker.setIcon(this.selectedMarkerIcon());
-            this.dispatch({type: 'VIEW_LISTING_DETAILS', action: {
+
-              id: prop._id
+            loadListing(prop._id).then(l => l.text()).then(l => {
-            }});
+              console.log('listing loaded', l);
+              this.dispatch({type: 'VIEW_LISTING_DETAILS', action: {
+                id: prop._id,
+                listing: JSON.parse(l)
+              }});
+            });
+
           });
 
           newMarkers.push({
@@ -402,7 +408,7 @@ class Main extends React.Component {
 
     if (this.state.listingDetails) {
       console.log('CURRENT LISTINGS', this.state.listings);
-      const listing = this.state.listings.get(this.state.listingId);
+      const listing = this.state.listing; //this.state.listings.get(this.state.listingId);
       console.log(this.state);
       children.push(<ListingDetails
         listing={listing}

web/lib/api.js

@@ -1,5 +1,13 @@
 import fetch from 'isomorphic-fetch';
 
+export const loadListing = (id) => {
+  let url = `http://localhost:3001/api/search/listings/${id}`;
+
+  return fetch(url, {
+    //credentials: 'include'
+  });
+};
+
 export const loadProperties = ({
   bounds,
   minPrice = '',

web/lib/handlers.js

@@ -56,7 +56,8 @@ const viewListingDetails = ({ type, action }, component) => {
     listingDetails: true,
     listingId: action.id,
     descriptionExpanded: false,
-    imageIndex: 0
+    imageIndex: 0,
+    listing: action.listing
   }, () => {
     markSeen(action.id);
     const m = component.findMarker(action.id);