import {showToast} from "@/components/message.ts";
import {useState} from "react";
import {push2article} from "@/service/api/news.ts";
import {IconArrowRight} from "@/components/icons";
import {useNavigate} from "react-router-dom";
import {useIndexArrayCache} from "@/hooks/useCache.ts";
import {useTranslation} from "react-i18next";

export default function ButtonPushNews2Article(props: { ids: Id[]; }) {
	// const {modal} = App.useApp();
	const {t}= useTranslation()
	const [loading,setLoading] = useState(false)
	const navigate = useNavigate();
	const {set} = useIndexArrayCache();
	const handlePush = () => {
		setLoading(true)
		push2article(props.ids).then(() => {
			showToast(t('news.push_success'), 'success')
			set([])
			navigate('/edit')
		}).catch(() => {
			showToast(t('news.push_failed'), 'error')
		}).finally(() => {
			setLoading(false)
		})
	}
	const onPushClick = () => {
		if(loading) return;
		if (props.ids.length === 0) {
			showToast(t('news.push_empty'), 'warning')
			return
		}
		handlePush();
		// modal.confirm({
		// 	title: '操作提示',
		// 	content: '是否确定推入素材编辑界面？',
		// 	onOk: handlePush,
		// 	centered: true
		// })
	}
	return (
		<button
			disabled={loading}
			onClick={onPushClick}
			className='bg-[#4096ff] hover:bg-blue-600 text-white'
		>
			<span className={'text'}>{t('news.push_to_edit')}</span>
			<IconArrowRight className={'text-white'} />
		</button>
	)
}