Merge branch 'neetzsche/display-latest-scrobble' into 'develop'

Display the latest scrobble under a user's name

See merge request pleroma/pleroma-fe!1865
This commit is contained in:
HJ 2023-11-10 13:31:45 +00:00
commit 60cb173b61
8 changed files with 72 additions and 2 deletions

View File

@ -0,0 +1 @@
Shows the most recent scrobble under each post when available

View File

@ -91,6 +91,11 @@
{{ $t('settings.hide_attachments_in_convo') }}
</BooleanSetting>
</li>
<li>
<BooleanSetting path="hideScrobbles">
{{ $t('settings.hide_scrobbles') }}
</BooleanSetting>
</li>
</ul>
</div>
<div

View File

@ -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)
@ -415,6 +417,12 @@ const Status = {
},
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: {

View File

@ -249,6 +249,24 @@
</button>
</span>
</div>
<div class="status-rich-presence" v-if="scrobblePresent">
<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>
</div>
<div
v-if="isReply || hasMentionsLine"
class="heading-reply-row"

View File

@ -495,6 +495,7 @@
"hide_muted_posts": "Hide posts of muted users",
"mute_bot_posts": "Mute bot posts",
"hide_bot_indication": "Hide bot indication in posts",
"hide_scrobbles": "Hide scrobbles",
"hide_all_muted_posts": "Hide muted posts",
"max_thumbnails": "Maximum amount of thumbnails per post (empty = no limit)",
"hide_isp": "Hide instance-specific panel",

View File

@ -40,6 +40,7 @@ export const defaultState = {
padEmoji: true,
hideAttachments: false,
hideAttachmentsInConv: false,
hideScrobbles: false,
maxThumbnails: 16,
hideNsfw: true,
preloadImage: true,

View File

@ -47,6 +47,7 @@ const emptyNotifications = () => ({
export const defaultState = () => ({
allStatuses: [],
scrobblesNextFetch: {},
allStatusesObject: {},
conversationsObject: {},
maxId: 0,
@ -120,8 +121,24 @@ const sortTimeline = (timeline) => {
return timeline
}
const getLatestScrobble = (state, user) => {
if (state.scrobblesNextFetch[user.id] && state.scrobblesNextFetch[user.id] > Date.now()) {
return
}
state.scrobblesNextFetch[user.id] = Date.now() + 24 * 60 * 60 * 1000
apiService.fetchScrobbles({ accountId: user.id }).then((scrobbles) => {
if (scrobbles.length > 0) {
user.latestScrobble = scrobbles[0]
state.scrobblesNextFetch[user.id] = Date.now() + 60 * 1000
}
})
}
// Add status to the global storages (arrays and objects maintaining statuses) except timelines
const addStatusToGlobalStorage = (state, data) => {
getLatestScrobble(state, data.user)
const result = mergeOrAdd(state.allStatuses, state.allStatusesObject, data)
if (result.new) {
// Add to conversation

View File

@ -107,6 +107,7 @@ const PLEROMA_ANNOUNCEMENTS_URL = '/api/v1/pleroma/admin/announcements'
const PLEROMA_POST_ANNOUNCEMENT_URL = '/api/v1/pleroma/admin/announcements'
const PLEROMA_EDIT_ANNOUNCEMENT_URL = id => `/api/v1/pleroma/admin/announcements/${id}`
const PLEROMA_DELETE_ANNOUNCEMENT_URL = id => `/api/v1/pleroma/admin/announcements/${id}`
const PLEROMA_SCROBBLES_URL = id => `/api/v1/pleroma/accounts/${id}/scrobbles`
const PLEROMA_ADMIN_CONFIG_URL = '/api/pleroma/admin/config'
const PLEROMA_ADMIN_DESCRIPTIONS_URL = '/api/pleroma/admin/config/descriptions'
@ -1765,6 +1766,23 @@ const installFrontend = ({ credentials, payload }) => {
})
}
const fetchScrobbles = ({ accountId, limit = 1 }) => {
let url = PLEROMA_SCROBBLES_URL(accountId)
const params = [['limit', limit]]
const queryString = map(params, (param) => `${param[0]}=${param[1]}`).join('&')
url += `?${queryString}`
return fetch(url, {})
.then((response) => {
if (response.ok) {
return response.json()
} else {
return {
error: response
}
}
})
}
const apiService = {
verifyCredentials,
fetchTimeline,
@ -1878,6 +1896,7 @@ const apiService = {
postAnnouncement,
editAnnouncement,
deleteAnnouncement,
fetchScrobbles,
adminFetchAnnouncements,
fetchInstanceDBConfig,
fetchInstanceConfigDescriptions,