elk/components/account/AccountMoreButton.vue

199 lines
6.8 KiB
Vue
Raw Normal View History

2022-11-25 11:39:21 +00:00
<script setup lang="ts">
2023-01-08 06:21:09 +00:00
import type { mastodon } from 'masto'
2023-06-23 12:24:10 +00:00
import { toggleBlockAccount, toggleBlockDomain, toggleMuteAccount } from '~~/composables/masto/relationship'
2022-11-25 11:39:21 +00:00
const { account } = defineProps<{
2023-01-08 06:21:09 +00:00
account: mastodon.v1.Account
command?: boolean
2022-11-25 11:39:21 +00:00
}>()
2023-04-09 19:11:37 +00:00
const emit = defineEmits<{
(evt: 'addNote'): void
(evt: 'removeNote'): void
}>()
const relationship = useRelationship(account)
2022-11-25 11:39:21 +00:00
const isSelf = useSelfAccount(() => account)
2022-11-25 18:24:46 +00:00
const { t } = useI18n()
const { client } = useMasto()
const useStarFavoriteIcon = usePreferences('useStarFavoriteIcon')
2023-07-03 07:58:48 +00:00
const { share, isSupported: isShareSupported } = useShare()
function shareAccount() {
share({ url: location.href })
}
async function toggleReblogs() {
if (!relationship.value!.showingReblogs && await openConfirmDialog({
title: t('confirm.show_reblogs.title'),
description: t('confirm.show_reblogs.description', [account.acct]),
2023-01-16 08:56:36 +00:00
confirm: t('confirm.show_reblogs.confirm'),
cancel: t('confirm.show_reblogs.cancel'),
}) !== 'confirm')
return
const showingReblogs = !relationship.value?.showingReblogs
relationship.value = await client.value.v1.accounts.$select(account.id).follow({ reblogs: showingReblogs })
}
2023-04-09 19:11:37 +00:00
async function addUserNote() {
emit('addNote')
}
async function removeUserNote() {
if (!relationship.value!.note || relationship.value!.note.length === 0)
2023-04-09 19:11:37 +00:00
return
const newNote = await client.value.v1.accounts.$select(account.id).note.create({ comment: '' })
relationship.value!.note = newNote.note
2023-04-09 19:11:37 +00:00
emit('removeNote')
}
2022-11-25 11:39:21 +00:00
</script>
<template>
<CommonDropdown :eager-mount="command">
2022-11-29 21:24:26 +00:00
<button flex gap-1 items-center w-full rounded op75 hover="op100 text-purple" group aria-label="More actions">
<div rounded-5 p2 elk-group-hover="bg-purple/10">
2022-11-25 11:39:21 +00:00
<div i-ri:more-2-fill />
</div>
</button>
<template #popper>
<NuxtLink :to="account.url" external target="_blank">
<CommonDropdownItem
:text="$t('menu.open_in_original_site')"
icon="i-ri:arrow-right-up-line"
:command="command"
/>
2022-11-25 11:39:21 +00:00
</NuxtLink>
2023-07-03 07:58:48 +00:00
<CommonDropdownItem
v-if="isShareSupported"
:text="$t('menu.share_account', [`@${account.acct}`])"
2023-07-03 07:58:48 +00:00
icon="i-ri:share-line"
:command="command"
@click="shareAccount()"
/>
2022-11-25 11:39:21 +00:00
<template v-if="currentUser">
<template v-if="!isSelf">
<CommonDropdownItem
:text="$t('menu.mention_account', [`@${account.acct}`])"
icon="i-ri:at-line"
:command="command"
@click="mentionUser(account)"
/>
<CommonDropdownItem
:text="$t('menu.direct_message_account', [`@${account.acct}`])"
icon="i-ri:message-3-line"
:command="command"
@click="directMessageUser(account)"
/>
2022-11-26 12:58:10 +00:00
<CommonDropdownItem
v-if="!relationship?.showingReblogs"
icon="i-ri:repeat-line"
:text="$t('menu.show_reblogs', [`@${account.acct}`])"
:command="command"
2023-01-16 08:56:36 +00:00
@click="toggleReblogs()"
/>
<CommonDropdownItem
v-else
:text="$t('menu.hide_reblogs', [`@${account.acct}`])"
icon="i-ri:repeat-line"
:command="command"
2023-01-16 08:56:36 +00:00
@click="toggleReblogs()"
/>
2023-04-09 19:11:37 +00:00
<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}`])"
2023-06-23 12:24:10 +00:00
icon="i-ri:volume-mute-line"
:command="command"
2023-06-23 12:24:10 +00:00
@click="toggleMuteAccount (relationship!, account)"
/>
<CommonDropdownItem
v-else
:text="$t('menu.unmute_account', [`@${account.acct}`])"
2023-06-23 12:24:10 +00:00
icon="i-ri:volume-up-fill"
:command="command"
2023-06-23 12:24:10 +00:00
@click="toggleMuteAccount (relationship!, account)"
/>
<CommonDropdownItem
v-if="!relationship?.blocking"
:text="$t('menu.block_account', [`@${account.acct}`])"
icon="i-ri:forbid-2-line"
:command="command"
2023-06-23 12:24:10 +00:00
@click="toggleBlockAccount (relationship!, account)"
/>
<CommonDropdownItem
v-else
:text="$t('menu.unblock_account', [`@${account.acct}`])"
icon="i-ri:checkbox-circle-line"
:command="command"
2023-06-23 12:24:10 +00:00
@click="toggleBlockAccount (relationship!, account)"
/>
2022-11-29 01:21:03 +00:00
<template v-if="getServerName(account) !== currentServer">
<CommonDropdownItem
v-if="!relationship?.domainBlocking"
:text="$t('menu.block_domain', [getServerName(account)])"
2022-11-29 01:21:03 +00:00
icon="i-ri:shut-down-line"
:command="command"
2023-06-23 12:24:10 +00:00
@click="toggleBlockDomain(relationship!, account)"
/>
<CommonDropdownItem
v-else
:text="$t('menu.unblock_domain', [getServerName(account)])"
icon="i-ri:restart-line"
:command="command"
2023-06-23 12:24:10 +00:00
@click="toggleBlockDomain(relationship!, account)"
/>
2022-11-29 01:21:03 +00:00
</template>
2023-06-23 12:24:10 +00:00
<CommonDropdownItem
:text="$t('menu.report_account', [`@${account.acct}`])"
icon="i-ri:flag-2-line"
:command="command"
@click="openReportDialog(account)"
/>
</template>
<template v-else>
<NuxtLink to="/pinned">
<CommonDropdownItem :text="$t('account.pinned')" icon="i-ri:pushpin-line" :command="command" />
</NuxtLink>
<NuxtLink to="/favourites">
<CommonDropdownItem :text="$t('account.favourites')" :icon="useStarFavoriteIcon ? 'i-ri:star-line' : 'i-ri:heart-3-line'" :command="command" />
</NuxtLink>
<NuxtLink to="/mutes">
<CommonDropdownItem :text="$t('account.muted_users')" icon="i-ri:volume-mute-line" :command="command" />
</NuxtLink>
<NuxtLink to="/blocks">
<CommonDropdownItem :text="$t('account.blocked_users')" icon="i-ri:forbid-2-line" :command="command" />
</NuxtLink>
<NuxtLink to="/domain_blocks">
2022-11-29 11:26:24 +00:00
<CommonDropdownItem :text="$t('account.blocked_domains')" icon="i-ri:shut-down-line" :command="command" />
</NuxtLink>
</template>
2022-11-25 18:24:46 +00:00
</template>
2022-11-25 11:39:21 +00:00
</template>
</CommonDropdown>
</template>