import {
	observer,
} from 'mobx-react';
import { i18n } from '../../../../public/i18n.js'

@observer
export default class Revoke extends React.Component {
	constructor(props) {
		super(props);

		this.datas = [{
			key: "undo",
			icon: "icon-coms-Revoke2",
			name: i18n.label.undo()
		}, {
			key: "redo",
			icon: "icon-coms-redo",
			name: i18n.label.redo()
		}]
	}

	render() {
		const {
			store
		} = this.props, {
			can_undo,
			can_redo,
			handleUndoRedoClick
		} = store;

		return (
			<ul className="anticons-list" >
				{this.datas.map( (data,index) => {
					const enabled = (index == 0) ? can_undo : can_redo;
					const { key, icon, name } = data;
					const title = `${name} ${(index == 0) ? 'Ctrl+Z' : 'Ctrl+Y'}`
					return (
						<li key={key} onClick={() => handleUndoRedoClick(key)} className={enabled ? "" : "disabled" } title={title}>
							<i className={icon} />
							<p>{name}</p>
						</li>
						)
					}
				)}
			</ul>
		);
	}
}