Destroy editor but does not delete the editor object.

Hello, I've created a wrapper Component of grapesjs for React.

// @flow

import React from 'react';
import GrapesJS from 'grapesjs';
// Presets
import gjsPresetWebpage from 'grapesjs-preset-webpage';
import gjsPresetNewsletter from 'grapesjs-preset-newsletter';
// Plugins
import gjsCustomCode from 'grapesjs-custom-code';
import gjsForms from 'grapesjs-plugin-forms';

import type {GrapesPluginType} from '../types/grapes';
import GComponent from './GComponent';

const {Component} = React;

type Props = {
  components: Array<GComponent>,
  plugins: Array<GrapesPluginType>,
  // Preset and plugin options
  webpage: boolean,
  newsletter: boolean,
  forms: boolean,
  ckeditor: boolean,
  customCode: boolean,
  // Editor configurations
  storageManager: {},
  blockManager: {},
}

type State = {}

class GEditor extends Component<Props, State> {
  /**
   * Component default props
   *
   * @type {Props}
   */
  static defaultProps: Props = {
    components: [],
    plugins: [],
    // Presets and plugins
    webpage: false,
    newsletter: true,
    forms: true,
    ckeditor: false,
    customCode: true,
    // Configurations
    storageManager: {},
    blockManager: {},
  };

  /**
   * Class editor id prefix
   *
   * @type {string}
   */
  static idPrefix: string = `gjs-editor-`;

  /**
   *
   * @param id
   * @returns {*}
   */
  static getEditorByIn = (id: number) => {
    return GrapesJS.editors[id];
  };

  /**
   * Editor container id
   *
   * @type {number}
   */
  id: number;

  /**
   * Get editor id
   *
   * @returns {string}
   */
  getId: Function = () => `gjs-react-editor-${this.id}`;

  /**
   * Get editor instance
   *
   * @returns {Object}
   */
  getEditor: Function = () => {
    return GrapesJS.editors[this.id] || null;
  };

  /**
   * Initialize new editor with configurations from props
   */
  initEditor: Function = () => {
    const id: string = this.getId();
    const {plugins, webpage, newsletter, forms, customCode, storageManager} = this.props;
    // Add preset
    if (webpage) {
      plugins.push(gjsPresetWebpage);
    }
    if (newsletter) {
      plugins.push(gjsPresetNewsletter);
    }
    // Add plugins
    if (forms) {
      plugins.push(gjsForms);
    }
    if (customCode) {
      plugins.push(gjsCustomCode);
    }
    GrapesJS.init({
      fromElement: true,
      autorender: false,
      container: `#${id}`,
      plugins,
      storageManager,
    });
  };

  /**
   * Destroy editor on component unmount
   */
  destroyEditor: Function = () => {
    this.getEditor().destroy();
    delete GrapesJS.editors[this.id];
  };

  constructor(props: Props) {
    super(props);
    this.id = GrapesJS.editors.length;
  }

  componentDidMount() {
    this.initEditor();
    this.getEditor().render();
  }

  componentWillUnmount() {
    this.destroyEditor();
    console.log('Called editor destroy');
  }

  render() {
    const id: string = this.getId();
    return (
      <div className="grapesjs-editor">
        <div id={id}/>
      </div>
    );
  }
}

// window global variables
window.grapesjs = window.GrapesJS = GrapesJS;

export default GEditor;

When the component is unmounted, it will destroy the editor by calling the destroy method. When my app render a new editor. (User goes back from 2 to 1, then go to 2 again, see my screenshot), the old destroyed editor seems to still exists. It affects to the rendering of the new one.

In console, I found out that the destroy method does not delete the editor instance, it just can not be re-rendered but it still exists. If the app continues to render new ones, it will continue to render wrong again and again...

Did I do something wrong or Is it a bug?

Thanks for your help!