zio
/
elk
2
0
Fork 0
Code Packages Releases 2 Activity

fix: display follow text when loading relationship

zio/stable
三咲智子 2023-01-09 16:46:28 +08:00
parent c28d1e1537
commit 5c8faca620
No known key found for this signature in database
GPG Key ID: 69992F2250DFD93E
1 changed files with 4 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
components/account/AccountFollowButton.vue
View File

@ -60,18 +60,14 @@ useCommand({
}) })
const buttonStyle = $computed(() => { const buttonStyle = $computed(() => {
// Skeleton while loading, avoid primary color flash if (relationship?.blocking)
if (!relationship)
return 'text-inverted'
if (relationship.blocking)
return 'text-inverted bg-red border-red' return 'text-inverted bg-red border-red'
if (relationship.muting) if (relationship?.muting)
return 'text-base bg-code border-base' return 'text-base bg-code border-base'
// If following, use a label style with a strong border for Mutuals // If following, use a label style with a strong border for Mutuals
if (relationship.following) if (relationship?.following)
return `text-base ${relationship.followedBy ? 'border-strong' : 'border-base'}` return `text-base ${relationship.followedBy ? 'border-strong' : 'border-base'}`
// If not following, use a button style // If not following, use a button style
@ -99,7 +95,7 @@ const buttonStyle = $computed(() => {
<span hidden group-hover="inline">{{ $t('account.unmute') }}</span> <span hidden group-hover="inline">{{ $t('account.unmute') }}</span>
</template> </template>
<template v-else-if="relationship?.following"> <template v-else-if="relationship?.following">
<span group-hover="hidden">{{ relationship?.followedBy ? $t('account.mutuals') : $t('account.following') }}</span> <span group-hover="hidden">{{ relationship.followedBy ? $t('account.mutuals') : $t('account.following') }}</span>
<span hidden group-hover="inline">{{ $t('account.unfollow') }}</span> <span hidden group-hover="inline">{{ $t('account.unfollow') }}</span>
</template> </template>
<template v-else-if="relationship?.requested"> <template v-else-if="relationship?.requested">