feat: update catalogue to work with tags

config/collections/index.js

@@ -13,6 +13,23 @@ const postsByTag = (collection) => {
   return postsByTag;
 };
 
+const catalogueByType = (collection) => {
+  const allItems = collection.getFilteredByTag("catalogue");
+
+  const catalogueByType = {};
+
+  for (const item of allItems) {
+    const type = item.data.tags[1];
+    if (!type) continue;
+
+    catalogueByType[type] ??= [];
+    catalogueByType[type].push(item);
+  }
+
+  return catalogueByType;
+};
+
 module.exports = {
   postsByTag,
+  catalogueByType,
 };

config/filters/index.js

@@ -4,7 +4,6 @@ const advancedFormat = require("dayjs/plugin/advancedFormat");
 
 const postcss = require("postcss");
 const cssnano = require("cssnano");
-const { default: slugify } = require("slugify");
 
 const keys = Object.keys;
 const values = Object.values;

eleventy.config.js

@@ -1,4 +1,7 @@
-const { postsByTag } = require("./config/collections/index.js");
+const {
+  postsByTag,
+  catalogueByType,
+} = require("./config/collections/index.js");
 const { dir } = require("./config/constants.js");
 const {
   entries,
@@ -7,8 +10,6 @@ const {
   values,
   organizeByDate,
   keys,
-  filterByCategory,
-  allTags,
   allTagCounts,
   filter,
 } = require("./config/filters/index.js");
@@ -25,6 +26,7 @@ module.exports = (eleventyConfig) => {
 
   // 	--------------------- Custom Collections -----------------------
   eleventyConfig.addCollection("postsByTag", postsByTag);
+  eleventyConfig.addCollection("catalogueByType", catalogueByType);
 
   // 	--------------------- Custom Filters -----------------------
   eleventyConfig.addFilter("allTagCounts", allTagCounts);

jsconfig.json

@@ -1,7 +1,7 @@
 {
   "compilerOptions": {
     "module": "CommonJS",
-    "target": "ES6"
+    "target": "ES2023"
   },
   "exclude": ["node_modules"]
 }

src/_includes/partials/catalogue.html

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

src/content/catalogue/games/games.json

@@ -1,5 +1,5 @@
 {
   "layout": "catalogue",
-  "tags": "games",
+  "tags": "game",
   "permalink": "games/{{ page.fileSlug }}/index.html"
 }

src/content/pages/catalogue.html

@@ -4,5 +4,6 @@ permalink: /catalogue/index.html
 title: Catalogue
 ---
 
-<h1>Catalogue yo</h1>
-{% for item in collections.catalogue %}{{ item.data.tags | dump }}{% endfor %}
+<h1>Catalogue</h1>
+{% set items = collections.catalogue %}
+{% include "partials/catalogue.html" %}