CloudToys/elk
1
0
Fork 0
Code

feat(account): more actions for user

Browse Source
This commit is contained in:
三咲智子 2022-11-25 19:39:21 +08:00
parent b58d204199
commit dfdf95da61
No known key found for this signature in database
GPG Key ID: 69992F2250DFD93E
5 changed files with 105 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
components/account/AccountHeader.vue
View File

@ -64,16 +64,12 @@ function getFieldNameIcon(fieldName: string) {
</div>
</div>
<div flex gap-2 items-center>
<AccountMoreButton :account="account" />
<AccountFollowButton :account="account" />
<!-- <button flex gap-1 items-center w-full rounded op75 hover="op100 text-purple" group>
<div rounded p2 group-hover="bg-rose/10">
<div i-ri:bell-line />
</div>
</button>
<button flex gap-1 items-center w-full rounded op75 hover="op100 text-purple" group>
<div rounded p2 group-hover="bg-purple/10">
<div i-ri:more-2-fill />
</div>
</button> -->
</div>
</div>

77
components/account/AccountMoreButton.vue Normal file
View File

@ -0,0 +1,77 @@
<script setup lang="ts">
import type { Account } from 'masto'
const { account } = defineProps<{
account: Account
}>()
let relationship = $(useRelationship(account))
const mute = async () => {
// TODO: Add confirmation
relationship!.muting = true
relationship = await masto.accounts.mute(account.id, {
// TODO support more options
})
}
const unmute = async () => {
// TODO: Add confirmation
relationship!.muting = false
relationship = await masto.accounts.unmute(account.id)
}
const block = async () => {
// TODO: Add confirmation
relationship!.blocking = true
relationship = await masto.accounts.block(account.id)
}
const unblock = async () => {
// TODO: Add confirmation
relationship!.blocking = false
relationship = await masto.accounts.unblock(account.id)
}
</script>
<template>
<CommonDropdown>
<button flex gap-1 items-center w-full rounded op75 hover="op100 text-purple" group>
<div rounded-5 p2 group-hover="bg-purple/10">
<div i-ri:more-2-fill />
</div>
</button>
<template #popper>
<NuxtLink :to="account.url" target="_blank">
<CommonDropdownItem icon="i-ri:arrow-right-up-line">
Open in original site
</CommonDropdownItem>
</NuxtLink>
<CommonDropdownItem icon="i-ri:at-line" @click="mentionUser(account)">
Mention @{{ account.acct }}
</CommonDropdownItem>
<CommonDropdownItem icon="i-ri:message-3-line" @click="directMessageUser(account)">
Direct message @{{ account.acct }}
</CommonDropdownItem>
<CommonDropdownItem v-if="!relationship?.muting" icon="i-ri:volume-up-fill" @click="mute">
Mute @{{ account.acct }}
</CommonDropdownItem>
<CommonDropdownItem v-else icon="i-ri:volume-mute-line" @click="unmute">
Unmute @{{ account.acct }}
</CommonDropdownItem>
<CommonDropdownItem v-if="!relationship?.blocking" icon="i-ri:forbid-2-line" @click="block">
Block @{{ account.acct }}
</CommonDropdownItem>
<CommonDropdownItem v-else icon="i-ri:checkbox-circle-line" @click="unblock">
Unblock @{{ account.acct }}
</CommonDropdownItem>
</template>
</CommonDropdown>
</template>

2
components/publish/PublishWidget.vue
View File

@ -89,7 +89,7 @@ async function publish() {
await masto.statuses.create(status)
else await masto.statuses.update(draft.editingStatus.id, status)
draft = getDefaultDraft(inReplyToId)
draft = getDefaultDraft({ inReplyToId })
isPublishDialogOpen.value = false
}
finally {

23
components/status/StatusActions.vue
View File

@ -77,9 +77,6 @@ const toggleTranslation = async () => {
const copyLink = async () => {
await clipboard.copy(`${location.origin}${getStatusPath(status)}`)
}
const openInOriginal = () => {
window.open(status.url!, '_blank')
}
const deleteStatus = async () => {
// TODO confirm to delete
@ -115,16 +112,6 @@ function editStatus() {
attachments: [],
})
}
function mention() {
openPublishDialog({
params: {
...getParamsFromStatus(status),
status: `@${status.account.acct} `,
},
attachments: [],
})
}
</script>
<template>
@ -189,9 +176,11 @@ function mention() {
Copy link to this post
</CommonDropdownItem>
<CommonDropdownItem v-if="status.url" icon="i-ri:arrow-right-up-line" @click="openInOriginal">
Open in original site
</CommonDropdownItem>
<NuxtLink :to="status.url" target="_blank">
<CommonDropdownItem v-if="status.url" icon="i-ri:arrow-right-up-line">
Open in original site
</CommonDropdownItem>
</NuxtLink>
<CommonDropdownItem v-if="isTranslationEnabled && status.language !== languageCode" icon="i-ri:translate" @click="toggleTranslation">
<template v-if="!translation.visible">
@ -232,7 +221,7 @@ function mention() {
<template v-else>
<CommonDropdownItem
icon="i-ri:at-line"
@click="mention"
@click="mentionUser(status.account)"
>
Mention @{{ status.account.acct }}
</CommonDropdownItem>

25
composables/statusDrafts.ts
View File

@ -1,4 +1,4 @@
import type { Attachment, CreateStatusParams, Status } from 'masto'
import type { Account, Attachment, CreateStatusParams, Status } from 'masto'
import { STORAGE_KEY_DRAFTS } from '~/constants'
import type { Mutable } from '~/types/utils'
@ -22,12 +22,16 @@ export const currentUserDrafts = computed(() => {
return allDrafts.value[id]
})
export function getDefaultDraft(inReplyToId?: string): Draft {
export function getDefaultDraft({
status = '',
inReplyToId,
visibility = 'public',
}: Partial<Draft['params']> = {}): Draft {
return {
params: {
status: '',
status,
inReplyToId,
visibility: 'public',
visibility,
},
attachments: [],
}
@ -45,7 +49,7 @@ export function useDraft(draftKey: string, inReplyToId?: string) {
const draft = computed({
get() {
if (!currentUserDrafts.value[draftKey])
currentUserDrafts.value[draftKey] = getDefaultDraft(inReplyToId)
currentUserDrafts.value[draftKey] = getDefaultDraft({ inReplyToId })
return currentUserDrafts.value[draftKey]
},
@ -63,3 +67,14 @@ export function useDraft(draftKey: string, inReplyToId?: string) {
}
export const dialogDraft = useDraft('dialog')
export function mentionUser(account: Account) {
openPublishDialog(getDefaultDraft({ status: `@${account.acct} ` }))
}
export function directMessageUser(account: Account) {
openPublishDialog(getDefaultDraft({
status: `@${account.acct} `,
visibility: 'direct',
}))
}