diff --git a/projects/js-packages/ai-client/src/libs/index.ts b/projects/js-packages/ai-client/src/libs/index.ts index 31f354e87d07f..a73828a0c8853 100644 --- a/projects/js-packages/ai-client/src/libs/index.ts +++ b/projects/js-packages/ai-client/src/libs/index.ts @@ -3,6 +3,7 @@ export { HTMLToMarkdown, renderHTMLFromMarkdown, renderMarkdownFromHTML, + fixes, } from './markdown/index.js'; export type { RenderHTMLRules } from './markdown/index.js'; diff --git a/projects/js-packages/ai-client/src/libs/markdown/index.ts b/projects/js-packages/ai-client/src/libs/markdown/index.ts index d0a811f4e3507..024123327ca9f 100644 --- a/projects/js-packages/ai-client/src/libs/markdown/index.ts +++ b/projects/js-packages/ai-client/src/libs/markdown/index.ts @@ -2,7 +2,7 @@ * Internal dependencies */ import HTMLToMarkdown from './html-to-markdown.js'; -import MarkdownToHTML from './markdown-to-html.js'; +import MarkdownToHTML, { fixes } from './markdown-to-html.js'; /** * Types */ @@ -29,4 +29,4 @@ const renderMarkdownFromHTML = ( { content }: { content: string } ) => { return defaultHTMLConverter.render( { content } ); }; -export { MarkdownToHTML, HTMLToMarkdown, renderHTMLFromMarkdown, renderMarkdownFromHTML }; +export { MarkdownToHTML, HTMLToMarkdown, renderHTMLFromMarkdown, renderMarkdownFromHTML, fixes }; diff --git a/projects/js-packages/ai-client/src/libs/markdown/markdown-to-html.ts b/projects/js-packages/ai-client/src/libs/markdown/markdown-to-html.ts index c1e07e9969406..928fc09872a5c 100644 --- a/projects/js-packages/ai-client/src/libs/markdown/markdown-to-html.ts +++ b/projects/js-packages/ai-client/src/libs/markdown/markdown-to-html.ts @@ -7,7 +7,7 @@ import MarkdownIt from 'markdown-it'; */ import type { Options } from 'markdown-it'; -export type Fix = 'list' | 'paragraph' | 'listItem'; +export type Fix = 'list' | 'paragraph' | 'listItem' | 'table'; const addListComments = ( content: string ) => { return ( @@ -32,7 +32,7 @@ const addListComments = ( content: string ) => { type Fixes = { [ key in Fix ]: ( content: string, extension?: boolean ) => string; }; -const fixes: Fixes = { +export const fixes: Fixes = { list: ( content: string, extension = false ) => { // Fix list indentation const fixedIndentation = content @@ -61,6 +61,15 @@ const fixes: Fixes = { // Fix encoding of
tags return content.replaceAll( /\s*<br \/>\s*/g, '
' ); }, + table: ( content: string, extension = false ) => { + if ( ! extension ) { + return content; + } + + return content + .replace( /^/g, '' ) // Remove figure start for table block + .replace( /<\/figure>$/g, '' ); // Remove figure end for table block + }, }; const defaultMarkdownItOptions: Options = { diff --git a/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/breve/highlight/index.tsx b/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/breve/highlight/index.tsx index a30d40d44afd2..ee1ae151cedb0 100644 --- a/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/breve/highlight/index.tsx +++ b/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/breve/highlight/index.tsx @@ -1,7 +1,7 @@ /** * External dependencies */ -import { renderHTMLFromMarkdown } from '@automattic/jetpack-ai-client'; +import { fixes } from '@automattic/jetpack-ai-client'; import { rawHandler } from '@wordpress/blocks'; import { Button, Popover, Spinner } from '@wordpress/components'; import { select as globalSelect, useDispatch, useSelect } from '@wordpress/data'; @@ -82,10 +82,12 @@ export default function Highlight() { }; const handleSuggestions = () => { - const sentence = ( anchor as HTMLElement )?.innerText; + const target = ( anchor as HTMLElement )?.innerText; + const sentence = ( anchor as HTMLElement )?.parentElement?.innerText; setSuggestions( { id, + target, feature, sentence, blockId: block, @@ -94,11 +96,8 @@ export default function Highlight() { const handleApplySuggestion = () => { // Apply known fixes - const render = renderHTMLFromMarkdown( { - content: suggestions?.revisedText, - rules: [ 'listItem', 'list', 'paragraph' ], - extension: true, - } ); + const render = fixes.listItem( suggestions?.html, true ); // Replace li for WP tags + const [ newBlock ] = rawHandler( { HTML: render } ); updateBlockAttributes( block, newBlock.attributes ); }; diff --git a/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/breve/store/actions.ts b/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/breve/store/actions.ts index 611de8a66fcc2..566f25993fc96 100644 --- a/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/breve/store/actions.ts +++ b/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/breve/store/actions.ts @@ -51,11 +51,13 @@ export function toggleFeature( feature: string, force?: boolean ) { export function setSuggestions( { id, feature, + target, sentence, blockId, }: { id: string; feature: string; + target: string; sentence: string; blockId: string; } ) { @@ -70,6 +72,7 @@ export function setSuggestions( { askQuestionSync( getRequestMessages( { feature, + target, sentence, blockId, } ), diff --git a/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/breve/types.ts b/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/breve/types.ts index dbf8b1a6a08a5..53611eae07d38 100644 --- a/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/breve/types.ts +++ b/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/breve/types.ts @@ -24,7 +24,7 @@ export type BreveState = { [ key: string ]: { loading: boolean; suggestions: { - revisedText: string; + html: string; suggestion: string; }; }; @@ -45,7 +45,7 @@ export type BreveSelect = { feature: string, id: string ) => { - revisedText: string; + html: string; suggestion: string; }; }; @@ -61,6 +61,7 @@ export type BreveDispatch = { setSuggestions: ( suggestions: { id: string; feature: string; + target: string; sentence: string; blockId: string; } ) => void; diff --git a/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/breve/utils/getRequestMessages.ts b/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/breve/utils/getRequestMessages.ts index 31441ed627e15..a678f83df56d6 100644 --- a/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/breve/utils/getRequestMessages.ts +++ b/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/breve/utils/getRequestMessages.ts @@ -1,6 +1,7 @@ /** * Internal dependencies */ +import { getBlockContent } from '@wordpress/blocks'; import { select } from '@wordpress/data'; import features from '../features/index.js'; @@ -14,20 +15,21 @@ const requestTypeMap = { // adjective: 'breve-adjective', }; -export const getRequestMessages = ( { feature, sentence, blockId } ) => { +export const getRequestMessages = ( { feature, target, sentence, blockId } ) => { const block = select( 'core/block-editor' ).getBlock( blockId ); - const html = block?.originalContent; + const html = getBlockContent( block ); const dictionary = features?.find?.( ftr => ftr.config.name === feature )?.dictionary || {}; - const replacement = dictionary[ sentence.toLowerCase() ] || null; + const replacement = dictionary[ target.toLowerCase() ] || null; return [ { role: 'jetpack-ai' as const, context: { type: requestTypeMap[ feature ], + target, sentence, - replacement, html, + replacement, }, }, ];