aboutsummaryrefslogtreecommitdiff
path: root/src/components/status
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/status')
-rw-r--r--src/components/status/status.js55
-rw-r--r--src/components/status/status.scss18
-rw-r--r--src/components/status/status.vue89
3 files changed, 147 insertions, 15 deletions
diff --git a/src/components/status/status.js b/src/components/status/status.js
index 9a9bca7a..8f22b708 100644
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@@ -39,7 +39,8 @@ import {
faThumbtack,
faChevronUp,
faChevronDown,
- faAngleDoubleRight
+ faAngleDoubleRight,
+ faPlay
} from '@fortawesome/free-solid-svg-icons'
library.add(
@@ -59,7 +60,8 @@ library.add(
faThumbtack,
faChevronUp,
faChevronDown,
- faAngleDoubleRight
+ faAngleDoubleRight,
+ faPlay
)
const camelCase = name => name.charAt(0).toUpperCase() + name.slice(1)
@@ -133,6 +135,7 @@ const Status = {
'showPinned',
'inProfile',
'profileUserId',
+ 'inQuote',
'simpleTree',
'controlledThreadDisplayStatus',
@@ -151,6 +154,7 @@ const Status = {
'controlledSetMediaPlaying',
'dive'
],
+ emits: ['interacted'],
data () {
return {
uncontrolledReplying: false,
@@ -159,7 +163,8 @@ const Status = {
uncontrolledMediaPlaying: [],
suspendable: true,
error: null,
- headTailLinks: null
+ headTailLinks: null,
+ displayQuote: !this.inQuote
}
},
computed: {
@@ -227,17 +232,11 @@ const Status = {
muteWordHits () {
return muteWordHits(this.status, this.muteWords)
},
- rtBotStatus () {
- return this.statusoid.user.bot
- },
botStatus () {
- return this.status.user.bot
- },
- botIndicator () {
- return this.botStatus && !this.hideBotIndication
+ return this.status.user.actor_type === 'Service'
},
- rtBotIndicator () {
- return this.rtBotStatus && !this.hideBotIndication
+ showActorTypeIndicator () {
+ return !this.hideBotIndication
},
mentionsLine () {
if (!this.headTailLinks) return []
@@ -401,6 +400,24 @@ const Status = {
},
editingAvailable () {
return this.$store.state.instance.editingAvailable
+ },
+ hasVisibleQuote () {
+ return this.status.quote_url && this.status.quote_visible
+ },
+ hasInvisibleQuote () {
+ return this.status.quote_url && !this.status.quote_visible
+ },
+ quotedStatus () {
+ return this.status.quote_id ? this.$store.state.statuses.allStatusesObject[this.status.quote_id] : undefined
+ },
+ shouldDisplayQuote () {
+ return this.quotedStatus && this.displayQuote
+ },
+ scrobblePresent () {
+ return !this.mergedConfig.hideScrobbles && this.status.user.latestScrobble && this.status.user.latestScrobble.artist
+ },
+ scrobble () {
+ return this.status.user.latestScrobble
}
},
methods: {
@@ -420,9 +437,11 @@ const Status = {
this.error = error
},
clearError () {
+ this.$emit('interacted')
this.error = undefined
},
toggleReplying () {
+ this.$emit('interacted')
controlledOrUncontrolledToggle(this, 'replying')
},
gotoOriginal (id) {
@@ -469,6 +488,18 @@ const Status = {
window.scrollBy(0, rect.bottom - window.innerHeight + 50)
}
}
+ },
+ toggleDisplayQuote () {
+ if (this.shouldDisplayQuote) {
+ this.displayQuote = false
+ } else if (!this.quotedStatus) {
+ this.$store.dispatch('fetchStatus', this.status.quote_id)
+ .then(() => {
+ this.displayQuote = true
+ })
+ } else {
+ this.displayQuote = true
+ }
}
},
watch: {
diff --git a/src/components/status/status.scss b/src/components/status/status.scss
index 44812867..760c6ac1 100644
--- a/src/components/status/status.scss
+++ b/src/components/status/status.scss
@@ -422,4 +422,22 @@
}
}
}
+
+ .quoted-status {
+ margin-top: 0.5em;
+ border: 1px solid var(--border, $fallback--border);
+ border-radius: var(--attachmentRadius, $fallback--attachmentRadius);
+
+ &.-unavailable-prompt {
+ padding: 0.5em;
+ }
+ }
+
+ .display-quoted-status-button {
+ margin: 0.5em;
+
+ &-icon {
+ color: inherit;
+ }
+ }
}
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 35b15362..1c91c36c 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -79,7 +79,7 @@
<UserAvatar
v-if="retweet"
class="left-side repeater-avatar"
- :bot="rtBotIndicator"
+ :show-actor-type-indicator="showActorTypeIndicator"
:better-shadow="betterShadow"
:user="statusoid.user"
/>
@@ -133,7 +133,7 @@
>
<UserAvatar
class="post-avatar"
- :bot="botIndicator"
+ :show-actor-type-indicator="showActorTypeIndicator"
:compact="compact"
:better-shadow="betterShadow"
:user="status.user"
@@ -250,6 +250,47 @@
</span>
</div>
<div
+ v-if="scrobblePresent"
+ class="status-rich-presence"
+ >
+ <a
+ v-if="scrobble.externalLink"
+ :href="scrobble.externalLink"
+ target="_blank"
+ >
+ {{ scrobble.artist }} — {{ scrobble.title }}
+ <FAIcon
+ class="fa-scale-110 fa-old-padding"
+ icon="play"
+ />
+ <span class="status-rich-presence-time">
+ <Timeago
+ template-key="time.in_past"
+ :time="scrobble.created_at"
+ :auto-update="60"
+ />
+ </span>
+ </a>
+ <span v-if="!scrobble.externalLink">
+ <FAIcon
+ class="fa-scale-110 fa-old-padding"
+ icon="music"
+ />
+ {{ scrobble.artist }} — {{ scrobble.title }}
+ <FAIcon
+ class="fa-scale-110 fa-old-padding"
+ icon="play"
+ />
+ <span class="status-rich-presence-time">
+ <Timeago
+ template-key="time.in_past"
+ :time="scrobble.created_at"
+ :auto-update="60"
+ />
+ </span>
+ </span>
+ </div>
+ <div
v-if="isReply || hasMentionsLine"
class="heading-reply-row"
>
@@ -364,6 +405,45 @@
@parseReady="setHeadTailLinks"
/>
+ <article
+ v-if="hasVisibleQuote"
+ class="quoted-status"
+ >
+ <button
+ class="button-unstyled -link display-quoted-status-button"
+ :aria-expanded="shouldDisplayQuote"
+ @click="toggleDisplayQuote"
+ >
+ {{ shouldDisplayQuote ? $t('status.hide_quote') : $t('status.display_quote') }}
+ <FAIcon
+ class="display-quoted-status-button-icon"
+ :icon="shouldDisplayQuote ? 'chevron-up' : 'chevron-down'"
+ />
+ </button>
+ <Status
+ v-if="shouldDisplayQuote"
+ :statusoid="quotedStatus"
+ :in-quote="true"
+ />
+ </article>
+ <p
+ v-else-if="hasInvisibleQuote"
+ class="quoted-status -unavailable-prompt"
+ >
+ <i18n-t keypath="status.invisible_quote">
+ <template #link>
+ <bdi>
+ <a
+ :href="status.quote_url"
+ target="_blank"
+ >
+ {{ status.quote_url }}
+ </a>
+ </bdi>
+ </template>
+ </i18n-t>
+ </p>
+
<div
v-if="inConversation && !isPreview && replies && replies.length"
class="replies"
@@ -451,14 +531,17 @@
:visibility="status.visibility"
:logged-in="loggedIn"
:status="status"
+ @click="$emit('interacted')"
/>
<favorite-button
:logged-in="loggedIn"
:status="status"
+ @click="$emit('interacted')"
/>
<ReactButton
v-if="loggedIn"
:status="status"
+ @click="$emit('interacted')"
/>
<extra-buttons
:status="status"
@@ -476,7 +559,7 @@
<UserAvatar
class="post-avatar"
:compact="compact"
- :bot="botIndicator"
+ :show-actor-type-indicator="showActorTypeIndicator"
/>
</div>
<div class="right-side">
generated by cgit v1.2.3-70-g09d2 (git 2.49.0) at 2025-12-01 20:50:33 +0000