import React, { Component } from 'react';

import { ButtonBar, Button, Alert } from './index.js';


class DetailButtons extends Component {


	constructor(props) {
		super(props);
		this.handleDelete = this.handleDelete.bind(this);
	}


	handleDelete() {
		Alert.alert(
			this.props.deleteModalTitle || "Delete", 
			this.props.deleteModalQuestion || "Are you sure you want to delete this item?", 
			[{ text: 'No' }, {text: 'Yes', primary: true, onPress: () => {
					typeof this.props.onDelete == "function" && this.props.onDelete()
				}}
			])
	}


	render() {
		let disabled = this.props.disabled;
		let status = this.props.status || {};
		return (
			<ButtonBar>
				{ this.props.cancel ? (
					<Button 
						disabled={ disabled || this.props.cancelDisabled }
						loading={ status.isCancelling || this.props.cancelLoading }
						title={ this.props.cancelTitle || "Back" }
						onPress={ typeof this.props.onCancel == "function" ? () => this.props.onCancel() : null }
						/>
					) : null }

				{ this.props.delete ? (
					<Button 
						disabled={ disabled || this.props.deleteDisabled }
						loading={ status.isDeleting || this.props.deleteLoading }
						title={ this.props.deleteTitle || "Delete" }
						onPress={ this.handleDelete }
						/>
					) : null }
				
				{ this.props.children }

				{ this.props.save ? (
					<Button 
						disabled={ disabled || this.props.saveDisabled }
						loading={ status.isSaving || this.props.saveLoading }
						title={ this.props.saveTitle || "Save" }
						onPress={ typeof this.props.onSave == "function" ? () => this.props.onSave() : null }
						/>
					) : null }
			</ButtonBar>
		);
	}

}


export default DetailButtons;