kopia lustrzana https://dev.funkwhale.audio/funkwhale/funkwhale
61 wiersze
1.5 KiB
Vue
61 wiersze
1.5 KiB
Vue
<script setup lang="ts">
|
|
import type { Library } from '~/types'
|
|
|
|
import { computed } from 'vue'
|
|
import { useStore } from '~/store'
|
|
|
|
interface Events {
|
|
(e: 'unfollowed'): void
|
|
(e: 'followed'): void
|
|
}
|
|
|
|
interface Props {
|
|
library: Library
|
|
}
|
|
|
|
const emit = defineEmits<Events>()
|
|
const props = defineProps<Props>()
|
|
|
|
const store = useStore()
|
|
const follow = computed(() => store.getters['libraries/follow'](props.library.uuid))
|
|
const isPending = computed(() => follow.value && follow.value.approved === null)
|
|
const isApproved = computed(() => follow.value && (follow.value?.approved === true || (isPending.value && props.library.privacy_level === 'everyone')))
|
|
|
|
const toggle = () => {
|
|
if (isPending.value || isApproved.value) {
|
|
emit('unfollowed')
|
|
} else {
|
|
emit('followed')
|
|
}
|
|
|
|
return store.dispatch('libraries/toggle', props.library.uuid)
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<button
|
|
:class="['ui', 'pink', {'inverted': isApproved || isPending}, {'favorited': isApproved}, 'icon', 'labeled', 'button']"
|
|
@click.stop="toggle"
|
|
>
|
|
<i class="heart icon" />
|
|
<translate
|
|
v-if="isApproved"
|
|
translate-context="Content/Library/Card.Button.Label/Verb"
|
|
>
|
|
Unfollow
|
|
</translate>
|
|
<translate
|
|
v-else-if="isPending"
|
|
translate-context="Content/Library/Card.Button.Label/Verb"
|
|
>
|
|
Cancel follow request
|
|
</translate>
|
|
<translate
|
|
v-else
|
|
translate-context="Content/Library/Card.Button.Label/Verb"
|
|
>
|
|
Follow
|
|
</translate>
|
|
</button>
|
|
</template>
|