feat: Add Utterances comments to blog posts and update icon dependencies.

app/components/UtterancesComments.vue

@@ -0,0 +1,21 @@
+<script setup lang="ts">
+const commentsRef = ref<HTMLElement | null>(null);
+
+onMounted(() => {
+	if (!commentsRef.value) return;
+
+	const script = document.createElement("script");
+	script.src = "https://utteranc.es/client.js";
+	script.setAttribute("repo", "andwati/personal-website");
+	script.setAttribute("issue-term", "pathname");
+	script.setAttribute("theme", "github-dark");
+	script.setAttribute("crossorigin", "anonymous");
+	script.async = true;
+
+	commentsRef.value.appendChild(script);
+});
+</script>
+
+<template>
+  <div ref="commentsRef" class="mt-12 pt-8 border-t border-(--ui-border)" />
+</template>

app/pages/blog/[...slug].vue

@@ -46,6 +46,7 @@ useSeoMeta({
 
       <div class="prose prose-primary dark:prose-invert max-w-none prose-headings:scroll-mt-20 prose-pre:rounded-xl prose-pre:border prose-pre:border-(--ui-border)">
         <ContentRenderer :value="post" />
+        <UtterancesComments />
       </div>
     </div>
   </UContainer>

package.json

@@ -9,6 +9,8 @@
 		"preview": "nuxt preview"
 	},
 	"dependencies": {
+		"@iconify-json/lucide": "^1.2.90",
+		"@iconify-json/simple-icons": "^1.2.70",
 		"@nuxt/content": "^3.11.2",
 		"@nuxt/hints": "1.0.0-alpha.6",
 		"@nuxt/image": "2.0.0",

pnpm-lock.yaml

@@ -8,6 +8,12 @@ importers:
 
   .:
     dependencies:
+      '@iconify-json/lucide':
+        specifier: ^1.2.90
+        version: 1.2.90
+      '@iconify-json/simple-icons':
+        specifier: ^1.2.70
+        version: 1.2.70
       '@nuxt/content':
         specifier: ^3.11.2
         version: 3.11.2([email protected])([email protected])
@@ -594,6 +600,12 @@ packages:
   '@floating-ui/[email protected]':
     resolution: {integrity: sha512-vdf8f6rHnFPPLRsmL4p12wYl+Ux4mOJOkjzKEMYVnwdf7UFdvBtHlLvQyx8iKG5vhPRbDRgZxdtpmyigDPjzYg==}
 
+  '@iconify-json/[email protected]':
+    resolution: {integrity: sha512-dPn1pRhfBa9KR+EVpdyM1Rvw3T36hCKYxd6TxK1ifffiNt0f5yXx8ZVhqnzPH4Vkz87yLMj5xFCXomNrnzd2kQ==}
+
+  '@iconify-json/[email protected]':
+    resolution: {integrity: sha512-CYNRCgN6nBTjN4dNkrBCjHXNR2e4hQihdsZUs/afUNFOWLSYjfihca4EFN05rRvDk4Xoy2n8tym6IxBZmcn+Qg==}
+
   '@iconify/[email protected]':
     resolution: {integrity: sha512-rGtrLIeHu4qVTfe/Bsy5TIoRmj0KmvSNrPWu8RFX7bHeq5NqAz/VNXQBPRhtCX43D/ZIozB9vLwLWr+ETHbhEg==}
 
@@ -6083,6 +6095,14 @@ snapshots:
       - '@vue/composition-api'
       - vue
 
+  '@iconify-json/[email protected]':
+    dependencies:
+      '@iconify/types': 2.0.0
+
+  '@iconify-json/[email protected]':
+    dependencies:
+      '@iconify/types': 2.0.0
+
   '@iconify/[email protected]':
     dependencies:
       '@iconify/types': 2.0.0