Bringing in EPLabs AI Features

.github/workflows/playwright.yml

@@ -10,6 +10,13 @@ env:
   COMPOSER_CACHE: "${{ github.workspace }}/.composer-cache"
   NODE_VERSION: "20"
   NODE_CACHE: "${{ github.workspace }}/node_modules_cache"
+  VECTOR_EMBEDDINGS_API_KEY: ${{ secrets.VECTOR_EMBEDDINGS_API_KEY }}
+  VECTOR_EMBEDDINGS_API_URL: ${{ secrets.VECTOR_EMBEDDINGS_API_URL }}
+  VECTOR_EMBEDDINGS_MODEL: ${{ secrets.VECTOR_EMBEDDINGS_MODEL }}
+  AI_SEARCH_SUMMARY_API_URL: ${{ secrets.AI_SEARCH_SUMMARY_API_URL }}
+  AI_SEARCH_SUMMARY_MODEL: ${{ secrets.AI_SEARCH_SUMMARY_MODEL }}
+  CF_ACCESS_CLIENT_ID: ${{ secrets.CF_ACCESS_CLIENT_ID }}
+  CF_ACCESS_CLIENT_SECRET: ${{ secrets.CF_ACCESS_CLIENT_SECRET }}
 
 on:
   push:
@@ -96,18 +103,18 @@ jobs:
     - name: Set up database
       run: |
         if [ "${{ matrix.testGroup }}" == "@paidPlugins" ]; then
-          npm run e2e:setup -- --wp-version=${{ matrix.core.version }} --wc-version=${{ matrix.core.wcVersion }} --acf-pro-license='${{ secrets.ACF_PRO_LICENSE_KEY }}'
+          npm run e2e:setup -- --wp-version=${{ matrix.core.version }} --wc-version=${{ matrix.core.wcVersion }} --acf-pro-license='${{ secrets.ACF_PRO_LICENSE_KEY }}' --cf-access-client-id='${{ secrets.CF_ACCESS_CLIENT_ID }}' --cf-access-client-secret='${{ secrets.CF_ACCESS_CLIENT_SECRET }}'
         else
-          npm run e2e:setup -- --wp-version=${{ matrix.core.version }} --wc-version=${{ matrix.core.wcVersion }}
+          npm run e2e:setup -- --wp-version=${{ matrix.core.version }} --wc-version=${{ matrix.core.wcVersion }} --cf-access-client-id='${{ secrets.CF_ACCESS_CLIENT_ID }}' --cf-access-client-secret='${{ secrets.CF_ACCESS_CLIENT_SECRET }}'
         fi
       if: matrix.esVersion != 'EP.io'
 
     - name: Set up database (EP.io)
       run: |
         if [ "${{ matrix.testGroup }}" == "@paidPlugins" ]; then
-          npm run e2e:setup -- --ep-host=${{ secrets.EPIO_HOST }} --ep-credentials='${{ secrets.EPIO_SHIELD }}' --ep-index-prefix=${{ secrets.EPIO_INDEX_PREFIX }} --wp-version=${{ matrix.core.version }} --wc-version=${{ matrix.core.wcVersion }} --acf-pro-license='${{ secrets.ACF_PRO_LICENSE_KEY }}'
+          npm run e2e:setup -- --ep-host=${{ secrets.EPIO_HOST }} --ep-credentials='${{ secrets.EPIO_SHIELD }}' --ep-index-prefix=${{ secrets.EPIO_INDEX_PREFIX }} --wp-version=${{ matrix.core.version }} --wc-version=${{ matrix.core.wcVersion }} --acf-pro-license='${{ secrets.ACF_PRO_LICENSE_KEY }}' --cf-access-client-id='${{ secrets.CF_ACCESS_CLIENT_ID }}' --cf-access-client-secret='${{ secrets.CF_ACCESS_CLIENT_SECRET }}'
         else
-          npm run e2e:setup -- --ep-host=${{ secrets.EPIO_HOST }} --ep-credentials='${{ secrets.EPIO_SHIELD }}' --ep-index-prefix=${{ secrets.EPIO_INDEX_PREFIX }} --wp-version=${{ matrix.core.version }} --wc-version=${{ matrix.core.wcVersion }}
+          npm run e2e:setup -- --ep-host=${{ secrets.EPIO_HOST }} --ep-credentials='${{ secrets.EPIO_SHIELD }}' --ep-index-prefix=${{ secrets.EPIO_INDEX_PREFIX }} --wp-version=${{ matrix.core.version }} --wc-version=${{ matrix.core.wcVersion }} --cf-access-client-id='${{ secrets.CF_ACCESS_CLIENT_ID }}' --cf-access-client-secret='${{ secrets.CF_ACCESS_CLIENT_SECRET }}'
         fi
       if: matrix.esVersion == 'EP.io'
 

.gitignore

@@ -10,6 +10,7 @@ test-coverage-html/
 .phpunit.result.cache
 screenshots
 .DS_Store
