releases page

vernaillen · Aug 16, 2024 · 61f9b8e · 61f9b8e
1 parent 552210f
commit 61f9b8e
Show file tree

Hide file tree

Showing 10 changed files with 930 additions and 226 deletions.
diff --git a/app/app.config.ts b/app/app.config.ts
@@ -17,6 +17,10 @@ export default defineAppConfig({
       label: 'Projects',
       to: '/projects'
     },
+    {
+      label: 'Releases',
+      to: '/releases'
+    },
     {
       label: 'Blog',
       to: '/blog'

diff --git a/app/pages/releases.vue b/app/pages/releases.vue
@@ -0,0 +1,99 @@
+<script setup lang="ts">
+import { formatTimeAgo } from '@vueuse/core'
+import { useFetch } from 'nuxt/app'
+import type { ReleaseInfo } from '../../types'
+
+const { data: page } = await useAsyncData('releases', () => queryContent('/releases').findOne())
+if (!page.value) {
+  throw createError({ statusCode: 404, statusMessage: 'Page not found', fatal: true })
+}
+
+const { data = [] } = await useFetch<ReleaseInfo[]>('/api/releases')
+
+definePageMeta({
+  colorMode: 'dark'
+})
+</script>
+
+<template>
+  <div>
+    <UPageHeader v-bind="page" />
+    <UPage>
+      <UPageBody>
+        <div class="mb-3 max-w-[600px] mx-auto text-center">
+          GitHub releases by
+          <a
+            href="https://github.com/vernaillen"
+            target="_blank"
+          >
+            Wouter Vernaillen
+          </a>
+        </div>
+        <div class="mb-10 opacity-50 text-sm max-w-[600px] mx-auto text-center">
+          Only the latest release of each repo is shown
+        </div>
+
+        <div
+          v-for="item, index of data"
+          :key="index"
+          class="grid grid-cols-12 gap-4 mb-5 max-w-[600px] mx-auto slide-enter"
+          :style="'--enter-stage:' + (index * 3) + ';'"
+        >
+          <div class="col-span-1">
+            <a
+              :href="`https://github.com/${item.repo}`"
+              target="_blank"
+              class="flex-none"
+            >
+              <img
+                :src="`https://github.com/${item.repo.split('/')[0]}.png`"
+                class="h-10 w-10"
+                :alt="item.repo"
+                :class="item.repo.startsWith('vernaillen/') ? 'rounded-full' : 'rounded'"
+              >
+            </a>
+          </div>
+          <div class="col-span-8">
+            <div>
+              <a
+                :href="`https://github.com/${item.repo}`"
+                target="_blank"
+              >
+                {{ item.repo.split('/')[0] }} / {{ item.repo.split('/')[1] }}
+              </a>
+            </div>
+            <div class="opacity-50 text-sm">
+              <a
+                :href="item.commit"
+                target="_blank"
+              >
+                <UIcon
+                  name="i-ph-git-commit-duotone"
+                  class="rotate-90 -ml-[1px] -mb-[1px]"
+                />
+                {{ item.title }}
+              </a>
+            </div>
+          </div>
+          <div class="col-span-3">
+            <div class="text-end">
+              <a
+                font-mono
+                :href="`https://github.com/${item.repo}/releases/tag/v${item.version}`"
+                target="_blank"
+              >
+
+                v{{ item.version }}
+              </a>
+            </div>
+            <div class="text-end opacity-50">
+              <time
+                :datatime="item.created_at"
+              >{{ formatTimeAgo(new Date(item.created_at)) }}</time>
+            </div>
+          </div>
+        </div>
+      </UPageBody>
+    </UPage>
+  </div>
+</template>
diff --git a/content/4.releases.yml b/content/4.releases.yml
@@ -0,0 +1,4 @@
+
+title: Releases
+description: Wouter Vernaillen's recent release commits on GitHub
+pageName: Releases
diff --git a/content/4.blog.yml → content/5.blog.yml b/content/4.blog.yml → content/5.blog.yml
diff --git a/content/5.about.md → content/6.about.md b/content/5.about.md → content/6.about.md
diff --git a/nuxt.config.ts b/nuxt.config.ts
@@ -27,7 +27,9 @@ export default defineNuxtConfig({
   runtimeConfig: {
     public: {
       nuxtVersion: nuxtPkg.version
-    }
+    },
+    githubToken: process.env.GITHUB_TOKEN,
+    githubLogin: process.env.GITHUB_LOGIN
   },
 
   eslint: {
@@ -93,7 +95,7 @@ export default defineNuxtConfig({
   },
 
   ui: {
-    icons: ['heroicons', 'mdi', 'ic', 'logos', 'tabler', 'twemoji']
+    icons: ['heroicons', 'mdi', 'ic', 'logos', 'tabler', 'twemoji', 'ph']
   },
 
   uiPro: {

diff --git a/package.json b/package.json
@@ -14,13 +14,14 @@
   },
   "dependencies": {
     "@nuxt/content": "^2.13.2",
-    "@nuxt/fonts": "^0.7.1",
+    "@nuxt/fonts": "^0.7.2",
     "@nuxt/image": "^1.7.0",
     "@nuxt/ui-pro": "^1.4.0",
-    "@vueuse/nuxt": "^10.11.0",
+    "@vueuse/nuxt": "^11.0.0",
     "motion": "^10.18.0",
     "nuxt": "^3.12.4",
     "nuxt-time": "^0.1.3",
+    "octokit": "^4.0.2",
     "vue3-lazyload": "^0.3.8"
   },
   "devDependencies": {
@@ -31,13 +32,13 @@
     "@iconify-json/ic": "^1.1.17",
     "@iconify-json/logos": "^1.1.43",
     "@iconify-json/mdi": "^1.1.67",
-    "@iconify-json/tabler": "^1.1.118",
+    "@iconify-json/tabler": "^1.1.120",
     "@iconify-json/twemoji": "^1.1.15",
     "@iconify/utils": "^2.1.30",
     "@nuxt/eslint": "^0.5.0",
     "@nuxthq/studio": "^2.0.3",
     "@nuxtjs/plausible": "^1.0.1",
-    "@nuxtjs/sitemap": "6.0.0-beta.1",
+    "@nuxtjs/sitemap": "6.0.0-beta.2",
     "nuxt-og-image": "3.0.0-rc.64",
     "nuxt-svgo": "^4.0.1",
     "unlighthouse": "^0.13.2",