elk/components/conversation/ConversationCard.vue

24 lines
759 B
Vue
Raw Normal View History

2022-11-18 09:37:22 +00:00
<script setup lang="ts">
import type { Conversation } from 'masto'
2022-12-06 23:51:29 +00:00
const { conversation } = defineProps<{
2022-11-18 09:37:22 +00:00
conversation: Conversation
}>()
2022-12-06 23:51:29 +00:00
const withAccounts = $computed(() =>
conversation.accounts.filter(account => account.id !== conversation.lastStatus?.account.id),
)
2022-11-18 09:37:22 +00:00
</script>
<template>
<article v-if="conversation.lastStatus" flex flex-col gap-2>
2022-12-06 23:51:29 +00:00
<div absolute flex gap-2 text-sm text-secondary font-bold left-3 px2 pt2>
<p mr-1>
{{ $t('conversation.with') }}
</p>
<AccountAvatar v-for="account in withAccounts" :key="account.id" h-5 w-5 :account="account" />
2022-11-18 09:37:22 +00:00
</div>
2022-12-06 23:51:29 +00:00
<StatusCard v-if="conversation.lastStatus" :decorated="true" :status="conversation.lastStatus" :actions="false" />
2022-11-27 23:29:21 +00:00
</article>
2022-11-18 09:37:22 +00:00
</template>