feat: handle follow request (#2339)
Sma11X
GitHub
parent
d825a71d1f
commit
5fceb70971
|
|
@ -19,8 +19,10 @@ cacheAccount(account)
|
|||
overflow-hidden
|
||||
:to="getAccountRoute(account)"
|
||||
/>
|
||||
<div h-full p1 shrink-0>
|
||||
<AccountFollowButton :account="account" :context="relationshipContext" />
|
||||
</div>
|
||||
<slot>
|
||||
<div h-full p1 shrink-0>
|
||||
<AccountFollowButton :account="account" :context="relationshipContext" />
|
||||
</div>
|
||||
</slot>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,68 @@
|
|||
<script setup lang="ts">
|
||||
import type { mastodon } from 'masto'
|
||||
|
||||
const { account, ...props } = defineProps<{
|
||||
account: mastodon.v1.Account
|
||||
relationship?: mastodon.v1.Relationship
|
||||
}>()
|
||||
const relationship = $computed(() => props.relationship || useRelationship(account).value)
|
||||
const { client } = $(useMasto())
|
||||
|
||||
async function authorizeFollowRequest() {
|
||||
relationship!.requestedBy = false
|
||||
relationship!.followedBy = true
|
||||
try {
|
||||
const newRel = await client.v1.followRequests.authorize(account.id)
|
||||
Object.assign(relationship!, newRel)
|
||||
}
|
||||
catch (err) {
|
||||
console.error(err)
|
||||
relationship!.requestedBy = true
|
||||
relationship!.followedBy = false
|
||||
}
|
||||
}
|
||||
|
||||
async function rejectFollowRequest() {
|
||||
relationship!.requestedBy = false
|
||||
try {
|
||||
const newRel = await client.v1.followRequests.reject(account.id)
|
||||
Object.assign(relationship!, newRel)
|
||||
}
|
||||
catch (err) {
|
||||
console.error(err)
|
||||
relationship!.requestedBy = true
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div flex gap-4>
|
||||
<template v-if="relationship?.requestedBy">
|
||||
<CommonTooltip :content="$t('account.authorize')" no-auto-focus>
|
||||
<button
|
||||
type="button"
|
||||
rounded-full text-sm p2 border-1
|
||||
hover:text-green transition-colors
|
||||
@click="authorizeFollowRequest"
|
||||
>
|
||||
<span block text-current i-ri:check-fill />
|
||||
</button>
|
||||
</CommonTooltip>
|
||||
<CommonTooltip :content="$t('account.reject')" no-auto-focus>
|
||||
<button
|
||||
type="button"
|
||||
rounded-full text-sm p2 border-1
|
||||
hover:text-red transition-colors
|
||||
@click="rejectFollowRequest"
|
||||
>
|
||||
<span block text-current i-ri:close-fill />
|
||||
</button>
|
||||
</CommonTooltip>
|
||||
</template>
|
||||
<template v-else>
|
||||
<span text-secondary>
|
||||
{{ relationship?.followedBy ? $t('account.authorized') : $t('account.rejected') }}
|
||||
</span>
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -109,6 +109,10 @@ const personalNoteMaxLength = 2000
|
|||
|
||||
<template>
|
||||
<div flex flex-col>
|
||||
<div v-if="relationship?.requestedBy" p-4 flex justify-between items-center bg-card>
|
||||
<span text-primary font-bold>{{ $t('account.requested', [account.displayName]) }}</span>
|
||||
<AccountFollowRequestButton :account="account" :relationship="relationship" />
|
||||
</div>
|
||||
<component :is="hasHeader ? 'button' : 'div'" border="b base" z-1 @click="hasHeader ? previewHeader() : undefined">
|
||||
<img h-50 height="200" w-full object-cover :src="account.header" :alt="t('account.profile_description', [account.username])">
|
||||
</component>
|
||||
|
|
|
|||
|
|
@ -60,12 +60,19 @@ const { notification } = defineProps<{
|
|||
</NuxtLink>
|
||||
</template>
|
||||
<template v-else-if="notification.type === 'follow_request'">
|
||||
<div flex ms-4 items-center class="-top-2.5" absolute inset-ie-2 px-2>
|
||||
<div i-ri:user-shared-fill text-xl me-1 />
|
||||
<AccountInlineInfo :account="notification.account" me1 />
|
||||
<div flex px-3 py-2>
|
||||
<div i-ri-user-shared-line text-xl me-3 color-blue />
|
||||
<AccountDisplayName
|
||||
:account="notification.account"
|
||||
text-primary me-1 font-bold line-clamp-1 ws-pre-wrap break-all
|
||||
/>
|
||||
<span me-1 ws-nowrap>
|
||||
{{ $t('notification.request_to_follow') }}
|
||||
</span>
|
||||
</div>
|
||||
<!-- TODO: accept request -->
|
||||
<AccountCard :account="notification.account" />
|
||||
<AccountCard p="s-2 e-4 b-2" hover-card :account="notification.account">
|
||||
<AccountFollowRequestButton :account="notification.account" />
|
||||
</AccountCard>
|
||||
</template>
|
||||
<template v-else-if="notification.type === 'update'">
|
||||
<StatusCard :status="notification.status!" :in-notification="true" :actions="false">
|
||||
|
|
|
|||
|
|
@ -7,6 +7,8 @@
|
|||
"route_loaded": "Page {0} loaded"
|
||||
},
|
||||
"account": {
|
||||
"authorize": "Authorize to follow",
|
||||
"authorized": "You have Authorized the request",
|
||||
"avatar_description": "{0}'s avatar",
|
||||
"blocked_by": "You're blocked by this user.",
|
||||
"blocked_domains": "Blocked domains",
|
||||
|
|
@ -36,7 +38,10 @@
|
|||
"profile_description": "{0}'s profile header",
|
||||
"profile_personal_note": "Personal Note",
|
||||
"profile_unavailable": "Profile unavailable",
|
||||
"reject": "Reject to follow",
|
||||
"rejected": "You have rejected the request",
|
||||
"request_follow": "Request to follow",
|
||||
"requested": "{0} has requested to follow you",
|
||||
"unblock": "Unblock",
|
||||
"unfollow": "Unfollow",
|
||||
"unmute": "Unmute",
|
||||
|
|
|
|||
|
|
@ -7,6 +7,8 @@
|
|||
"route_loaded": "页面{0}已加载"
|
||||
},
|
||||
"account": {
|
||||
"authorize": "同意关注请求",
|
||||
"authorized": "你同意了关注请求",
|
||||
"avatar_description": "{0} 的头像",
|
||||
"blocked_by": "您已被此用户拉黑",
|
||||
"blocked_domains": "已拉黑的域名",
|
||||
|
|
@ -36,7 +38,10 @@
|
|||
"profile_description": "{0} 的个人资料头图",
|
||||
"profile_personal_note": "私人备注",
|
||||
"profile_unavailable": "个人资料不可见",
|
||||
"reject": "拒绝关注请求",
|
||||
"rejected": "你拒绝了关注请求",
|
||||
"request_follow": "请求关注",
|
||||
"requested": "{0} 向你发送了关注请求",
|
||||
"unblock": "取消拉黑",
|
||||
"unfollow": "取消关注",
|
||||
"unmute": "取消屏蔽",
|
||||
|
|
|
|||
Loading…
Reference in New Issue