+.env
 
 elasticpress.zip
 

.wp-env.json

@@ -20,6 +20,7 @@
         ".htaccess": "./tests/e2e/src/wordpress-files/.htaccess",
         "wp-content/composer.json": "./tests/e2e/src/wordpress-files/composer.json",
         "wp-content/mu-plugins/disable-welcome-guide.php": "./tests/e2e/src/wordpress-files/test-mu-plugins/disable-welcome-guide.php",
+        "wp-content/mu-plugins/set-ai-auth-headers.php": "./tests/e2e/src/wordpress-files/test-mu-plugins/set-ai-auth-headers.php",
         "wp-content/mu-plugins/skip-wp-lookup.php": "./tests/e2e/src/wordpress-files/test-mu-plugins/skip-wp-lookup.php",
         "wp-content/mu-plugins/unique-index-name.php": "./tests/e2e/src/wordpress-files/test-mu-plugins/unique-index-name.php",
         "wp-content/plugins/add-meta-fields.php": "./tests/e2e/src/wordpress-files/test-plugins/add-meta-fields.php",

assets/js/blocks/ai-search-summary/block.json

@@ -0,0 +1,42 @@
+{
+	"$schema": "https://schemas.wp.org/trunk/block.json",
+	"apiVersion": 3,
+	"name": "elasticpress/ai-search-summary",
+	"title": "AI Search Summary",
+	"category": "elasticpress",
+	"icon": "superhero-alt",
+	"description": "AI Search Summary block description.",
+	"textdomain": "elasticpress",
+	"attributes": {
+		"title": {
+			"default": "Title",
+			"type": "string"
+		},
+		"note": {
+			"default": "AI generated results",
+			"type": "string"
+		}
+	},
+	"supports": {
+		"align": true,
+		"color": {
+			"background": true,
+			"link": true,
+			"text": true
+		},
+		"html": false,
+		"position": {
+			"sticky": true
+		},
+		"spacing": {
+			"margin": true,
+			"padding": true
+		},
+		"typography": {
+			"fontSize": true,
+			"lineHeight": true
+		}
+	},
+	"editorScript": "ep-ai-search-summary-block-script",
+	"script": "ep-ai-search-summary-block-frontend-script"
+}

assets/js/blocks/ai-search-summary/edit.js

@@ -0,0 +1,42 @@
+/**
+ * WordPress dependencies.
+ */
+import { RichText, useBlockProps } from '@wordpress/block-editor';
+import { Placeholder } from '@wordpress/components';
+import { __ } from '@wordpress/i18n';
+
+/**
+ * Edit component.
+ *
+ * @param {object} props Component props.
+ * @param {object} props.attributes Block attributes.
+ * @param {Function} props.setAttributes Block attribute setter.
+ * @returns {Function} Component.
+ */
+export default ({ attributes, setAttributes }) => {
+	const { note, title } = attributes;
+
+	const blockProps = useBlockProps({
+		className: 'ep-ai-search-summary',
+	});
+
+	return (
+		<div {...blockProps}>
+			<RichText
+				aria-label={__('Title text', 'elasticpress')}
+				placeholder={__('Add title', 'elasticpress')}
+				withoutInteractiveFormatting
+				value={title}
+				onChange={(html) => setAttributes({ title: html })}
+			/>
+			<Placeholder label={__('AI Response', 'elasticpress')} />
+			<RichText
+				aria-label={__('Note', 'elasticpress')}
+				placeholder={__('Add a note', 'elasticpress')}
+				withoutInteractiveFormatting
+				value={note}
+				onChange={(html) => setAttributes({ note: html })}
+			/>
+		</div>
+	);
+};

assets/js/blocks/ai-search-summary/frontend.js

@@ -0,0 +1,61 @@
+/**
+ * WordPress dependencies.
+ */
+import apiFetch from '@wordpress/api-fetch';
+import domReady from '@wordpress/dom-ready';
+import { Placeholder } from '@wordpress/components';
+import { createRoot, render, useEffect, useState, WPElement } from '@wordpress/element';
+import Skeleton from 'react-loading-skeleton';
+import 'react-loading-skeleton/dist/skeleton.css';
+
+const { restApiEndpoint, searchQuery } = window.epAISearchSummary;
+
+/**
+ * App component
+ *
+ * @returns {WPElement} App component.
+ */
+const App = () => {
+	const [className, setClassName] = useState('');
+	const [message, setMessage] = useState('');
+	const [isLoading, setIsLoading] = useState(true);
+
+	useEffect(() => {
+		apiFetch({
+			path: `${restApiEndpoint}?search_query=${searchQuery}`,
+		})
+			.then((response) => {
+				setClassName(response.class);
+				setMessage(response.html);
+			})
+			.finally(() => {
+				setIsLoading(false);
+			});
+	}, []);
+
+	return isLoading ? (
+		<Placeholder>
+			<Skeleton count={5} />
+		</Placeholder>
+	) : (
+		<div
+			className={`ep-ai-search-summary-generated ${className}`}
+			// eslint-disable-next-line react/no-danger
+			dangerouslySetInnerHTML={{ __html: message }}
+		/>
+	);
+};
+
+domReady(() => {
+	const blocks = document.querySelectorAll('.ep-ai-search-summary-response');
+
+	blocks.forEach((block) => {
+		if (typeof createRoot === 'function') {
+			const root = createRoot(block);
+
+			root.render(<App />);
+		} else {
+			render(<App />, block);
+		}
+	});
+});

