feat: personal notes (#1960)

components/account/AccountMoreButton.vue

@@ -5,6 +5,11 @@ const { account } = defineProps<{
   account: mastodon.v1.Account
   command?: boolean
 }>()
+const emit = defineEmits<{
+  (evt: 'addNote'): void
+  (evt: 'removeNote'): void
+}>()
+
 let relationship = $(useRelationship(account))
 
 const isSelf = $(useSelfAccount(() => account))
@@ -63,6 +68,19 @@ async function toggleReblogs() {
   const showingReblogs = !relationship?.showingReblogs
   relationship = await client.v1.accounts.follow(account.id, { reblogs: showingReblogs })
 }
+
+async function addUserNote() {
+  emit('addNote')
+}
+
+async function removeUserNote() {
+  if (!relationship!.note || relationship!.note.length === 0)
+    return
+
+  const newNote = await client.v1.accounts.createNote(account.id, { comment: '' })
+  relationship!.note = newNote.note
+  emit('removeNote')
+}
 </script>
 
 <template>
@@ -112,6 +130,21 @@ async function toggleReblogs() {
             @click="toggleReblogs()"
           />
 
+          <CommonDropdownItem
+            v-if="!relationship?.note || relationship?.note?.length === 0"
+            :text="$t('menu.add_personal_note', [`@${account.acct}`])"
+            icon="i-ri-edit-2-line"
+            :command="command"
+            @click="addUserNote()"
+          />
+          <CommonDropdownItem
+            v-else
+            :text="$t('menu.remove_personal_note', [`@${account.acct}`])"
+            icon="i-ri-edit-2-line"
+            :command="command"
+            @click="removeUserNote()"
+          />
+
           <CommonDropdownItem
             v-if="!relationship?.muting"
             :text="$t('menu.mute_account', [`@${account.acct}`])"