727d05915f
* fix: rtl arrows on settings page * fix: border on settings page for RTL languages * fix: RTL fixes for logo, search box and logout icon * fix: RTL layout bugs in conversations * chore: remove rtl setting icon * improve arabic locale * add new entries to arabic locale * chore: include number format * fix: RTL layout on several pages * fix: RTL layout of account header and sign in modal * fix: always display account handle in LTR * fix: move character counter in publish widget to left side for RTL * fix: remove border-ss-none unocss rule * fix: many RTL fixes * fix: RTL fixes for many pages * fix: use viewer's direction in all content * chore: use new arabic plural rules * chore: flip arrow on main content header * chore: fix StatusPoll and show_new_items for zh-TW * chore: StatusPoll tooltip on bottom * chore: add `en` variants to i18n conf * chore: update entry to use new plural rule * fix: automatic content direction for status * fix: direction for account handle * fix: direction of polls Co-authored-by: userquin <userquin@gmail.com> Co-authored-by: Jean-Paul Khawam <jeanpaulkhawam@protonmail.com> Co-authored-by: Daniel Roe <daniel@roe.dev>
58 lines
2.1 KiB
Vue
58 lines
2.1 KiB
Vue
<script setup lang="ts">
|
|
import type { FilterContext, Status } from 'masto'
|
|
|
|
const { status, context } = defineProps<{
|
|
status: Status
|
|
context?: FilterContext | 'details'
|
|
}>()
|
|
|
|
const isDM = $computed(() => status.visibility === 'direct')
|
|
const isDetails = $computed(() => context === 'details')
|
|
|
|
// Content Filter logic
|
|
const filterResult = $computed(() => status.filtered?.length ? status.filtered[0] : null)
|
|
const filter = $computed(() => filterResult?.filter)
|
|
|
|
// a bit of a hack due to Filter being different in v1 and v2
|
|
// clean up when masto.js supports explicit versions: https://github.com/neet/masto.js/issues/722
|
|
const filterPhrase = $computed(() => filter?.phrase || (filter as any)?.title)
|
|
const isFiltered = $computed(() => filterPhrase && (context && context !== 'details' ? filter?.context.includes(context) : false))
|
|
</script>
|
|
|
|
<template>
|
|
<div
|
|
space-y-3
|
|
:class="{
|
|
'pt2 pb0.5 px3.5 border-1 rounded-3 rounded-bs-is-none': isDM,
|
|
'bg-fade border-primary-light': isDM,
|
|
}"
|
|
>
|
|
<StatusBody v-if="!isFiltered && status.sensitive && !status.spoilerText" :status="status" :with-action="!isDetails" :class="isDetails ? 'text-xl' : ''" />
|
|
<StatusSpoiler :enabled="status.sensitive || isFiltered" :filter="isFiltered">
|
|
<template v-if="filterPhrase" #spoiler>
|
|
<p>{{ `${$t('status.filter_hidden_phrase')}: ${filterPhrase}` }}</p>
|
|
</template>
|
|
<template v-else-if="status.spoilerText" #spoiler>
|
|
<p>{{ status.spoilerText }}</p>
|
|
</template>
|
|
<StatusBody v-if="!status.sensitive || status.spoilerText" :status="status" :with-action="!isDetails" :class="isDetails ? 'text-xl' : ''" />
|
|
<StatusPoll v-if="status.poll" :status="status" />
|
|
<StatusMedia
|
|
v-if="status.mediaAttachments?.length"
|
|
:status="status"
|
|
/>
|
|
<StatusPreviewCard
|
|
v-if="status.card"
|
|
:card="status.card"
|
|
:small-picture-only="status.mediaAttachments?.length > 0"
|
|
/>
|
|
<StatusCard
|
|
v-if="status.reblog"
|
|
:status="status.reblog" border="~ rounded"
|
|
:actions="false"
|
|
/>
|
|
<div v-if="isDM" />
|
|
</StatusSpoiler>
|
|
</div>
|
|
</template>
|