assets/js/blocks/ai-search-summary/index.js

@@ -0,0 +1,15 @@
+/**
+ * WordPress dependencies.
+ */
+import { registerBlockType } from '@wordpress/blocks';
+
+/**
+ * Internal dependencies.
+ */
+import { name } from './block.json';
+import Edit from './edit';
+
+registerBlockType(name, {
+	edit: (props) => <Edit {...props} />,
+	save: () => {},
+});

assets/js/embeddings-editor/index.js

@@ -0,0 +1,28 @@
+/**
+ * WordPress dependencies.
+ */
+import { registerPlugin } from '@wordpress/plugins';
+
+/**
+ * Internal dependencies.
+ */
+import ExcludeFromEmbedding from './plugins/exclude-from-embedding';
+import IncludeForEmbedding from './plugins/include-for-embedding';
+
+const { postTypeConfig } = window.epEmbeddingsEditor;
+
+const { embeddingMode, embeddable } = postTypeConfig;
+
+if (embeddingMode === 'manual' && embeddable) {
+	registerPlugin('ep-embedding-include', {
+		render: IncludeForEmbedding,
+		icon: null,
+	});
+}
+
+if (embeddingMode === 'automatic' && embeddable) {
+	registerPlugin('ep-embedding-exclude', {
+		render: ExcludeFromEmbedding,
+		icon: null,
+	});
+}

assets/js/embeddings-editor/plugins/exclude-from-embedding.js

@@ -0,0 +1,40 @@
+/**
+ * WordPress dependencies.
+ */
+import { CheckboxControl } from '@wordpress/components';
+import { useDispatch, useSelect } from '@wordpress/data';
+import { PluginPostStatusInfo as PluginPostStatusInfoLegacy } from '@wordpress/edit-post';
+import { PluginPostStatusInfo } from '@wordpress/editor';
+import { __ } from '@wordpress/i18n';
+
+export default () => {
+	const { editPost } = useDispatch('core/editor');
+
+	const { ep_embedding_exclude = false, ...meta } = useSelect(
+		(select) => select('core/editor').getEditedPostAttribute('meta') || {},
+	);
+
+	const onChange = (ep_embedding_exclude) => {
+		editPost({ meta: { ...meta, ep_embedding_exclude } });
+	};
+
+	const WrapperElement =
+		typeof PluginPostStatusInfo !== 'undefined'
+			? PluginPostStatusInfo
+			: PluginPostStatusInfoLegacy;
+
+	return (
+		<WrapperElement>
+			<CheckboxControl
+				label={__('Exclude from vector embeddings', 'elasticpress')}
+				help={__(
+					"Check this if you don't want this post to be vectorized. Depending on the post meta and taxonomy rules configured for this post type, this post may already be excluded.",
+					'elasticpress',
+				)}
+				checked={ep_embedding_exclude}
+				onChange={onChange}
+				__nextHasNoMarginBottom
+			/>
+		</WrapperElement>
+	);
+};

assets/js/embeddings-editor/plugins/include-for-embedding.js

@@ -0,0 +1,37 @@
+/**
+ * WordPress dependencies.
+ */
+import { CheckboxControl } from '@wordpress/components';
+import { useDispatch, useSelect } from '@wordpress/data';
+import { PluginPostStatusInfo as PluginPostStatusInfoLegacy } from '@wordpress/edit-post';
+import { PluginPostStatusInfo } from '@wordpress/editor';
+import { __ } from '@wordpress/i18n';
+
+export default () => {
+	const { editPost } = useDispatch('core/editor');
+
+	const { ep_embedding_include = false, ...meta } = useSelect(
+		(select) => select('core/editor').getEditedPostAttribute('meta') || {},
+	);
+
+	const onChange = (ep_embedding_include) => {
+		editPost({ meta: { ...meta, ep_embedding_include } });
+	};
+
+	const WrapperElement =
+		typeof PluginPostStatusInfo !== 'undefined'
+			? PluginPostStatusInfo
+			: PluginPostStatusInfoLegacy;
+
+	return (
+		<WrapperElement>
+			<CheckboxControl
+				label={__('Include for vector embeddings', 'elasticpress')}
+				help={__('Check this if you want this post to be vectorized.', 'elasticpress')}
+				checked={ep_embedding_include}
+				onChange={onChange}
+				__nextHasNoMarginBottom
+			/>
+		</WrapperElement>
+	);
+};