From 11b7c0872280964d4dd2b23b508adbc35353b6b7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Gr=C3=A9goire=20Delattre?= <gregoire.delattre@gmail.com>
Date: Thu, 17 Nov 2016 13:29:54 +0100
Subject: [PATCH] Don't render all the movies at once

---
 src/public/js/app.js                    |  1 +
 src/public/js/components/movies/list.js | 12 +++++++++++-
 2 files changed, 12 insertions(+), 1 deletion(-)

diff --git a/src/public/js/app.js b/src/public/js/app.js
index 9ad60d4..63b88fb 100644
--- a/src/public/js/app.js
+++ b/src/public/js/app.js
@@ -84,6 +84,7 @@ ReactDOM.render((
         <Route path="/users/edit" component={UserIsAuthenticated(UserEdit)} />
         <Route path="/movies/popular" component={UserIsAuthenticated(MovieListPopular)} />
         <Route path="/movies/polochon" component={UserIsAuthenticated(MovieListPolochon)} />
+        <Route path="/movies/polochon/:page" component={UserIsAuthenticated(MovieListPolochon)} />
       </Route>
     </Router>
   </Provider>
diff --git a/src/public/js/components/movies/list.js b/src/public/js/components/movies/list.js
index 08b8735..c27b600 100644
--- a/src/public/js/components/movies/list.js
+++ b/src/public/js/components/movies/list.js
@@ -2,7 +2,17 @@ import React from 'react'
 import axios from 'axios'
 
 function MoviePosters(props) {
-  const movies = props.movies;
+  // TODO handle the limit from the url
+  const perPage = 30;
+
+  let movies;
+  // Let's limit the number for now
+  if (props.movies.length > perPage) {
+    movies = props.movies.slice(0, perPage);
+  } else {
+    movies = props.movies;
+  }
+
   return (
     <div className="col-xs-5 col-md-8">
       <div className="row">