import * as React from 'react';
import { ValidationRule, Validation, ValidationState } from '../../models/Validation';
import { Colors } from '../../models/colors';
import { RadioButtonProps } from '../../containers/radio-button/RadioButton';
import FlatRadioButton from '../../components/radio-buttons/flat-radio-button/FlatRadioButton';

interface TimeAtAddressProps {
	name: string;
	label?: string;
	type?: string;
	validationStates?: { [name: string]: Validation };
	validationRules?: Array<ValidationRule>;
	required?: boolean;
	palette?: Colors;
	automationName?: string;
	defaultOption?: string;
	value?: boolean;
	radioButtons?: React.ReactElement<RadioButtonProps>;
	onChange?: (name: string, value: string) => void;
	setTimeAtAddress?: (more: any) => void;
	notifyValidity?: (name: string, state: ValidationState, errorMessage?: string) => void;
	translator?: Function;
	checkIfTranslateExist?: Function;
}

const TimeAtAddress = (props: TimeAtAddressProps) => {
	const name = props.name || 'time-at-address';
	let errorMessage;
	let valid;
	let value = props.value + '';
	let options = [
		{ label: props.translator(`addresses.timeAtAddress.less`), id: 'false' },
		{ label: props.translator(`addresses.timeAtAddress.more`), id: 'true' }
	];
	if (props.validationStates) {
		if (props.validationStates[name]) {
			errorMessage = props.validationStates[name].errorMessage;
			valid = props.validationStates[name].state;
		}
	}

	return React.cloneElement(props.radioButtons || <FlatRadioButton />, {
		automationName: props.automationName || props.name,
		label: props.translator(`addresses.timeAtAddress.label`),
		onChange: props.onChange,
		name,
		valid,
		errorMessage,
		validationRules: props.validationRules || [{ name: 'required' }],
		notifyValidity: props.notifyValidity,
		palette: props.palette,
		value,
		required: props.required,
		options,
		selectedRadio: value || props.defaultOption,
		translator: props.translator
	});
};

export default TimeAtAddress;