36 lines
947 B
TypeScript
36 lines
947 B
TypeScript
|
"use client";
|
||
|
|
||
|
import { useContext } from "react";
|
||
|
import { DanmuContext } from "./provider";
|
||
|
|
||
|
export default function SongCheck({ songs }: { songs: any[] }) {
|
||
|
const { dispatch, ...state } = useContext(DanmuContext);
|
||
|
return (
|
||
|
<ul className="divide-y divide-gray-300">
|
||
|
{songs.map((song, i) => (
|
||
|
<li key={i}>
|
||
|
<label>
|
||
|
{song.name} - {song.artist}
|
||
|
<input
|
||
|
onChange={(e) => {
|
||
|
dispatch({
|
||
|
type: "songs",
|
||
|
payload: {
|
||
|
songId: song.source_id,
|
||
|
songName: song.name,
|
||
|
songArtist: song.artist,
|
||
|
},
|
||
|
});
|
||
|
}}
|
||
|
className="raido radio-primary"
|
||
|
type="radio"
|
||
|
name="songs"
|
||
|
checked={song.source_id === state.songId}
|
||
|
/>
|
||
|
</label>
|
||
|
</li>
|
||
|
))}
|
||
|
</ul>
|
||
|
);
|
||
|
}
|