extraButton.js

import _ from 'lodash';
import PropTypes from 'prop-types';
import React, { Fragment } from 'react';

import { BlockControls } from '@wordpress/block-editor';
import { isUnmodifiedDefaultBlock } from '@wordpress/blocks';
import {
	ToolbarButton,
	ToolbarGroup,
} from '@wordpress/components';
import { createHigherOrderComponent } from '@wordpress/compose';
import { select } from '@wordpress/data';
import { __ } from '@wordpress/i18n';

const ExtraBlockButton = createHigherOrderComponent( BlockEdit => {
	const BlockEditWithInspectorControls = props => {
		const {
			getSelectedBlockCount,
			getSelectedBlockClientId,
			getMultiSelectedBlockClientIds,
			getTemplateLock
		} = select( 'core/block-editor' );
		const blockSelection = getSelectedBlockCount() > 1
			? getMultiSelectedBlockClientIds()
			: [ getSelectedBlockClientId() ];
		const isSelected = _.head( blockSelection ) === props.clientId;
		const isTyping = select( 'core/block-editor' ).isTyping();
		const isCaretWithinFormattedText = select( 'core/block-editor' ).isCaretWithinFormattedText();
		const isTypingWithinBlock = props.isSelected && ( isTyping || isCaretWithinFormattedText );
		const isTemplateLocked = getTemplateLock();

		const isDefaultBlock = isUnmodifiedDefaultBlock( {
			name: props.name,
			attributes: props.attributes,
		} );
		
		const show = ( ! isTemplateLocked && isSelected && ! isTypingWithinBlock && ! isDefaultBlock );

		return (
			<Fragment>
				{ show && (
					<BlockControls>
						<ToolbarGroup>
							<ToolbarButton
								icon="smiley"
							/>
						</ToolbarGroup>
					</BlockControls>
				) }
				<BlockEdit { ...props } />
			</Fragment>
		);
	};

	return BlockEditWithInspectorControls;

}, 'ExtraBlockButton' );

addFilter(
    'editor.BlockListBlock',
    'hm/extra-button',
    ExtraBlockButton,
    1000000
);