funkwhale/front/src/components/podcast/Card.vue

38 lines
826 B
Vue

<script setup lang="ts">
import { useTimeAgo } from '@vueuse/core'
import { useRouter } from 'vue-router'
import type { Channel } from '~/types'
import OptionsButton from '~/components/ui/button/Options.vue'
import Card from '~/components/ui/Card.vue'
const { podcast } = defineProps<{ podcast: Channel }>()
const timeAgo = useTimeAgo(new Date(podcast.artist?.modification_date ?? new Date()))
</script>
<template>
<Card
:title="podcast.uuid"
:image="podcast.artist?.cover?.urls.original"
@click="navigate"
class="podcast-card"
>
<a
@click.stop="navigate"
class="funkwhale link"
>
{{ podcast.artist?.name }}
</a>
<template #footer>
{{ timeAgo }}
<OptionsButton />
</template>
</Card>
</template>
<style lang="scss">
@import './style.scss'
</style>