import { Button } from '@wordpress/components';
import { Icon, search } from '@wordpress/icons';
import { __ } from '@wordpress/i18n';
import {
	CSS_STATE_CONTENT,
	CSS_HEADING,
	CSS_SUBTEXT,
	CSS_PRIMARY_BUTTON,
} from '../../shared/constants';

export const DefaultView = ({ onSubmit, disabled }: DefaultViewProps) => {
	return (
		<div className={CSS_STATE_CONTENT}>
			<h2 className={CSS_HEADING}>
				{__('Legal Risk Review', 'cleardraft')}
			</h2>
			<p className={CSS_SUBTEXT}>
				{__(
					'Submit your content for legal analysis. We will check for potential defamation, privacy violations, and other legal issues.',
					'cleardraft',
				)}
			</p>
			<Button
				className={CSS_PRIMARY_BUTTON}
				onClick={onSubmit}
				disabled={disabled}
				icon={<Icon icon={search} size={18} />}
			>
				{__('Run Analysis', 'cleardraft')}
			</Button>
		</div>
	);
};

interface DefaultViewProps {
	onSubmit: () => void;
	disabled: boolean;
}