add keys to fetches

pages/blog/[year]/[month]/[day]/[slug].vue

@@ -26,8 +26,11 @@
 import type { BlogPost } from '~~/lib/types/post';
 
 const route = useRoute();
-const { data: post, refresh } = await useFetch<BlogPost>(
-  `/api/blog/${route.params.slug}`
+const { data: post } = await useFetch<BlogPost>(
+  `/api/blog/${route.params.slug}`,
+  {
+    key: `${route.params.slug}-post`,
+  }
 );
 
 const isostamp = computed(() => new Date(post.value.date).toISOString());
@@ -37,8 +40,4 @@ const preview = computed(() =>
     .replace('\n', ' ')
     .substring(0, 120)
 );
-
-onMounted(() => {
-  refresh();
-});
 </script>

pages/blog/archive/[year]/[month]/[day]/index.vue

@@ -8,7 +8,8 @@
 import type { BlogPost } from '~~/lib/types/post';
 
 const route = useRoute();
-const { data: posts, refresh } = await useFetch<BlogPost[]>(`/api/blog`, {
+const { data: posts } = await useFetch<BlogPost[]>(`/api/blog`, {
+  key: `${route.params.year}-${route.params.month}-${route.params.day}-page`,
   params: {
     year: route.params.year,
     month: route.params.month,
@@ -17,8 +18,4 @@ const { data: posts, refresh } = await useFetch<BlogPost[]>(`/api/blog`, {
     render: false,
   },
 });
-
-onMounted(() => {
-  refresh();
-});
 </script>

pages/blog/archive/[year]/[month]/index.vue

@@ -8,7 +8,8 @@
 import type { BlogPost } from '~~/lib/types/post';
 
 const route = useRoute();
-const { data: posts, refresh } = await useFetch<BlogPost[]>(`/api/blog`, {
+const { data: posts } = await useFetch<BlogPost[]>(`/api/blog`, {
+  key: `${route.params.year}-${route.params.month}-page`,
   params: {
     year: route.params.year,
     month: route.params.month,
@@ -16,8 +17,4 @@ const { data: posts, refresh } = await useFetch<BlogPost[]>(`/api/blog`, {
     render: false,
   },
 });
-
-onMounted(() => {
-  refresh();
-});
 </script>

pages/blog/archive/[year]/index.vue

@@ -8,15 +8,12 @@
 import type { BlogPost } from '~~/lib/types/post';
 
 const route = useRoute();
-const { data: posts, refresh } = await useFetch<BlogPost[]>(`/api/blog`, {
+const { data: posts } = await useFetch<BlogPost[]>(`/api/blog`, {
+  key: `${route.params.year}-archive-page`,
   params: {
     year: route.params.year,
     body: false,
     render: false,
   },
 });
-
-onMounted(() => {
-  refresh();
-});
 </script>

pages/blog/archive/index.vue

@@ -8,6 +8,7 @@
 import type { BlogPost } from '~~/lib/types/post';
 
 const { data: posts } = await useFetch<BlogPost[]>(`/api/blog`, {
+  key: `blog-archive`,
   params: {
     body: false,
     render: false,

pages/blog/tags/[tag].vue

@@ -8,15 +8,12 @@
 import type { BlogPost } from '~~/lib/types/post';
 
 const route = useRoute();
-const { data: posts, refresh } = await useFetch<BlogPost[]>(`/api/blog`, {
+const { data: posts } = await useFetch<BlogPost[]>(`/api/blog`, {
+  key: `${route.params.tag}-tag-page`,
   params: {
     tag: route.params.tag,
     body: false,
     render: false,
   },
 });
-
-onMounted(() => {
-  refresh();
-});
 </script>