four-point package releases for videopress and my-jetpack

Committed via a GitHub action: https://github.com/Automattic/jetpack/actions/runs/6668037876

CHANGELOG.md

@@ -5,13 +5,6 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/)
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
-## [0.1.13] - 2023-10-23
-### Changed
-- Updated package dependencies. [#33687]
-
-### Removed
-- AI Client: Remove obsolete blockListBlockWithAiDataProvider() HOC component. [#33726]
-
 ## [0.1.12] - 2023-10-16
 ### Changed
 - Updated package dependencies. [#33584]
@@ -151,7 +144,6 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Updated package dependencies. [#31659]
 - Updated package dependencies. [#31785]
 
-[0.1.13]: https://github.com/Automattic/jetpack-ai-client/compare/v0.1.12...v0.1.13
 [0.1.12]: https://github.com/Automattic/jetpack-ai-client/compare/v0.1.11...v0.1.12
 [0.1.11]: https://github.com/Automattic/jetpack-ai-client/compare/v0.1.10...v0.1.11
 [0.1.10]: https://github.com/Automattic/jetpack-ai-client/compare/v0.1.9...v0.1.10

package.json

@@ -1,7 +1,7 @@
 {
 	"private": false,
 	"name": "@automattic/jetpack-ai-client",
-	"version": "0.1.13",
+	"version": "0.1.12",
 	"description": "A JS client for consuming Jetpack AI services",
 	"homepage": "https://github.com/Automattic/jetpack/tree/HEAD/projects/js-packages/ai-client/#readme",
 	"bugs": {
@@ -32,18 +32,18 @@
 		".": "./index.ts"
 	},
 	"dependencies": {
-		"@automattic/jetpack-base-styles": "^0.6.11",
-		"@automattic/jetpack-connection": "^0.30.5",
-		"@automattic/jetpack-shared-extension-utils": "^0.12.4",
+		"@automattic/jetpack-base-styles": "^0.6.10",
+		"@automattic/jetpack-connection": "^0.30.3",
+		"@automattic/jetpack-shared-extension-utils": "^0.12.3",
 		"@microsoft/fetch-event-source": "2.0.1",
-		"@wordpress/api-fetch": "6.41.0",
-		"@wordpress/block-editor": "12.12.0",
-		"@wordpress/components": "25.10.0",
-		"@wordpress/compose": "6.21.0",
-		"@wordpress/data": "9.14.0",
-		"@wordpress/element": "5.21.0",
-		"@wordpress/i18n": "4.44.0",
-		"@wordpress/icons": "9.35.0",
+		"@wordpress/api-fetch": "6.40.0",
+		"@wordpress/block-editor": "12.11.0",
+		"@wordpress/components": "25.9.0",
+		"@wordpress/compose": "6.20.0",
+		"@wordpress/data": "9.13.0",
+		"@wordpress/element": "5.20.0",
+		"@wordpress/i18n": "4.43.0",
+		"@wordpress/icons": "9.34.0",
 		"classnames": "2.3.2",
 		"debug": "4.3.4",
 		"react": "18.2.0",

src/data-flow/Readme.md

@@ -33,6 +33,7 @@ export default withAiAssistantData( MyComponent );
 
 * [AI Data Context](#ai-assistant-content)
 * [withAiDataProvider HOC](#with-ai-data-provider)
+* [blockListBlockWithAiDataProvider](#block-list-block-with-ai-data-provider)
 * [useAiContext Hook](#use-ai-context)
 
 <h2 id="ai-assistant-content">Ai Data Context</h2>
@@ -115,6 +116,25 @@ These callbacks will be invoked with the detail of the corresponding event emitt
 When called, the hook returns the Ai Data Context.
 
 
+<h2 id="block-list-block-with-ai-data-provider">blockListBlockWithAiDataProvider Function</h2>
+
+The `blockListBlockWithAiDataProvider` function returns a Higher Order Component (HOC) that wraps and provides the AI Assistant Data context to a specified set of blocks. Primarily designed for use with the `editor.BlockListBlock` filter in the WordPress Block Editor, it conditionally applies the data provider only to block types specified in the function options.
+
+### Usage
+
+To use the `blockListBlockWithAiDataProvider`, you'll need to specify which blocks should have access to the AI Assistant Data context:
+
+```jsx
+import { blockListBlockWithAiDataProvider } from '@automattic/jetpack-ai-client';
+
+// Example usage with WordPress filters
+const enhancedBlockListBlock = blockListBlockWithAiDataProvider( {
+  blocks: [ 'core/paragraph', 'core/heading' ]
+} );
+
+wp.hooks.addFilter( 'editor.BlockListBlock', 'my-plugin/with-ai-data', enhancedBlockListBlock );
+```
+
 ### Parameters
 
 The function accepts an optional options object:

src/data-flow/index.ts

@@ -1,3 +1,6 @@
 export { AiDataContext, AiDataContextProvider } from './context';
-export { default as withAiDataProvider } from './with-ai-assistant-data';
+export {
+	default as withAiDataProvider,
+	blockListBlockWithAiDataProvider,
+} from './with-ai-assistant-data';
 export { default as useAiContext } from './use-ai-context';

src/data-flow/with-ai-assistant-data.tsx

@@ -59,3 +59,82 @@ const withAiDataProvider = createHigherOrderComponent( ( WrappedComponent: React
 }, 'withAiDataProvider' );
 
 export default withAiDataProvider;
+
+type OptionsProps = {
+	/**
+	 * Array of block names to apply the data provider to.
+	 */
+	blocks: string[] | string;
+};
+
+/**
+ * Function that returns a High Order Component that provides the
+ * AI Assistant Data context to the wrapped component.
+ *
+ * Ideally though to use with the `editor.BlockListBlock` filter.
+ *
+ * @see https://developer.wordpress.org/block-editor/reference-guides/filters/block-filters/#editor-blocklistblock
+ * @param {OptionsProps} options - Options
+ * @param {string[]} options.blocks - Array of block names to apply the data provider to.
+ * @returns {ReactNode}          	  Wrapped component, populated with the AI Assistant Data context.
+ */
+export const blockListBlockWithAiDataProvider = ( options: OptionsProps = { blocks: [ '' ] } ) => {
+	return createHigherOrderComponent( ( WrappedComponent: ReactNode ) => {
+		return props => {
+			const blockName = props?.block?.name;
+			if ( ! blockName ) {
+				return <WrappedComponent { ...props } />;
+			}
+
+			/*
+			 * Extend only blocks that are specified in the blocks option.
+			 * `blocks` option accepts a string or an array of strings.
+			 */
+			const blockTypesToExtend = Array.isArray( options.blocks )
+				? options.blocks
+				: [ options.blocks ];
+
+			if ( ! blockTypesToExtend.includes( blockName ) ) {
+				return <WrappedComponent { ...props } />;
+			}
+
+			// Connect with the AI Assistant communication layer.
+			// @todo: this is a copy of the code above, we should refactor this.
+			const {
+				suggestion,
+				error: requestingError,
+				requestingState,
+				request: requestSuggestion,
+				stopSuggestion,
+				eventSource,
+			} = useAiSuggestions();
+
+			// Build the context value to pass to the ai assistant data provider.
+			const dataContextValue = useMemo(
+				() => ( {
+					suggestion,
+					requestingError,
+					requestingState,
+					eventSource,
+
+					requestSuggestion,
+					stopSuggestion,
+				} ),
+				[
+					suggestion,
+					requestingError,
+					requestingState,
+					eventSource,
+					requestSuggestion,
+					stopSuggestion,
+				]
+			);
+
+			return (
+				<AiDataContextProvider value={ dataContextValue }>
+					<WrappedComponent { ...props } />
+				</AiDataContextProvider>
+			);
+		};
+	}, 'blockListBlockWithAiDataProvider' );
+};