"use client";

import { useContext } from "react";
import { DanmuContext } from "./provider";

export default function LiveCheck({ lives }: { lives: any[] }) {
  const { dispatch, ...state } = useContext(DanmuContext);
  return (
    <ul className="divide-y divide-gray-300">
      {lives.map((live, i) => (
        <li key={i}>
          <label>
            {live.name} - {live.room_id}
            <input
              onChange={(e) => {
                dispatch({
                  type: "lives",
                  payload: {
                    liveId: live.room_id,
                    liveName: live.name,
                  },
                });
              }}
              className="raido radio-primary"
              type="radio"
              name="live"
              checked={live.room_id === state.liveId}
            />
          </label>
        </li>
      ))}
    </ul>
  );
}
