diff --git a/src/plugins/music-together/index.ts b/src/plugins/music-together/index.ts index d066e1de..755440e7 100644 --- a/src/plugins/music-together/index.ts +++ b/src/plugins/music-together/index.ts @@ -125,10 +125,12 @@ export default createPlugin< if (this.connection?.mode === 'host') { const videoList: VideoData[] = this.queue?.flatItems.map( - (it) => + (it, index) => ({ videoId: it!.videoId, - ownerId: this.connection!.id, + ownerId: + this.queue?.videoList[index]?.ownerId ?? + this.connection!.id, }) satisfies VideoData, ) ?? []; @@ -212,6 +214,7 @@ export default createPlugin< event: ConnectionEventUnion, conn?: DataConnection | null, ) => { + console.log('event', event, this.queue?.videoList); this.ignoreChange = true; switch (event.type) { diff --git a/src/plugins/music-together/queue/queue.ts b/src/plugins/music-together/queue/queue.ts index 72603d0e..3f6f6d0a 100644 --- a/src/plugins/music-together/queue/queue.ts +++ b/src/plugins/music-together/queue/queue.ts @@ -3,8 +3,9 @@ import { mapQueueItem } from './utils'; import { t } from '@/i18n'; +import { getDefaultProfile, type Profile, type VideoData } from '../types'; + import type { ConnectionEventUnion } from '@/plugins/music-together/connection'; -import type { Profile, VideoData } from '../types'; import type { QueueItem } from '@/types/datahost-get-state'; import type { QueueElement, Store } from '@/types/queue'; @@ -177,37 +178,46 @@ export class Queue { if (!items) return false; this.internalDispatch = true; - this._videoList = mapQueueItem( + this._videoList = this._videoList.map( (it) => ({ - videoId: it!.videoId, - ownerId: this.owner!.id, + videoId: it.videoId, + ownerId: it.ownerId ?? this.owner!.id, }) satisfies VideoData, - this.queue.queue.getItems(), - ); - this._videoList.splice( - index ?? this._videoList.length, - 0, - ...videos.map((it) => ({ - ...it, - ownerId: it.ownerId ?? this.owner?.id, - })), ); + const state = this.queue.queue.store.store.getState(); + this.queue?.dispatch({ type: 'ADD_ITEMS', payload: { - nextQueueItemId: - this.queue.queue.store.store.getState().queue.nextQueueItemId, + nextQueueItemId: state.queue.nextQueueItemId, index: index ?? - this.queue.queue.store.store.getState().queue.items.length ?? + (state.queue.items.length ? state.queue.items.length - 1 : null) ?? 0, items, shuffleEnabled: false, shouldAssignIds: true, }, }); + + const insertedItem = this._videoList[index ?? this._videoList.length]; + if ( + !insertedItem || + (insertedItem.videoId !== videos[0].videoId && + insertedItem.ownerId !== videos[0].ownerId) + ) { + this._videoList.splice( + index ?? this._videoList.length, + 0, + ...videos.map((it) => ({ + ...it, + ownerId: it.ownerId ?? this.owner?.id, + })), + ); + } + this.internalDispatch = false; setTimeout(() => { this.initQueue(); @@ -364,7 +374,15 @@ export class Queue { } ).items, ); - this._videoList.push( + this._videoList.splice( + event.payload && Object.hasOwn(event.payload, 'index') + ? ( + event.payload as { + index: number; + } + ).index + : this._videoList.length, + 0, ...videoList.map((it) => ({ ...it, ownerId: it.ownerId ?? this.owner?.id, @@ -516,14 +534,16 @@ export class Queue { allQueue.forEach((queue) => { const list = Array.from( - queue?.querySelectorAll('ytmusic-player-queue-item') ?? [], + queue?.querySelectorAll( + '#contents > ytmusic-player-queue-item,#contents > ytmusic-playlist-panel-video-wrapper-renderer > #primary-renderer > ytmusic-player-queue-item', + ) ?? [], ); list.forEach((item, index: number | undefined) => { if (typeof index !== 'number') return; const id = this._videoList[index]?.ownerId; - const data = this.getProfile(id); + let data = this.getProfile(id); const profile = item.querySelector('.music-together-owner') ?? @@ -539,6 +559,10 @@ export class Queue { name.textContent = data?.name ?? t('plugins.music-together.internal.unknown-user'); + if (!data?.name && !data?.handleId) { + data = getDefaultProfile(data?.id ?? ''); + } + if (data) { profile.dataset.thumbnail = data.thumbnail ?? ''; profile.dataset.name = data.name ?? '';