Setup Block Controls For Profile Block

editBlockControls.js

el(BlockControls, { key: 'controls' }, // Display controls when the block is clicked on.
  el('div', { className: 'components-toolbar' },
    el(MediaUpload, {
      onSelect: onSelectImage,
      type: 'image',
      render: function (obj) {
        return el(components.Button, {
          className: 'components-icon-button components-toolbar__control',
          onClick: obj.open
        },
        // Add Dashicon for media upload button.
        el('svg', { className: 'dashicon dashicons-edit', width: '20', height: '20' },
          el('path', { d: 'M2.25 1h15.5c.69 0 1.25.56 1.25 1.25v15.5c0 .69-.56 1.25-1.25 1.25H2.25C1.56 19 1 18.44 1 17.75V2.25C1 1.56 1.56 1 2.25 1zM17 17V3H3v14h14zM10 6c0-1.1-.9-2-2-2s-2 .9-2 2 .9 2 2 2 2-.9 2-2zm3 5s0-6 3-6v10c0 .55-.45 1-1 1H5c-.55 0-1-.45-1-1V8c2 0 3 4 3 4s1-3 3-3 3 2 3 2z' })
        ))
      }
    })
  ),
  // Display alignment toolbar within block controls.
  el(AlignmentToolbar, {
    value: alignment,
    onChange: onChangeAlignment
  })
),