import React, { Component } from 'react';
import FlipCard from 'react-flipcard';
import { Flex, Box, Grid } from 'reflexbox'

export default class Flip extends Component {
  constructor(props) {
    super(props)
    this.state = {
      isFlipped: false,
    }
  }

  showBack() {
    this.setState({
      isFlipped: true,
    });
  }

  showFront() {
    this.setState({
      isFlipped: false,
    });
  }
  render() {
    const { children } = this.props

    return (
          <FlipCard
            disabled={false}
            flipped={this.state.isFlipped}
          >
            { children }
          </FlipCard>
    );
  }
}