import {
	observer
} from 'mobx-react';
import ButtonIcons from './ButtonIcons';
import Table from './Table';
import ConfigurableForm from '../../public/ConfigurableForm';

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

	render() {
		const {
			store,
			isMain,
		} = this.props, {
			configurableForm,
			linkage,
			onFormChange,
		} = store;

		if (isMain) {
			return (
				<div className='dialog-content'>
					<div className='button-icon-wrapper'>
						<ButtonIcons ecId={`${this && this.props && this.props.ecId || ''}_ButtonIcons@ngahqu`} store={store}/>
					</div>
					<div className ='table-wrapper'>
						<Table ecId={`${this && this.props && this.props.ecId || ''}_Table@m4x0pc`} store={store}/>
					</div>
				</div>
			);
		} else {
			return (
				<div className='form-wrapper'>
					<ConfigurableForm ecId={`${this && this.props && this.props.ecId || ''}_ConfigurableForm@zas7ho`} {...configurableForm} linkage={linkage} onFormChange={datas => onFormChange(datas)}/>
				</div>
			)
		}
	}
}