mirror of
https://iceshrimp.dev/iceshrimp/akkoma-fe.git
synced 2025-12-16 16:33:03 +01:00
a4ea0a30bf
basically Vue (3 in particular?) will make changes to DOM before this event listener is called, and if the target is displayed using v-if, it will not be part of the DOM at that time, and contains() will return false. so it goes to call hidePopover() which caused this bug.
100 lines
2.9 KiB
Vue
100 lines
2.9 KiB
Vue
<template>
|
|
<div
|
|
class="StatusBody"
|
|
:class="{ '-compact': compact }"
|
|
>
|
|
<div class="body">
|
|
<div
|
|
v-if="status.summary_raw_html"
|
|
class="summary-wrapper"
|
|
:class="{ '-tall': (longSubject && !showingLongSubject) }"
|
|
>
|
|
<RichContent
|
|
class="media-body summary"
|
|
:html="status.summary_raw_html"
|
|
:emoji="status.emojis"
|
|
/>
|
|
<button
|
|
v-show="longSubject && showingLongSubject"
|
|
class="button-unstyled -link tall-subject-hider"
|
|
@click.prevent="toggleShowingLongSubject"
|
|
>
|
|
{{ $t("status.hide_full_subject") }}
|
|
</button>
|
|
<button
|
|
v-show="longSubject && !showingLongSubject"
|
|
class="button-unstyled -link tall-subject-hider"
|
|
@click.prevent="toggleShowingLongSubject"
|
|
>
|
|
{{ $t("status.show_full_subject") }}
|
|
</button>
|
|
</div>
|
|
<div
|
|
:class="{'-tall-status': hideTallStatus}"
|
|
class="text-wrapper"
|
|
>
|
|
<button
|
|
v-show="hideTallStatus"
|
|
class="button-unstyled -link tall-status-hider"
|
|
:class="{ '-focused': focused }"
|
|
@click.prevent="toggleShowMore"
|
|
>
|
|
{{ $t("general.show_more") }}
|
|
</button>
|
|
<RichContent
|
|
v-if="!hideSubjectStatus && !(singleLine && status.summary_raw_html)"
|
|
:class="{ '-single-line': singleLine }"
|
|
class="text media-body"
|
|
:html="status.raw_html"
|
|
:emoji="status.emojis"
|
|
:handle-links="true"
|
|
:greentext="mergedConfig.greentext"
|
|
:attentions="status.attentions"
|
|
@parseReady="onParseReady"
|
|
/>
|
|
|
|
<button
|
|
v-show="hideSubjectStatus"
|
|
class="button-unstyled -link cw-status-hider"
|
|
@click.prevent="toggleShowMore"
|
|
>
|
|
{{ $t("status.show_content") }}
|
|
<FAIcon
|
|
v-if="attachmentTypes.includes('image')"
|
|
icon="image"
|
|
/>
|
|
<FAIcon
|
|
v-if="attachmentTypes.includes('video')"
|
|
icon="video"
|
|
/>
|
|
<FAIcon
|
|
v-if="attachmentTypes.includes('audio')"
|
|
icon="music"
|
|
/>
|
|
<FAIcon
|
|
v-if="attachmentTypes.includes('unknown')"
|
|
icon="file"
|
|
/>
|
|
<FAIcon
|
|
v-if="status.poll && status.poll.options"
|
|
icon="poll-h"
|
|
/>
|
|
<FAIcon
|
|
v-if="status.card"
|
|
icon="link"
|
|
/>
|
|
</button>
|
|
<button
|
|
v-show="showingMore && !fullContent"
|
|
class="button-unstyled -link status-unhider"
|
|
@click.prevent="toggleShowMore"
|
|
>
|
|
{{ tallStatus ? $t("general.show_less") : $t("status.hide_content") }}
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<slot v-if="!hideSubjectStatus" />
|
|
</div>
|
|
</template>
|
|
<script src="./status_body.js" ></script>
|
|
<style lang="scss" src="./status_body.scss" />
|