import {Button, Modal} from "antd";
import React, {useState} from "react";
import {showErrorToast, showToast} from "@/components/message.ts";
import {push2room, VideoStatus} from "@/service/api/video.ts";
import {IconArrowRight, IconWarningCircle} from "@/components/icons";


export default function ButtonPush2Room(props: { ids: Id[]; list: VideoInfo[];onSuccess?:()=>void; }) {
	const [loading, setLoading] = useState(false)
	const handlePush = () => {
		setLoading(true)
		// 只需要已经生成视频的数据id
		const vids = props.list.filter(v => v.status == VideoStatus.Generated && props.ids.includes(v.id)).map(v => v.id)
		push2room(vids).then(() => {
			props.onSuccess?.()
			if(props.ids.length == vids.length){
				showToast('一键推流成功，已推流至数字人直播间，请前往数字人直播间页面查看！', 'success')
			}else{
				showToast('选择视频中有部分视频还在生成中无法推送,推流成功视频前往数字人直播间页面查看！', 'success')
			}
		}).catch(showErrorToast).finally(() => {
			setLoading(false)
		})
	}
	const onPushClick = () => {
		if(loading) return;
		if (props.ids.length === 0) {
			showToast('请选择要推流的新闻', 'warning')
			return
		}
		Modal.confirm({
			wrapClassName:'root-modal-confirm',
			title: '操作提示',
			icon: <span className="anticon anticon-exclamation-circle"><IconWarningCircle/></span>,
			content: '是否确定一键推流选中新闻视频？？',
			onOk: handlePush
		})
	}
	return (

		<div>
			<button
				disabled={loading}
				className='bg-[#4096ff] hover:bg-blue-600 text-white'
				onClick={onPushClick}
			>
				<span className={'text'}>一键推流</span>
				<IconArrowRight />
			</button>
		</div>
	)
}