frontend/app/components/notes/content.vue
Jesse Wierzbinski f5918cc7f9
Some checks failed
CodeQL / Analyze (javascript) (push) Failing after 1s
Deploy to GitHub Pages / build (push) Failing after 0s
Deploy to GitHub Pages / deploy (push) Has been skipped
Docker / build (push) Failing after 0s
Mirror to Codeberg / Mirror (push) Failing after 0s
refactor: ♻️ Simplify Note code with a provide/inject pattern
2026-01-09 23:10:45 +01:00

41 lines
1.3 KiB
Vue

<template>
<ContentWarning
v-if="(note.sensitive || note.spoiler_text) && preferences.show_content_warning"
v-model="hidden"
/>
<OverflowGuard
v-if="note.content"
:character-count="characterCount"
:class="(hidden && preferences.show_content_warning) && 'hidden'"
>
<Prose v-html="note.content" v-render-emojis="note.emojis"></Prose>
</OverflowGuard>
<Attachments
v-if="note.media_attachments.length > 0"
:attachments="note.media_attachments"
:class="(hidden && preferences.show_content_warning) && 'hidden'"
/>
<div v-if="note.quote" class="mt-4 rounded border overflow-hidden">
<Note :note="note.quote" :hide-actions="true" :small-layout="true" />
</div>
</template>
<script lang="ts" setup>
import Attachments from "./attachments.vue";
import ContentWarning from "./content-warning.vue";
import Note from "./note.vue";
import OverflowGuard from "./overflow-guard.vue";
import Prose from "./prose.vue";
import { key } from "./provider";
// biome-ignore lint/style/noNonNullAssertion: We want an error if not provided
const { note } = inject(key)!;
const hidden = ref(note.sensitive || !!note.spoiler_text);
const characterCount = note.text?.length;
</script>