mirror of
https://github.com/elk-zone/elk.git
synced 2024-07-08 23:36:49 +01:00
69 lines
1.9 KiB
Vue
69 lines
1.9 KiB
Vue
<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.$select(account.id).authorize()
|
|
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.$select(account.id).reject()
|
|
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>
|