elk/components/account/AccountPostsFollowers.vue

59 lines
1.5 KiB
Vue
Raw Normal View History

2022-11-28 09:51:15 +00:00
<script setup lang="ts">
2023-01-08 06:21:09 +00:00
import type { mastodon } from 'masto'
2022-11-28 09:51:15 +00:00
defineProps<{
2023-01-08 06:21:09 +00:00
account: mastodon.v1.Account
2022-11-28 09:51:15 +00:00
}>()
const userSettings = useUserSettings()
2022-11-28 09:51:15 +00:00
</script>
<template>
<div flex gap-5>
<NuxtLink
:to="getAccountRoute(account)"
replace
text-secondary
exact-active-class="text-primary"
>
2022-11-28 10:14:58 +00:00
<template #default="{ isExactActive }">
<CommonLocalizedNumber
keypath="account.posts_count"
:count="account.statusesCount"
font-bold
:class="isExactActive ? 'text-primary' : 'text-base'"
/>
2022-11-28 10:14:58 +00:00
</template>
2022-11-28 09:51:15 +00:00
</NuxtLink>
<NuxtLink
:to="getAccountFollowingRoute(account)"
replace
text-secondary exact-active-class="text-primary"
>
2022-11-28 10:14:58 +00:00
<template #default="{ isExactActive }">
<CommonLocalizedNumber
keypath="account.following_count"
:count="account.followingCount"
font-bold
:class="isExactActive ? 'text-primary' : 'text-base'"
/>
2022-11-28 10:14:58 +00:00
</template>
2022-11-28 09:51:15 +00:00
</NuxtLink>
<NuxtLink
v-if="!getWellnessSetting(userSettings, 'hideFollowerCount')"
:to="getAccountFollowersRoute(account)"
replace text-secondary
exact-active-class="text-primary"
>
2022-11-28 10:14:58 +00:00
<template #default="{ isExactActive }">
<CommonLocalizedNumber
keypath="account.followers_count"
:count="account.followersCount"
font-bold
:class="isExactActive ? 'text-primary' : 'text-base'"
/>
2022-11-28 10:14:58 +00:00
</template>
2022-11-28 09:51:15 +00:00
</NuxtLink>
</div>
</template>