feat: withdraw follow request

closes #2179
closes #2162

components/account/AccountFollowButton.vue

@@ -71,7 +71,6 @@ const buttonStyle = $computed(() => {
   <button
     v-if="enable"
     gap-1 items-center group
-    :disabled="relationship?.requested"
     border-1
     rounded-full flex="~ gap2 center" font-500 min-w-30 h-fit px3 py1
     :class="buttonStyle"
@@ -91,11 +90,12 @@ const buttonStyle = $computed(() => {
       <span hidden elk-group-hover="inline">{{ $t('account.unfollow') }}</span>
     </template>
     <template v-else-if="relationship?.requested">
-      <span>{{ $t('account.follow_requested') }}</span>
+      <span elk-group-hover="hidden">{{ $t('account.follow_requested') }}</span>
+      <span hidden elk-group-hover="inline">Withdraw follow request</span>
     </template>
     <template v-else-if="relationship ? relationship.followedBy : context === 'followedBy'">
       <span elk-group-hover="hidden">{{ $t('account.follows_you') }}</span>
-      <span hidden elk-group-hover="inline">{{ $t('account.follow_back') }}</span>
+      <span hidden elk-group-hover="inline">{{ account.locked ? $t('account.request_follow') : $t('account.follow_back') }}</span>
     </template>
     <template v-else>
       <span>{{ account.locked ? $t('account.request_follow') : $t('account.follow') }}</span>

composables/masto/relationship.ts

@@ -36,7 +36,9 @@ export async function toggleFollowAccount(relationship: mastodon.v1.Relationship
   const { client } = $(useMasto())
   const i18n = useNuxtApp().$i18n
 
-  if (relationship!.following) {
+  const unfollow = relationship!.following || relationship!.requested
+
+  if (unfollow) {
     if (await openConfirmDialog({
       title: i18n.t('confirm.unfollow.title'),
       confirm: i18n.t('confirm.unfollow.confirm'),
@@ -44,8 +46,19 @@ export async function toggleFollowAccount(relationship: mastodon.v1.Relationship
     }) !== 'confirm')
       return
   }
-  relationship!.following = !relationship!.following
-  relationship = await client.v1.accounts[relationship!.following ? 'follow' : 'unfollow'](account.id)
+
+  if (unfollow) {
+    relationship!.following = false
+    relationship!.requested = false
+  }
+  else if (account.locked) {
+    relationship!.requested = true
+  }
+  else {
+    relationship!.following = true
+  }
+
+  relationship = await client.v1.accounts[unfollow ? 'unfollow' : 'follow'](account.id)
 }
 
 export async function toggleMuteAccount(relationship: mastodon.v1.Relationship, account: mastodon.v1.Account) {