Merge pull request #54 from EbookFoundation/feature/homepage-feed

add recently published feed to homepage

api/controllers/CatalogController.js

@@ -52,7 +52,7 @@ module.exports = {
           ]
         }
       }
-      let books = await Book.find(body ? searchBody : {}).skip((page * perPage) - perPage).limit(perPage)
+      let books = await Book.find(body ? searchBody : {}).sort('created_at DESC').skip((page * perPage) - perPage).limit(perPage)
 
       if (!books.length) {
         throw new HttpError(404, 'No books matching those parameters were found.')

api/controllers/HomeController.js

@@ -2,8 +2,10 @@ module.exports = {
   show: async function (req, res) {
     const docsHelper = await sails.helpers.docs()
     const content = await docsHelper.read('README', '../../')
+    const feedItems = await Book.find({}).sort('created_at DESC').limit(20)
     res.view('pages/index', {
-      content
+      content,
+      feedItems
     })
   },
   docs: async function (req, res) {

assets/styles/index.scss

@@ -204,4 +204,61 @@
       margin: 0;
     }
   }
+  ul.feed {
+    list-style: none;
+    margin: 0;
+    padding: 0;
+
+    li {
+      min-height: 60px;
+      border-bottom: 1px solid $black-5;
+      padding: 20px 0;
+
+      h3 {
+        margin: 0;
+
+        a {
+          text-decoration: none;
+        }
+      }
+
+      h4 {
+        margin: 0;
+        font-size: 1rem;
+        color: $black-2;
+      }
+
+      .timestamp {
+        color: $black-3;
+        font-size: 1rem;
+
+        @include break('small') {
+          display: none;
+        }
+      }
+
+      .tags {
+        font-size: 0;
+        margin-top: 6px;
+
+        span {
+          font-size: 0.9rem;
+          border: 1px solid $black-5;
+          border-radius: 3px;
+          padding: 0 8px;
+          line-height: 20px;
+          color: $black-2;
+          cursor: default;
+
+          & + span {
+            margin-left: 4px;
+          }
+        }
+      }
+
+      &:last-of-type {
+        border: none;
+      }
+    }
+  }
 }

package.json

@@ -16,8 +16,8 @@
     "build:dev": "webpack --mode development",
     "build:prod": "webpack --mode production",
     "clean": "rimraf .tmp && mkdirp .tmp/public",
-    "forever": "sudo ./node_modules/.bin/pm2 start ecosystem.config.js --env production",
+    "forever": "./node_modules/.bin/pm2 start ecosystem.config.js --env production",
-    "stop": "sudo ./node_modules/.bin/pm2 delete roe-base",
+    "stop": "./node_modules/.bin/pm2 delete roe-base",
     "test": "npm run lint && npm run custom-tests && echo 'Done.'",
     "lint": "standard && echo '✔  Your .js files look good.'",
     "debug": "node --inspect app.js",

views/pages/index.ejs

@@ -12,6 +12,28 @@
     <main class="flex">
       <section class="paper">
         <%- content %>
+
+        <h2>Recently published ebooks</h2>
+        <% if (feedItems.length) { %>
+          <ul class="feed">
+            <% for(const item of feedItems) { %>
+              <li>
+                <div class="title flex-container">
+                  <div class="stack flex">
+                    <h3><a href="<%= item.opds.links.length ? item.opds.links[0].href : '#' %>"><%= item.title %></a></h3>
+                    <h4><%= item.author %> - <%= item.publisher %></h4>
+                  </div>
+                  <span class="timestamp"><%= new Date(item.created_at).toLocaleDateString('en-US', { month: 'short', day: 'numeric', hour: 'numeric', minute: 'numeric' }) %></span>
+                </div>
+                <div class="tags">
+                  <% for (const tag of JSON.parse(item.tags)) { %>
+                    <span><%= tag %></span>
+                  <% } %>
+                </div>
+              </li>
+            <% } %>
+          </ul>
+        <% } %>
       </section>
     </main>
     <%- partial('../shared/footer.html') %>