@automattic/jetpack-ai-client 0.9.0 → 0.10.1

package/CHANGELOG.md

@@ -5,6 +5,14 @@ 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.10.1] - 2024-03-27
+### Changed
+- Updated package dependencies. [#36539, #36585]
+
+## [0.10.0] - 2024-03-18
+### Added
+- Add image generator hook [#36415]
+
 ## [0.9.0] - 2024-03-12
 ### Changed
 - Fix typescript errors [#35904]
@@ -255,6 +263,8 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Updated package dependencies. [#31659]
 - Updated package dependencies. [#31785]
 
+[0.10.1]: https://github.com/Automattic/jetpack-ai-client/compare/v0.10.0...v0.10.1
+[0.10.0]: https://github.com/Automattic/jetpack-ai-client/compare/v0.9.0...v0.10.0
 [0.9.0]: https://github.com/Automattic/jetpack-ai-client/compare/v0.8.2...v0.9.0
 [0.8.2]: https://github.com/Automattic/jetpack-ai-client/compare/v0.8.1...v0.8.2
 [0.8.1]: https://github.com/Automattic/jetpack-ai-client/compare/v0.8.0...v0.8.1

package/build/hooks/use-image-generator/index.d.ts

@@ -0,0 +1,10 @@
+declare const useImageGenerator: () => {
+    generateImage: ({ feature, }: {
+        feature: string;
+    }) => Promise<{
+        data: Array<{
+            url: string;
+        }>;
+    }>;
+};
+export default useImageGenerator;

package/build/hooks/use-image-generator/index.js

@@ -0,0 +1,48 @@
+/**
+ * External dependencies
+ */
+import debugFactory from 'debug';
+/**
+ * Internal dependencies
+ */
+import requestJwt from '../../jwt/index.js';
+const debug = debugFactory('ai-client:use-image-generator');
+const useImageGenerator = () => {
+    const generateImage = async function ({ feature, }) {
+        let token = '';
+        try {
+            token = (await requestJwt()).token;
+        }
+        catch (error) {
+            debug('Error getting token: %o', error);
+            return Promise.reject(error);
+        }
+        try {
+            debug('Generating image');
+            // TODO: Find a proper prompt for the image generation
+            const imageGenerationPrompt = ``;
+            const URL = 'https://public-api.wordpress.com/wpcom/v2/jetpack-ai-image';
+            const body = {
+                prompt: imageGenerationPrompt,
+                response_format: 'url',
+                feature,
+            };
+            const headers = {
+                Authorization: `Bearer ${token}`,
+            };
+            const data = await fetch(URL, {
+                method: 'POST',
+                headers,
+                body: JSON.stringify(body),
+            }).then(response => response.json());
+            return data;
+        }
+        catch (error) {
+            return;
+        }
+    };
+    return {
+        generateImage,
+    };
+};
+export default useImageGenerator;

package/build/index.d.ts

@@ -7,6 +7,7 @@ export { default as useMediaRecording } from './hooks/use-media-recording/index.
 export { default as useAudioTranscription } from './hooks/use-audio-transcription/index.js';
 export { default as useTranscriptionPostProcessing } from './hooks/use-transcription-post-processing/index.js';
 export { default as useAudioValidation } from './hooks/use-audio-validation/index.js';
+export { default as useImageGenerator } from './hooks/use-image-generator/index.js';
 export * from './icons/index.js';
 export * from './components/index.js';
 export * from './data-flow/index.js';

package/build/index.js

@@ -13,6 +13,7 @@ export { default as useMediaRecording } from './hooks/use-media-recording/index.
 export { default as useAudioTranscription } from './hooks/use-audio-transcription/index.js';
 export { default as useTranscriptionPostProcessing } from './hooks/use-transcription-post-processing/index.js';
 export { default as useAudioValidation } from './hooks/use-audio-validation/index.js';
+export { default as useImageGenerator } from './hooks/use-image-generator/index.js';
 /*
  * Components: Icons
  */

package/package.json

@@ -1,7 +1,7 @@
 {
 	"private": false,
 	"name": "@automattic/jetpack-ai-client",
-	"version": "0.9.0",
+	"version": "0.10.1",
 	"description": "A JS client for consuming Jetpack AI services",
 	"homepage": "https://github.com/Automattic/jetpack/tree/HEAD/projects/js-packages/ai-client/#readme",
 	"bugs": {
@@ -22,9 +22,9 @@
 	},
 	"type": "module",
 	"devDependencies": {
-		"@storybook/addon-actions": "7.6.17",
-		"@storybook/blocks": "7.6.17",
-		"@storybook/react": "7.6.17",
+		"@storybook/addon-actions": "8.0.4",
+		"@storybook/blocks": "8.0.4",
+		"@storybook/react": "8.0.4",
 		"jest": "^29.6.2",
 		"jest-environment-jsdom": "29.7.0",
 		"typescript": "5.0.4"
@@ -38,19 +38,19 @@
 	"main": "./build/index.js",
 	"types": "./build/index.d.ts",
 	"dependencies": {
-		"@automattic/jetpack-base-styles": "^0.6.19",
-		"@automattic/jetpack-connection": "^0.33.3",
-		"@automattic/jetpack-shared-extension-utils": "^0.14.7",
+		"@automattic/jetpack-base-styles": "^0.6.20",
+		"@automattic/jetpack-connection": "^0.33.5",
+		"@automattic/jetpack-shared-extension-utils": "^0.14.8",
 		"@microsoft/fetch-event-source": "2.0.1",
 		"@types/react": "18.2.61",
-		"@wordpress/api-fetch": "6.50.0",
-		"@wordpress/block-editor": "12.21.0",
-		"@wordpress/components": "27.1.0",
-		"@wordpress/compose": "6.30.0",
-		"@wordpress/data": "9.23.0",
-		"@wordpress/element": "5.30.0",
-		"@wordpress/i18n": "4.53.0",
-		"@wordpress/icons": "9.44.0",
+		"@wordpress/api-fetch": "6.51.0",
+		"@wordpress/block-editor": "12.22.0",
+		"@wordpress/components": "27.2.0",
+		"@wordpress/compose": "6.31.0",
+		"@wordpress/data": "9.24.0",
+		"@wordpress/element": "5.31.0",
+		"@wordpress/i18n": "4.54.0",
+		"@wordpress/icons": "9.45.0",
 		"classnames": "2.3.2",
 		"debug": "4.3.4",
 		"react": "18.2.0",

package/src/hooks/use-image-generator/index.ts

@@ -0,0 +1,62 @@
+/**
+ * External dependencies
+ */
+import debugFactory from 'debug';
+/**
+ * Internal dependencies
+ */
+import requestJwt from '../../jwt/index.js';
+
+const debug = debugFactory( 'ai-client:use-image-generator' );
+
+const useImageGenerator = () => {
+	const generateImage = async function ( {
+		feature,
+	}: {
+		feature: string;
+	} ): Promise< { data: Array< { url: string } > } > {
+		let token = '';
+
+		try {
+			token = ( await requestJwt() ).token;
+		} catch ( error ) {
+			debug( 'Error getting token: %o', error );
+			return Promise.reject( error );
+		}
+
+		try {
+			debug( 'Generating image' );
+
+			// TODO: Find a proper prompt for the image generation
+			const imageGenerationPrompt = ``;
+
+			const URL = 'https://public-api.wordpress.com/wpcom/v2/jetpack-ai-image';
+
+			const body = {
+				prompt: imageGenerationPrompt,
+				response_format: 'url',
+				feature,
+			};
+
+			const headers = {
+				Authorization: `Bearer ${ token }`,
+			};
+
+			const data = await fetch( URL, {
+				method: 'POST',
+				headers,
+				body: JSON.stringify( body ),
+			} ).then( response => response.json() );
+
+			return data as { data: { url: string }[] };
+		} catch ( error ) {
+			return;
+		}
+	};
+
+	return {
+		generateImage,
+	};
+};
+
+export default useImageGenerator;

package/src/index.ts

@@ -14,6 +14,7 @@ export { default as useMediaRecording } from './hooks/use-media-recording/index.
 export { default as useAudioTranscription } from './hooks/use-audio-transcription/index.js';
 export { default as useTranscriptionPostProcessing } from './hooks/use-transcription-post-processing/index.js';
 export { default as useAudioValidation } from './hooks/use-audio-validation/index.js';
+export { default as useImageGenerator } from './hooks/use-image-generator/index.js';
 
 /*
  * Components: Icons