feat: query for tiptap mention autocomplete (#120)

Co-authored-by: 三咲智子 Kevin Deng <sxzz@sxzz.moe>

components/tiptap/TiptapMentionList.vue

@@ -1,6 +1,8 @@
 <script setup lang="ts">
+import type { Account } from 'masto'
+
 const { items, command } = defineProps<{
-  items: any[]
+  items: Account[]
   command: Function
 }>()
 
@@ -30,7 +32,7 @@ function onKeyDown(event: KeyboardEvent) {
 function selectItem(index: number) {
   const item = items[index]
   if (item)
-    command({ id: item })
+    command({ id: item.acct })
 }
 
 defineExpose({
@@ -39,7 +41,7 @@ defineExpose({
 </script>
 
 <template>
-  <div relative bg-base text-base shadow border="~ base rounded" text-sm>
+  <div relative bg-base text-base shadow border="~ base rounded" text-sm py-2 overflow-x-hidden overflow-y-auto max-h-100>
     <template v-if="items.length">
       <button
         v-for="(item, index) in items"
@@ -48,7 +50,7 @@ defineExpose({
         block m0 w-full text-left px2 py1
         @click="selectItem(index)"
       >
-        {{ item }}asd
+        <AccountInfo :link="false" :account="item" />
       </button>
     </template>
     <div v-else block m0 w-full text-left px2 py1 italic op30>