/**
 * WordPress dependencies
 */
import { PanelBody } from '@safe-wordpress/components';
import { _x } from '@safe-wordpress/i18n';

/**
 * Internal dependencies
 */
import './style.scss';
import { DateInfo } from './date-info';
import { GA4Tracking } from './ga4-tracking';
import { Metrics } from './metrics';
import { useExperimentAttribute } from '../../hooks';

export const Summary = (): JSX.Element => {
	const dates = {
		start: useExperimentAttribute( 'startDate' ) ?? '',
		end: useExperimentAttribute( 'endDate' ) ?? false,
		endMode: useExperimentAttribute( 'endMode' ) ?? 'manual',
		endValue: useExperimentAttribute( 'endValue' ) ?? 0,
	};

	return (
		<PanelBody
			className="nab-experiment-summary"
			title={ _x( 'Summary', 'text (experiment)', 'nelio-ab-testing' ) }
		>
			<Metrics />
			<DateInfo { ...dates } />
			<GA4Tracking />
		</PanelBody>
	);
};