From 73aaa6af56fd10c263a19894efb0cade566cca88 Mon Sep 17 00:00:00 2001
From: LittleSheep <littlesheep.code@hotmail.com>
Date: Mon, 11 Mar 2024 23:50:36 +0800
Subject: [PATCH] :sparkles: Better navigator

---
 .../src/components/posts/ArticleContent.vue   | 20 ++++++-------------
 .../src/components/posts/MomentContent.vue    | 20 ++++++-------------
 2 files changed, 12 insertions(+), 28 deletions(-)

diff --git a/pkg/views/src/components/posts/ArticleContent.vue b/pkg/views/src/components/posts/ArticleContent.vue
index 65cd7ff..6e67cb4 100644
--- a/pkg/views/src/components/posts/ArticleContent.vue
+++ b/pkg/views/src/components/posts/ArticleContent.vue
@@ -1,31 +1,23 @@
 <template>
-  <div>
+  <component
+    :is="props.brief ? RouterLink : 'div'"
+    :to="{ name: 'posts.details.articles', params: { alias: props.item?.alias } }"
+  >
     <section v-if="!props.contentOnly" class="mb-2">
       <h1 class="text-lg font-bold">{{ props.item?.title }}</h1>
       <div class="text-sm">{{ props.item?.description }}</div>
     </section>
 
-    <div v-if="props.brief" class="mt-2">
-      <v-btn
-        append-icon="mdi-arrow-right"
-        variant="tonal"
-        size="small"
-        rounded="sm"
-        :to="{ name: 'posts.details.articles', params: { alias: props.item?.alias ?? 'not-found' } }"
-      >
-        Read more
-      </v-btn>
-    </div>
-
     <div v-else>
       <article class="prose max-w-none" v-html="parseContent(props.item?.content ?? '')" />
     </div>
-  </div>
+  </component>
 </template>
 
 <script setup lang="ts">
 import dompurify from "dompurify"
 import { parse } from "marked"
+import { RouterLink } from "vue-router"
 
 const props = defineProps<{ item: any; brief?: boolean; contentOnly?: boolean }>()
 
diff --git a/pkg/views/src/components/posts/MomentContent.vue b/pkg/views/src/components/posts/MomentContent.vue
index 5b8d0f9..f768c91 100644
--- a/pkg/views/src/components/posts/MomentContent.vue
+++ b/pkg/views/src/components/posts/MomentContent.vue
@@ -1,24 +1,16 @@
 <template>
-  <div>
+  <component
+    :is="props.brief ? RouterLink : 'div'"
+    :to="{ name: 'posts.details.moments', params: { alias: props.item?.alias } }"
+  >
     <article class="prose prose-moment" v-html="parseContent(props.item?.content ?? '')" />
-
-    <div v-if="props.brief" class="my-1">
-      <v-btn
-        append-icon="mdi-arrow-right"
-        variant="tonal"
-        size="x-small"
-        rounded="sm"
-        :to="{ name: 'posts.details.moments', params: { alias: props.item?.alias ?? 'not-found' } }"
-      >
-        More
-      </v-btn>
-    </div>
-  </div>
+  </component>
 </template>
 
 <script setup lang="ts">
 import dompurify from "dompurify"
 import { parse } from "marked"
+import { RouterLink } from "vue-router"
 
 const props = defineProps<{ item: any; brief?: boolean }>()