<template>
  <Common>
      <div class="related-post-wrapper">
        <RelatedList :data="filteredPosts" />
      </div>
  </Common>
</template>

<script setup lang="ts">
import RelatedList from "@theme/RelatedList.vue";
import { computed } from "vue";
import { useBlog, useTags } from "../composables";
import { filterPostsByTag, getPostsByYear } from "../utils";
import { usePageFrontmatter } from "@vuepress/client";
import type { GungnirThemePostFrontmatter } from "../../shared";


const { posts } = useBlog();
const { tags } = useTags();
const frontmatter = usePageFrontmatter<GungnirThemePostFrontmatter>();
 

const currentTagcustome = () => {
  return frontmatter.value.tags[0];
};

const filteredPosts = computed(() => {
  const tag = currentTagcustome();
  return getPostsByYear(filterPostsByTag(posts.value, tag));
});
</script>

