mirror of
https://github.com/qier222/YesPlayMusic.git
synced 2025-03-01 05:24:26 +08:00
53 lines
1.5 KiB
TypeScript
53 lines
1.5 KiB
TypeScript
import TrackListHeader from '@/web/components/New/TrackListHeader'
|
|
import { NavLink, useParams } from 'react-router-dom'
|
|
import PageTransition from '@/web/components/New/PageTransition'
|
|
import TrackList from '@/web/components/New/TrackList'
|
|
import player from '@/web/states/player'
|
|
import toast from 'react-hot-toast'
|
|
import { useSnapshot } from 'valtio'
|
|
import { memo, useEffect, useMemo } from 'react'
|
|
import usePlaylist from '@/web/api/hooks/usePlaylist'
|
|
import useTracksInfinite from '@/web/api/hooks/useTracksInfinite'
|
|
|
|
const Playlist = () => {
|
|
const params = useParams()
|
|
const { data: playlist, isLoading } = usePlaylist({
|
|
id: Number(params.id),
|
|
})
|
|
|
|
const playerSnapshot = useSnapshot(player)
|
|
const onPlay = async (trackID: number | null = null) => {
|
|
if (!playlist?.playlist.id) {
|
|
toast('无法播放歌单，该歌单不存在')
|
|
return
|
|
}
|
|
|
|
if (
|
|
playerSnapshot.trackListSource?.type === 'playlist' &&
|
|
playerSnapshot.trackListSource?.id === playlist.playlist.id &&
|
|
playlist?.playlist?.trackIds?.[0].id
|
|
) {
|
|
await player.playTrack(trackID ?? playlist.playlist.trackIds[0].id)
|
|
return
|
|
}
|
|
await player.playPlaylist(playlist.playlist.id, trackID)
|
|
}
|
|
|
|
return (
|
|
<PageTransition>
|
|
<TrackListHeader
|
|
playlist={playlist?.playlist}
|
|
onPlay={onPlay}
|
|
className='mt-2.5 lg:mt-0'
|
|
/>
|
|
<TrackList
|
|
tracks={playlist?.playlist?.tracks ?? []}
|
|
onPlay={onPlay}
|
|
className='z-10 mt-10'
|
|
/>
|
|
</PageTransition>
|
|
)
|
|
}
|
|
|
|
export default Playlist
|