How to use the medium-editor.extensions function in medium-editor

import React from 'react'
import ReactDOM from 'react-dom'
import MediumEditor from 'medium-editor'
import ReactTooltip from 'react-tooltip'
import TooltipContent from './TooltipContent'

const LinkPreview = MediumEditor.extensions.anchorPreview.extend({
  name: 'link-preview',
  handleEditableMouseover: function (event) {
    const target = MediumEditor.util.getClosestTag(event.target, 'a');

    if (target === false) {
      return null
    }
    // Detect empty href attributes
    // The browser will make href="" or href="#top"
    // into absolute urls when accessed as event.target.href, so check the html
    if (!this.showOnEmptyLinks && (!/href=["']\S+["']/.test(target.outerHTML) || /href=["']#\S+["']/.test(target.outerHTML))) {
      return true
    }
    // only show when toolbar is not present
    const toolbar = this.base.getExtensionByName('toolbar');
    if (!this.showWhenToolbarIsVisible && toolbar && toolbar.isDisplayed && toolbar.isDisplayed()) {

const anchorExtension = this.base.getExtensionByName(anchorEl.getAttribute('data-linktype') === 'document' ? 'linkdoc' : 'link')
      if (anchorExtension) {
        event.preventDefault()
        this.base.selectElement(anchorEl)
        // Using setTimeout + delay because:
        // We may actually be displaying the anchor form, which should be controlled by delay
        this.base.delay(() => {
          anchorExtension.showModalWorkflow(anchorEl.getAttribute('data-parent-id'), anchorEl.getAttribute('href'))
        })
      }
    }
    this.hidePreview()
  },
})

MediumEditor.extensions.linkPreview = LinkPreview

export default LinkPreview

data['text/plain'] = legacyText;
    }
  }

  if (dataTransfer.types) {
    for (var i = 0; i < dataTransfer.types.length; i++) {
      var contentType = dataTransfer.types[i];
      data[contentType] = dataTransfer.getData(contentType);
    }
  }

  return data;
}


export const CustomPasteHandler = MediumEditor.extensions.paste.extend({
    cleanPastedHTML: true,
    forcePlainText: true,
    cleanPastedHTML: true,
    cleanReplacements: [[//gi, '']],
    cleanAttrs: ['class', 'dir', 'style', 'name', 'id'],
    cleanTags: [
      'label', 'meta', 'aside', 'h1',
      'span', 'code', 'pre', 'img', 'code',
    ],
    handlePaste: function (event) {
      event.preventDefault();
      let html = '';
      let data = getClipboardContent(event, this.window, this.document);
      let pastedHTML = data['text/html'];
      let pastedPlain = data['text/plain'];
      console.log(pastedHTML);

}
  }, 100);
}

setInterval(function() {
  var view = window.location.hash.split('/')[1];
  if(view === 'edit') {
    //update();
  } else if(view === 'add') {
    //add();
  }
}, 5000);

var addedContent = document.querySelector('#addContainer .editable');
var updatedContent = document.querySelector('#editContainer .editable');
var CodeButton = MediumEditor.extensions.button.extend({
  name: 'code',
  contentDefault: 'code',
  action: 'code',
  tagNames: ['code'],
  init: function() {
    MediumEditor.extensions.button.prototype.init.call(this);
    this.classApplier = rangy.createCssClassApplier('code', {
      elementTagName: 'code',
      normalize: true
    });
  },
  handleClick: function(e) {
    this.classApplier.toggleSelection();
  }
});
var editor = new MediumEditor('.editable', {

init: function() {
    MediumEditor.extensions.button.prototype.init.call(this);
    this.classApplier = rangy.createCssClassApplier('code', {
      elementTagName: 'code',
      normalize: true
    });
  },
  handleClick: function(e) {