115 lines
2.7 KiB
JavaScript
115 lines
2.7 KiB
JavaScript
/**
|
|
* WP Agentic Writer - Block Toolbar Chat Mention
|
|
*
|
|
* Adds "@chat" button to block toolbar to insert the block mention into chat input.
|
|
*
|
|
* @package WP_Agentic_Writer
|
|
*/
|
|
|
|
( function ( wp ) {
|
|
const { BlockControls } = wp.blockEditor;
|
|
const { ToolbarButton, ToolbarGroup } = wp.components;
|
|
const { createHigherOrderComponent } = wp.compose;
|
|
const { useSelect } = wp.data;
|
|
const { addFilter } = wp.hooks;
|
|
const { __ } = wp.i18n;
|
|
|
|
const buildMentionToken = ( block, allBlocks ) => {
|
|
if ( ! block ) {
|
|
return '@this';
|
|
}
|
|
|
|
if ( block.name === 'core/list-item' ) {
|
|
let listIndex = 0;
|
|
|
|
for ( const parent of allBlocks ) {
|
|
if ( parent.name !== 'core/list' ) {
|
|
continue;
|
|
}
|
|
|
|
listIndex += 1;
|
|
const innerItems = Array.isArray( parent.innerBlocks ) ? parent.innerBlocks : [];
|
|
const itemIndex = innerItems.findIndex( ( item ) => item.clientId === block.clientId );
|
|
if ( itemIndex !== -1 ) {
|
|
return `@list-${ listIndex }.list-item-${ itemIndex }`;
|
|
}
|
|
}
|
|
}
|
|
|
|
if ( ! block.name || ! block.name.startsWith( 'core/' ) ) {
|
|
return '@this';
|
|
}
|
|
|
|
const typeName = block.name.replace( 'core/', '' );
|
|
let count = 0;
|
|
|
|
for ( const entry of allBlocks ) {
|
|
if ( ! entry.name || ! entry.name.startsWith( 'core/' ) ) {
|
|
continue;
|
|
}
|
|
|
|
if ( entry.name.replace( 'core/', '' ) === typeName ) {
|
|
count += 1;
|
|
}
|
|
|
|
if ( entry.clientId === block.clientId ) {
|
|
break;
|
|
}
|
|
}
|
|
|
|
return `@${ typeName }-${ count }`;
|
|
};
|
|
|
|
const withChatMentionToolbar = createHigherOrderComponent( ( BlockEdit ) => {
|
|
return ( props ) => {
|
|
const { clientId } = props;
|
|
const block = useSelect(
|
|
( select ) => select( 'core/block-editor' ).getBlock( clientId ),
|
|
[ clientId ]
|
|
);
|
|
const allBlocks = useSelect(
|
|
( select ) => select( 'core/block-editor' ).getBlocks(),
|
|
[]
|
|
);
|
|
const mentionToken = buildMentionToken( block, allBlocks );
|
|
|
|
const sendToChat = () => {
|
|
window.dispatchEvent(
|
|
new CustomEvent( 'wpaw:insert-mention', {
|
|
detail: {
|
|
token: `${ mentionToken } `,
|
|
blockId: block?.clientId || clientId,
|
|
},
|
|
} )
|
|
);
|
|
};
|
|
|
|
return wp.element.createElement(
|
|
wp.element.Fragment,
|
|
null,
|
|
wp.element.createElement( BlockEdit, props ),
|
|
wp.element.createElement(
|
|
BlockControls,
|
|
null,
|
|
wp.element.createElement(
|
|
ToolbarGroup,
|
|
null,
|
|
wp.element.createElement( ToolbarButton, {
|
|
icon: 'format-chat',
|
|
label: __( 'Send to chat', 'wp-agentic-writer' ),
|
|
onClick: sendToChat,
|
|
children: '@chat',
|
|
} )
|
|
)
|
|
)
|
|
);
|
|
};
|
|
}, 'withChatMentionToolbar' );
|
|
|
|
addFilter(
|
|
'editor.BlockEdit',
|
|
'wp-agentic-writer/block-chat-mention',
|
|
withChatMentionToolbar
|
|
);
|
|
} )( window.wp );
|