From 5b68b1278c517c864d9c5e898bbd34095b5e8bad Mon Sep 17 00:00:00 2001
From: Lewis Dale <lewis.dale@fortacode.co.uk>
Date: Thu, 16 Feb 2023 10:46:48 +0000
Subject: [PATCH] Retrieve posts from wordpress

---
 package-lock.json      | 13 +++++++++++
 package.json           |  3 +++
 src/_data/posts.js     | 50 +++++++++++++++++++++++++++++++++++++-----
 src/_includes/base.njk |  2 +-
 src/_includes/post.njk |  4 ++--
 src/css/globals.css    |  3 ++-
 6 files changed, 66 insertions(+), 9 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 6335b9a..52e4361 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -8,6 +8,9 @@
       "name": "whimsy",
       "version": "1.0.0",
       "license": "ISC",
+      "dependencies": {
+        "html-entities": "^2.3.3"
+      },
       "devDependencies": {
         "@11ty/eleventy": "^2.0.0",
         "@11ty/eleventy-fetch": "^3.0.0",
@@ -1995,6 +1998,11 @@
       "integrity": "sha512-mxIDAb9Lsm6DoOJ7xH+5+X4y1LU/4Hi50L9C5sIswK3JzULS4bwk1FvjdBgvYR4bzT4tuUQiC15FE2f5HbLvYw==",
       "dev": true
     },
+    "node_modules/html-entities": {
+      "version": "2.3.3",
+      "resolved": "https://registry.npmjs.org/html-entities/-/html-entities-2.3.3.tgz",
+      "integrity": "sha512-DV5Ln36z34NNTDgnz0EWGBLZENelNAtkiFA4kyNOG2tDI6Mz1uSWiq1wAKdyjnJwyDiDO7Fa2SO1CTxPXL8VxA=="
+    },
     "node_modules/html-escaper": {
       "version": "3.0.3",
       "resolved": "https://registry.npmjs.org/html-escaper/-/html-escaper-3.0.3.tgz",
@@ -6664,6 +6672,11 @@
       "integrity": "sha512-mxIDAb9Lsm6DoOJ7xH+5+X4y1LU/4Hi50L9C5sIswK3JzULS4bwk1FvjdBgvYR4bzT4tuUQiC15FE2f5HbLvYw==",
       "dev": true
     },
+    "html-entities": {
+      "version": "2.3.3",
+      "resolved": "https://registry.npmjs.org/html-entities/-/html-entities-2.3.3.tgz",
+      "integrity": "sha512-DV5Ln36z34NNTDgnz0EWGBLZENelNAtkiFA4kyNOG2tDI6Mz1uSWiq1wAKdyjnJwyDiDO7Fa2SO1CTxPXL8VxA=="
+    },
     "html-escaper": {
       "version": "3.0.3",
       "resolved": "https://registry.npmjs.org/html-escaper/-/html-escaper-3.0.3.tgz",
diff --git a/package.json b/package.json
index 6c733a8..2a17a1c 100644
--- a/package.json
+++ b/package.json
@@ -36,5 +36,8 @@
     "postcss-nested": "^6.0.0",
     "prettier": "^2.8.3",
     "tailwindcss": "^3.2.4"
+  },
+  "dependencies": {
+    "html-entities": "^2.3.3"
   }
 }
diff --git a/src/_data/posts.js b/src/_data/posts.js
index 3eef4a8..e85fed7 100644
--- a/src/_data/posts.js
+++ b/src/_data/posts.js
@@ -1,14 +1,54 @@
 const wordpressPassword = process.env.WORDPRESS_PASSWORD;
+const auth = Buffer.from(`lewis:${wordpressPassword}`).toString('base64');
+
+const mapComment = comment => ({
+	author: {
+		name: comment.author_name,
+		avatars: comment.author_avatar_urls,
+		url: comment.meta.semantic_linkbacks_author_url,
+	},
+	content: comment.content.rendered,
+	canonical: comment.meta.semantic_linkbacks_canonical,
+	date: comment.data,
+});
+
+const comments = async pid => {
+	const response = await fetch(`https://lewisdale.dev/wp-json/wp/v2/comments?per_page=100&post=${pid}`);
+	return (await response.json()).map(mapComment);
+}
+
+const webmentions = async (pid) => {
+	const response = await fetch(`https://lewisdale.dev/wp-json/wp/v2/comments?per_page=100&post=${pid}&type=Webmention`, {
+		headers: {
+			"Authorization": `Basic ${auth}`
+		}
+	});
+
+	return (await response.json())
+		.reduce((comments, comment) => {
+			if (!comments[comment.meta.semantic_linkbacks_type]) {
+				comments[comment.meta.semantic_linkbacks_type] = [];
+			}
+
+			comments[comment.meta.semantic_linkbacks_type].push(mapComment(comment));
+			return comments;
+		}, { like: [], repost: [] });
+}
+
+const getComments = async pid => {
+	return {
+		comments: await comments(pid),
+		...(await webmentions(pid))
+	}
+}
 
 module.exports = async () => {
 	const response = await fetch("https://lewisdale.dev/wp-json/wp/v2/posts?per_page=100", {
 		headers: {
-			"Authorization": `Basic lewis:${wordpressPassword}`
+			"Authorization": `Basic ${auth}`
 		}
 	});
 	
-	const posts = await response.json();
-
-	console.log(posts.map(post => Buffer.from(post.title.rendered).toString("utf-8")));
-	return posts;
+	const posts = (await response.json());
+	return Promise.all(posts.map(async post => ({...post, comments: await getComments(post.id) })));
 };
\ No newline at end of file
diff --git a/src/_includes/base.njk b/src/_includes/base.njk
index bcd77e5..8d52a83 100644
--- a/src/_includes/base.njk
+++ b/src/_includes/base.njk
@@ -1,7 +1,7 @@
 <!doctype html>
 <html lang={{data.page.lang}}>
 	<head>
-		<title>{{ title }} | {{ metadata.site.name }}</title>
+		<title>{{ title | safe }} | {{ metadata.site.name }}</title>
 		{% if includeFA %}
 		<link rel="stylesheet" type="text/css" href="/assets/css/fontawesome.css" />
 		{% endif %}
diff --git a/src/_includes/post.njk b/src/_includes/post.njk
index e430a8b..380baca 100644
--- a/src/_includes/post.njk
+++ b/src/_includes/post.njk
@@ -2,11 +2,11 @@
 layout: base.njk
 includePrism: true
 eleventyComputed:
-    title: "{{ post.title.rendered }}"
+    title: "{{ post.title.rendered | safe }}"
 ---
 <main class="wrapper-md stack-lg">
     <article class="stack-md">
-        <h1><a href="{{ post.url }}">{{ title }}</a></h1>
+        <h1><a href="{{ post.url }}">{{ title | safe }}</a></h1>
         {{ content | safe }}
     </article>
 
diff --git a/src/css/globals.css b/src/css/globals.css
index 7251043..ab405ba 100644
--- a/src/css/globals.css
+++ b/src/css/globals.css
@@ -12,7 +12,7 @@ h3,
 h4,
 h5 {
   font-weight: bold;
-  line-height: 1;
+  line-height: 1.2;
   margin: 0;
 }
 
@@ -21,6 +21,7 @@ h1 {
   word-wrap: normal;
   text-underline-offset: var(--space-size-3xs);
   text-align: center;
+  line-height: 1.3;
 }
 
 h2 {