refactor: migrate to nuxt compatibilityVersion: 4 (#3298)

app/components/conversation/ConversationCard.vue

@@ -0,0 +1,26 @@
+<script setup lang="ts">
+import type { mastodon } from 'masto'
+
+const { conversation } = defineProps<{
+  conversation: mastodon.v1.Conversation
+}>()
+
+const withAccounts = computed(() =>
+  conversation.accounts.filter(account => account.id !== conversation.lastStatus?.account.id),
+)
+</script>
+
+<template>
+  <article v-if="conversation.lastStatus" flex flex-col gap-2>
+    <StatusCard v-if="conversation.lastStatus" :status="conversation.lastStatus" :actions="false">
+      <template #meta>
+        <div flex gap-2 text-sm text-secondary font-bold>
+          <p me-1>
+            {{ $t('conversation.with') }}
+          </p>
+          <AccountAvatar v-for="account in withAccounts" :key="account.id" h-5 w-5 :account="account" />
+        </div>
+      </template>
+    </StatusCard>
+  </article>
+</template>

app/components/conversation/ConversationPaginator.vue

@@ -0,0 +1,25 @@
+<script setup lang="ts">
+import type { mastodon } from 'masto'
+
+defineProps<{
+  paginator: mastodon.Paginator<mastodon.v1.Conversation[], mastodon.DefaultPaginationParams>
+}>()
+
+function preprocess(items: mastodon.v1.Conversation[]): mastodon.v1.Conversation[] {
+  const isAuthored = (conversation: mastodon.v1.Conversation) => conversation.lastStatus ? conversation.lastStatus.account.id === currentUser.value?.account.id : false
+  return items.filter(item => isAuthored(item) || !item.lastStatus?.filtered?.find(
+    filter => filter.filter.filterAction === 'hide' && filter.filter.context.includes('thread'),
+  ))
+}
+</script>
+
+<template>
+  <CommonPaginator :paginator="paginator" :preprocess="preprocess">
+    <template #default="{ item }">
+      <ConversationCard
+        :conversation="item"
+        border="b base" py-1
+      />
+    </template>
+  </CommonPaginator>
+</template>