import { Form, Input, Modal, message } from 'antd';
import { useState } from 'react';
import { ApiError } from '../../api/client';
import { postComment } from '../../services/api/documents';

type CommentModalProps = { documentId: string; open: boolean; onClose: () => void };

export default function CommentModal({ documentId, open, onClose }: CommentModalProps) {
	const [comment, setComment] = useState('');
	const [saving, setSaving] = useState(false);
	const close = () => {
		setComment('');
		onClose();
	};
	const handleOk = async () => {
		setSaving(true);
		try {
			await postComment(documentId, comment.trim());
			message.success('Комментарий добавлен');
			close();
		} catch (e: unknown) {
			// окно не закрываем: текст не теряется, можно повторить
			message.error(e instanceof ApiError ? e.message : 'Не удалось добавить комментарий');
		} finally {
			setSaving(false);
		}
	};
	return (
		<Modal
			title='Добавить комментарий'
			okText='Добавить'
			onOk={handleOk}
			okButtonProps={{ disabled: comment.trim().length === 0 }}
			confirmLoading={saving}
			open={open}
			cancelText='Отмена'
			onCancel={close}
			destroyOnHidden>
			<Form layout='vertical'>
				<Form.Item label={<span style={{ fontWeight: 600 }}>Комментарий</span>}>
					<Input.TextArea
						value={comment}
						onChange={(e) => setComment(e.target.value)}
						autoSize={{ minRows: 3 }}
						maxLength={4000}
						placeholder='Опишите результат проверки или внесенные правки'
					/>
				</Form.Item>
			</Form>
		</Modal>
	);
}