chore: readwise post

src/links.html

@@ -13,9 +13,9 @@ pagination:
   <time class="dt-published" datetime="{{ link.date }}">
     {{ link.date | date: "%m.%Y" }}
   </time>
-  <blockquote class="p-summary">{{ link.summary | markdown }}</blockquote>
+  <blockquote class="p-summary">{{ link.summary }}</blockquote>
   {%- if link.note %}
-    <p class="p-summary">{{ link.note | markdown }}</p>
+    <p class="p-summary">{{ link.note }}</p>
   {% endif -%}
 </article>
 {% endfor %}

src/posts/2024/link-blogging-using-readwise.md

@@ -0,0 +1,72 @@
+---
+date: '2024-01-10'
+title: 'Link blogging using Readwise Reader'
+description: 'How I use Readwise Reader to post and share links.'
+draft: false
+tags:
+  - 'development'
+  - 'tech'
+  - 'Eleventy'
+---
+I use Readwise Reader's API to populate the links on [my now page](/now). These then get included in [my follow feed](https://feedpress.me/coryd-follow) that's syndicated out to Mastodon using a [GitHub action](https://github.com/nhoizey/github-action-feed-to-mastodon) authored by [Nicolas Hoizey](https://nicolas-hoizey.com).<!-- excerpt -->
+
+The `data` file used to fetch these links looks like this:
+
+```javascript
+import EleventyFetch from '@11ty/eleventy-fetch'
+
+export default async function () {
+  const API_TOKEN_READWISE = process.env.API_TOKEN_READWISE
+  const url = 'https://readwise.io/api/v3/list?location=archive'
+  const res = EleventyFetch(url, {
+    duration: '1h',
+    type: 'json',
+    fetchOptions: {
+      headers: {
+        Authorization: `Token ${API_TOKEN_READWISE}`,
+      },
+    },
+  }).catch()
+  const data = await res
+  const links = data['results'].map((link) => {
+    return {
+      title: link['title'],
+      url: link['source_url'],
+      tags: [...new Set(Object.keys(link['tags']))],
+      date: link['created_at'],
+      summary: link['summary'],
+      note: link['notes'],
+      description: `${link['summary']}<br/><br/>`,
+    }
+  })
+  return links.filter((link) => link.tags.includes('share'))
+}
+```
+
+This fetches links from my archive (so that it's much more likely that I've read them) and includes them on my now page via a `links.liquid` partial that looks like this:
+
+{% raw %}
+```liquid
+{% if links.size > 0 %}
+  <h2 class="now__section--header flex--centered">
+    {% tablericon "link" "Links" %}
+    Links
+  </h2>
+  <ul class="link__list">
+    {% for link in links limit: 5 %}
+      <li>
+        <a class="no-underline" href="{{link.url}}" title="{{link.title | escape}}">
+          {{ link.title }}
+        </a>
+      </li>
+    {% endfor %}
+  </ul>
+{% endif %}
+```
+{% endraw %}
+
+Now, however, I've gone ahead and added the `notes` field from Readwise's API response to the `data` I expose in my `links.js` file above and constructed [an additional top level page](/links), complete with pagination. This top level page formats my shared links much like the posts on my home page, adds the summary Readwise fetches as a `<blockquote>` and, if I've added notes to the document (which I'll now aim to do more consistently), it will render them below the `<blockquote>`. Now, *all* of the links I've shared are at least visible *somewhere* on my site instead of the five most recent on [my now page](/now).
+
+There you have it — link blogging via Readwise Reader[^1].
+
+[^1]: Or lazy link blogging, if you'd prefer.