feat: archive link

src/views/ArchiveView.vue

@@ -0,0 +1,38 @@
+<script setup lang="ts">
+import { ref, onBeforeMount, onUpdated, onMounted } from 'vue'
+import { listArticles, updateDynamicContent } from '@lib/articles'
+import type { ArticleMetadata } from '@interfaces'
+import { simpleDateFormat } from '@lib/dates'
+import { PROD, TITLE } from '@lib/config'
+import { stripHTML } from '@lib/strings'
+
+const articles = ref<ArticleMetadata[]>([])
+const loading = ref<boolean>(true)
+
+onBeforeMount(async () => {
+  const newArticles = (await listArticles())
+    .filter((metadata) => (!metadata.draft || !PROD) && metadata.path)
+  articles.value.splice(0, articles.value.length, ...newArticles)
+  window.document.title = stripHTML(TITLE) + ' — Archive'
+  loading.value = false
+  await updateDynamicContent()
+})
+onMounted(updateDynamicContent)
+onUpdated(updateDynamicContent)
+</script>
+
+<template>
+  <div v-if="!loading" class="home">
+    <ul>
+      <li v-for="(metadata, index) in articles" :key="index">
+        <div v-if="(!metadata.draft || !PROD) && metadata.path" class="article-item">
+          <time class="dt-published mono" :datetime="simpleDateFormat(metadata.date)">{{ simpleDateFormat(metadata.date) }}</time>
+          &nbsp;
+          <RouterLink :to="metadata.path" class="h-entry">
+            <span class="p-name" v-html="metadata.title"></span>
+          </RouterLink>
+        </div>
+      </li>
+    </ul>
+  </div>
+</template>