feat: add catalogue page

config/filters/index.js

@@ -5,6 +5,7 @@ const advancedFormat = require("dayjs/plugin/advancedFormat");
 const postcss = require("postcss");
 const cssnano = require("cssnano");
 
+const keys = Object.keys;
 const values = Object.values;
 const entries = Object.entries;
 
@@ -24,19 +25,12 @@ const organizeByDate = (collection) => {
 
   collection.forEach((item) => {
     const year = formatDate(item.date, "YYYY");
-    const month = formatDate(item.date, "MMMM");
 
     if (!collectionByDate[year]) {
-      return (collectionByDate[year] = {
+      return (collectionByDate[year] = [item]);
-        [month]: [item],
-      });
     }
 
-    if (!collectionByDate[year][month]) {
+    collectionByDate[year].push(item);
-      return (collectionByDate[year][month] = [item]);
-    }
-
-    collectionByDate[year][month].push(item);
   });
 
   return collectionByDate;
@@ -45,6 +39,7 @@ const organizeByDate = (collection) => {
 module.exports = {
   entries,
   formatDate,
+  keys,
   minifyCss,
   organizeByDate,
   values,

eleventy.config.js

@@ -11,6 +11,7 @@ const {
   minifyCss,
   values,
   organizeByDate,
+  keys,
 } = require("./config/filters/index.js");
 const markdown = require("./config/plugins/markdown.js");
 const imageShortcode = require("./config/shortcodes/image.js");
@@ -31,6 +32,7 @@ module.exports = (eleventyConfig) => {
   // 	--------------------- Custom Filters -----------------------
   eleventyConfig.addFilter("entries", entries);
   eleventyConfig.addFilter("formatDate", formatDate);
+  eleventyConfig.addFilter("keys", keys);
   eleventyConfig.addFilter("minifyCss", minifyCss);
   eleventyConfig.addFilter("organizeByDate", organizeByDate);
   eleventyConfig.addFilter("values", values);

src/_includes/partials/archive.html

@@ -0,0 +1,17 @@
+{% set itemsByYear = items | organizeByDate %}
+{% set years = itemsByYear | keys | sort("desc") %}
+<section>
+    {% for year in years %}
+        {% set itemsInYear = itemsByYear[year] %}
+        <div class="[ flex ]">
+            <h2>{{ year }}</h2>
+        </div>
+        {% for item in itemsInYear %}
+            <div class="[ flex items-center justify-between ]">
+                <a href="{{ item.url }}">{{ item.data.title }}</a>
+                <div class="[ archive-divider ] [ mx-0.5 ]"></div>
+                <div>{{ item.date | formatDate("MM/DD") }}</div>
+            </div>
+        {% endfor %}
+    {% endfor %}
+</section>

src/_includes/partials/posts.html

@@ -1,16 +0,0 @@
-<section>
-    {% for year, postsByYear in posts %}
-        <div class="[ flex ]">
-            <h2>{{ year }}</h2>
-        </div>
-        {% for month, postsByMonth in postsByYear %}
-            {% for post in postsByMonth %}
-                <div class="[ flex items-center justify-between ]">
-                    <a href="{{ post.url }}">{{ post.data.title }}</a>
-                    <div class="[ archive-divider ] [ mx-0.5 ]"></div>
-                    <div>{{ post.date | formatDate("MM/DD") }}</div>
-                </div>
-            {% endfor %}
-        {% endfor %}
-    {% endfor %}
-</section>

src/content/catalogue/books/a-test-book.md

@@ -1,6 +1,9 @@
 ---
 title: Here is my test book
+subtitle: An Author
 date: 2023-02-02
+rating: 5
+image: https://cdn.wonderfulfrog.com/jim-butcher-peace-talks.jpeg
 ---
 
 Here we go!!

src/content/catalogue/games/a-test-game.md

@@ -1,5 +1,6 @@
 ---
 title: Here is my test game
+subtitle: The Nintensixty
 date: 2024-02-08
 ---
 

src/content/pages/catalogue.html

@@ -4,4 +4,6 @@ permalink: /catalogue/index.html
 title: Catalogue
 ---
 
-Here be the catalogue page.
+<h1>Catalogue yo</h1>
+{% set items = collections.catalogue %}
+{% include "partials/archive.html" %}

src/content/pages/posts.html

@@ -4,9 +4,9 @@ layout: base
 title: Posts
 ---
 
-{% set posts = collections.posts | organizeByDate %}
 <h1>All posts</h1>
 <p>
     View all <a href="/tags">tags</a>
 </p>
-{% include "partials/posts.html" %}
+{% set items = collections.posts %}
+{% include "partials/archive.html" %}