Spaces:
Running
Running
File size: 1,712 Bytes
63769e0 f42b4a1 ac7030c 3d4392e f42b4a1 63769e0 8f2b05f 63769e0 f8ca042 63769e0 8f2b05f 63769e0 8f2b05f 63769e0 8f2b05f 3d4392e 63769e0 3d4392e 63769e0 8f2b05f e3d26ad 63769e0 ac7030c d5b583f f8ca042 63769e0 f8ca042 63769e0 f8ca042 63769e0 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 |
"use client"
import { useEffect, useTransition } from "react"
import { useStore } from "@/app/state/useStore"
import { cn } from "@/lib/utils/cn"
import { MediaInfo } from "@/types/general"
import { getVideos } from "@/app/api/actions/ai-tube-hf/getVideos"
import { TrackList } from "@/components/interface/track-list"
import { PlaylistControl } from "@/components/interface/playlist-control"
import { usePlaylist } from "@/lib/hooks/usePlaylist"
export function PublicMusicVideosView() {
const [_isPending, startTransition] = useTransition()
const setView = useStore(s => s.setView)
const setPublicTracks = useStore(s => s.setPublicTracks)
const setPublicTrack = useStore(s => s.setPublicTrack)
const publicTracks = useStore(s => s.publicTracks)
const playlist = usePlaylist()
useEffect(() => {
/*
startTransition(async () => {
const newTracks = await getVideos({
sortBy: "date",
mandatoryTags: ["music"],
maxNbMedias: 25
})
setPublicMedias(newTracks)
})
*/
}, [])
const handleSelect = (media: MediaInfo) => {
// console.log("going to play:", media.assetUrl.replace(".mp4", ".mp3"))
playlist.playback({
url: media.assetUrl.replace(".mp4", ".mp3"),
meta: media,
isLastTrackOfPlaylist: false,
playNow: true,
})
}
return (
<div className={cn(
`w-full h-full`
)}>
<div className="flex flex-col w-full overflow-y-scroll h-[calc(100%-80px)] sm:pr-4">
<TrackList
items={publicTracks}
onSelect={handleSelect}
selectedId={playlist.current?.id}
layout="table"
/>
</div>
<PlaylistControl />
</div>
)
} |