How to use cytoscape-context-menus - 2 common examples

import contextMenus from "cytoscape-context-menus";
import edgeBendEditing from "cytoscape-edge-bend-editing";
import undoRedo from "cytoscape-undo-redo";
import viewUtilities from "cytoscape-view-utilities";
import jquery from "jquery";
// var cytoscape = require('cytoscape')
// var cytoscape_grid = require('cytoscape-grid-guide')
// var edgehandles = require('cytoscape-edgehandles')
// var contextMenus = require('cytoscape-context-menus')
// var edgeBendEditing = require('cytoscape-edge-bend-editing')
// var undoRedo = require('cytoscape-undo-redo')
// var viewUtilities = require('cytoscape-view-utilities')
// var jquery = require('jquery')
window.$ = jquery;
cytoscape_grid(cytoscape, jquery);
contextMenus(cytoscape, jquery);
edgeBendEditing(cytoscape, jquery);
undoRedo(cytoscape);
viewUtilities(cytoscape, jquery);
cytoscape.use(edgehandles);
export {
  cytoscape,
  cytoscape_grid,
  edgehandles,
  contextMenus,
  edgeBendEditing,
  undoRedo,
  viewUtilities,
  jquery
};

import React, { Component, PropTypes } from 'react'

import cytoscape from 'cytoscape'
import jquery from 'jquery'
import contextMenus from 'cytoscape-context-menus'
contextMenus(cytoscape, jquery)

import cycola from 'cytoscape-cola'
import cola from 'cola'
cycola(cytoscape, cola)
import './Graph.css'

class Graph extends Component {
  constructor () {
    super()
    this.state = {
      cy: null
    }
  }

  componentDidMount () {
    console.log('setting up cytoscape...', this.refs.graph)