From e352b6aeb05c3f7a43669c50d5d92b5de3b3b030 Mon Sep 17 00:00:00 2001
From: Arthur DANJOU <arthurdanjou@outlook.fr>
Date: Tue, 5 Sep 2023 00:08:49 +0200
Subject: [PATCH] use nuxt image

---
 nuxt.config.ts               | 8 ++++++++
 src/pages/talents.vue        | 2 +-
 src/pages/writing/[slug].vue | 4 ++--
 types.ts                     | 4 +---
 4 files changed, 12 insertions(+), 6 deletions(-)

diff --git a/nuxt.config.ts b/nuxt.config.ts
index 2646dcf..c41b305 100644
--- a/nuxt.config.ts
+++ b/nuxt.config.ts
@@ -10,6 +10,7 @@ export default defineNuxtConfig({
   ],
 
   modules: [
+    '@nuxt/image',
     '@nuxthq/studio',
     '@nuxthq/ui',
     '@pinia/nuxt',
@@ -44,4 +45,11 @@ export default defineNuxtConfig({
       enabled: true,
     },
   },
+
+  image: {
+    domains: [
+      'avatars0.githubusercontent.com',
+      'pbs.twimg.com'
+    ]
+  }
 })
diff --git a/src/pages/talents.vue b/src/pages/talents.vue
index 1a050f2..b1e1179 100644
--- a/src/pages/talents.vue
+++ b/src/pages/talents.vue
@@ -87,7 +87,7 @@ const getColor = computed(() => `text-${appConfig.ui.primary}-500`)
         >
           <div class="flex">
             <div class="flex gap-6 items-center">
-              <img :src="talent.logo" class="z-20 h-12 w-12 rounded-md">
+              <NuxtImg :src="talent.logo" class="z-20 h-12 w-12 rounded-md" placeholder />
               <div>
                 <h2 class="text-base font-semibold text-zinc-800 dark:text-zinc-100">
                   <div class="absolute -inset-y-6 -inset-x-4 z-0 scale-95 bg-zinc-50 opacity-0 transition group-hover:scale-100 group-hover:opacity-100 dark:bg-zinc-800/50 sm:-inset-x-6 sm:rounded-2xl" />
diff --git a/src/pages/writing/[slug].vue b/src/pages/writing/[slug].vue
index 7a21de2..c2f0af0 100644
--- a/src/pages/writing/[slug].vue
+++ b/src/pages/writing/[slug].vue
@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import type { Post } from '~~/types'
+import type { Post } from '~~/types';
 
 const route = useRoute()
 const { data: postContent } = await useAsyncData<Post>(`writing:${route.params.slug}`, async () => await queryContent<Post>(`/writing/${route.params.slug}`).findOne())
@@ -79,7 +79,7 @@ async function handleLike() {
                 {{ postContent.description }}
               </p>
             </header>
-            <div class="w-full rounded-md my-8">
+            <div v-if="postContent.cover" class="w-full rounded-md my-8">
               {{ postContent.cover }}
             </div>
             <ClientOnly>
diff --git a/types.ts b/types.ts
index 81ff879..b84199b 100644
--- a/types.ts
+++ b/types.ts
@@ -30,9 +30,7 @@ export interface Post extends MarkdownParsedContent {
   description: string
   readingMins: number
   publishedAt: string
-  modifiedAt: string
-  cover: string
-  author: string
+  cover?: string
 }
 
 export interface Project extends MarkdownParsedContent {