Need manage editMode state

EditableItem.js

import PropTypes from 'prop-types';
import React, { Component, Fragment } from 'react';
import EditModeItem from './EditModeItem';
import './style.scss';
import ViewModeItem from './ViewModeItem';

export default class EditableItem extends Component {
  constructor(props) {
    super(props);
    this.state = { editMode: false };
  }

  render() {
    return (
      <Fragment>
        {this.state.editMode ? (
          <EditModeItem
            data={this.props.data}
            onCancel={() => this.setState({ editMode: false })}
          />
        ) : (
          <ViewModeItem
            data={this.props.data}
            onEdit={() => this.setState({ editMode: true })}
          />
        )}
        <div className="editable-item-divider" />
      </Fragment>
    );
  }
}

EditableItem.propTypes = {
  data: PropTypes.object.isRequired
};