From bdcc3bf1b01796bf229ffb62e878f12ccfb06df1 Mon Sep 17 00:00:00 2001 From: Siddharth Thevaril Date: Thu, 19 Sep 2024 19:20:13 +0530 Subject: [PATCH 01/24] move text to speech out as a separate plugin --- includes/Classifai/Features/Feature.php | 25 ++ includes/Classifai/Features/TextToSpeech.php | 21 +- src/js/gutenberg-plugin.js | 247 +---------------- src/js/plugins/slot-fill/index.js | 34 +++ src/js/plugins/text-to-speech/index.js | 261 ++++++++++++++++++ .../text-to-speech/store.js} | 0 webpack.config.js | 3 + 7 files changed, 334 insertions(+), 257 deletions(-) create mode 100644 src/js/plugins/slot-fill/index.js create mode 100644 src/js/plugins/text-to-speech/index.js rename src/js/{store/register.js => plugins/text-to-speech/store.js} (100%) diff --git a/includes/Classifai/Features/Feature.php b/includes/Classifai/Features/Feature.php index cd1e6a636..f4e468035 100644 --- a/includes/Classifai/Features/Feature.php +++ b/includes/Classifai/Features/Feature.php @@ -5,6 +5,7 @@ use WP_REST_Request; use WP_Error; use function Classifai\find_provider_class; +use function Classifai\get_asset_info; abstract class Feature { /** @@ -16,6 +17,16 @@ abstract class Feature { */ const ID = ''; + /** + * Plugin area script handle. + * + * Every feature that injects content into the plugin area + * should add this script as a dependency. + * + * @var string + */ + const PLUGIN_AREA_SCRIPT = 'classifai-plugin-fill-js'; + /** * Feature label. * @@ -53,6 +64,7 @@ public function setup() { add_action( 'admin_init', [ $this, 'setup_roles' ] ); add_action( 'admin_init', [ $this, 'register_setting' ] ); add_action( 'admin_init', [ $this, 'setup_fields_sections' ] ); + add_action( 'admin_enqueue_scripts', [ $this, 'register_plugin_area_script' ] ); if ( $this->is_feature_enabled() ) { $this->feature_setup(); @@ -114,6 +126,19 @@ public function get_label(): string { ); } + /** + * Registers the plugin area script. + */ + public function register_plugin_area_script() { + wp_register_script( + self::PLUGIN_AREA_SCRIPT, + CLASSIFAI_PLUGIN_URL . 'dist/classifai-plugin-fill.js', + get_asset_info( 'classifai-plugin-fill', 'dependencies' ), + get_asset_info( 'classifai-plugin-fill', 'version' ), + true + ); + } + /** * Set up the fields for each section. * diff --git a/includes/Classifai/Features/TextToSpeech.php b/includes/Classifai/Features/TextToSpeech.php index 9ac3250a1..8e8d9a21b 100644 --- a/includes/Classifai/Features/TextToSpeech.php +++ b/includes/Classifai/Features/TextToSpeech.php @@ -118,20 +118,15 @@ public function enqueue_editor_assets() { } wp_enqueue_script( - 'classifai-gutenberg-plugin', - CLASSIFAI_PLUGIN_URL . 'dist/gutenberg-plugin.js', - array_merge( get_asset_info( 'gutenberg-plugin', 'dependencies' ), array( 'lodash' ) ), - get_asset_info( 'gutenberg-plugin', 'version' ), - true - ); - - wp_add_inline_script( - 'classifai-gutenberg-plugin', - sprintf( - 'var classifaiTTSEnabled = %d;', - true + 'classifai-plugin-text-to-speech', + CLASSIFAI_PLUGIN_URL . 'dist/classifai-plugin-text-to-speech.js', + array_merge( + get_asset_info( 'classifai-plugin-text-to-speech', 'dependencies' ), + array( 'lodash' ), + array( Feature::PLUGIN_AREA_SCRIPT ) ), - 'before' + get_asset_info( 'classifai-plugin-text-to-speech', 'version' ), + true ); } diff --git a/src/js/gutenberg-plugin.js b/src/js/gutenberg-plugin.js index 42cc12c50..33f91e236 100644 --- a/src/js/gutenberg-plugin.js +++ b/src/js/gutenberg-plugin.js @@ -7,23 +7,21 @@ import { Button, Icon, ToggleControl, - BaseControl, Modal, } from '@wordpress/components'; import { __, sprintf } from '@wordpress/i18n'; import { registerPlugin } from '@wordpress/plugins'; -import { useState, useEffect, useRef } from '@wordpress/element'; -import { store as postAudioStore } from './store/register'; +import { useState } from '@wordpress/element'; import TaxonomyControls from './taxonomy-controls'; import PrePubClassifyPost from './gutenberg-plugins/pre-publish-classify-post'; import { DisableFeatureButton } from './components'; -const { classifaiPostData, classifaiTTSEnabled } = window; +const { classifaiPostData } = window; /** * Create the ClassifAI icon */ -const ClassifAIIcon = () => ( +const ClassifAIIcon = ( { icon } ) => ( ); @@ -364,214 +362,6 @@ const ClassificationButton = () => { ); }; -/** - * ClassifAI Text to Audio component. - */ -const ClassifAITTS = () => { - // State of the audio being previewed in PluginDocumentSettingPanel. - const [ isPreviewing, setIsPreviewing ] = useState( false ); - - const [ timestamp, setTimestamp ] = useState( new Date().getTime() ); - - // Indicates whether speech synthesis is enabled for the current post. - const isSynthesizeSpeech = useSelect( ( select ) => - select( 'core/editor' ).getEditedPostAttribute( - 'classifai_synthesize_speech' - ) - ); - - // Indicates whether generated audio should be displayed on the frontend. - const displayGeneratedAudio = useSelect( ( select ) => - select( 'core/editor' ).getEditedPostAttribute( - 'classifai_display_generated_audio' - ) - ); - - // Post type label. - const postTypeLabel = useSelect( - ( select ) => - ( typeof select( 'core/editor' ).getPostTypeLabel !== 'undefined' && - select( 'core/editor' ).getPostTypeLabel() ) || - __( 'Post', 'classifai' ) - ); - - // Says whether speech synthesis is in progress. - const isProcessingAudio = useSelect( ( select ) => - select( postAudioStore ).getIsProcessing() - ); - - // The audio ID saved in the DB for the current post. - const defaultAudioId = useSelect( ( select ) => - select( 'core/editor' ).getEditedPostAttribute( - 'classifai_post_audio_id' - ) - ); - - // New audio ID in case it is regenerated manually or through publishing/updating the current post. - const audioId = - useSelect( ( select ) => select( postAudioStore ).getAudioId() ) || - defaultAudioId; - - // Get the attachment data by audio ID. - const attachments = useSelect( ( select ) => - select( 'core' ).getEntityRecords( 'postType', 'attachment', { - include: [ audioId ], - } ) - ); - - // Get URL for the attachment. - const sourceUrl = - attachments && attachments.length > 0 && attachments[ 0 ].source_url; - - const isProcessingAudioProgress = useRef( false ); - const isPostSavingInProgress = useRef( false ); - const { isSavingPost } = useSelect( ( select ) => { - return { - isSavingPost: select( 'core/editor' ).isSavingPost(), - }; - } ); - const { isAutosavingPost } = useSelect( ( select ) => { - return { - isSavingPost: select( 'core/editor' ).isAutosavingPost(), - }; - } ); - - // Handles playing/pausing post audio during preview. - useEffect( () => { - const audioEl = document.getElementById( 'classifai-audio-preview' ); - - if ( ! audioEl ) { - return; - } - - if ( isPreviewing ) { - audioEl.play(); - } else { - audioEl.pause(); - } - }, [ isPreviewing ] ); - - // Generates a unique timestamp to cache bust audio file. - useEffect( () => { - if ( isProcessingAudio ) { - isProcessingAudioProgress.current = true; - } - - if ( isProcessingAudioProgress.current && ! isProcessingAudio ) { - setTimestamp( new Date().getTime() ); - } - }, [ isProcessingAudio ] ); - - useEffect( () => { - // Code to run during post saving is in process. - if ( - isSavingPost && - ! isAutosavingPost && - ! isPostSavingInProgress.current - ) { - isPostSavingInProgress.current = true; - if ( isSynthesizeSpeech ) { - wp.data.dispatch( postAudioStore ).setIsProcessing( true ); - } - } - - if ( - ! isSavingPost && - ! isAutosavingPost && - isPostSavingInProgress.current - ) { - // Code to run after post is done saving. - isPostSavingInProgress.current = false; - wp.data.dispatch( postAudioStore ).setIsProcessing( false ); - } - }, [ isSavingPost, isAutosavingPost, isSynthesizeSpeech ] ); - - // Fetches the latest audio file to avoid disk cache. - const cacheBustingUrl = `${ sourceUrl }?ver=${ timestamp }`; - - let audioIcon = 'controls-play'; - - if ( isProcessingAudio ) { - audioIcon = 'format-audio'; - } else if ( isPreviewing ) { - audioIcon = 'controls-pause'; - } - - return ( - <> - { - wp.data.dispatch( 'core/editor' ).editPost( { - classifai_synthesize_speech: value, - } ); - } } - disabled={ isProcessingAudio } - isBusy={ isProcessingAudio } - /> - { sourceUrl && ( - <> - { - wp.data.dispatch( 'core/editor' ).editPost( { - classifai_display_generated_audio: value, - } ); - } } - disabled={ isProcessingAudio } - isBusy={ isProcessingAudio } - /> - - - - - ) } - { sourceUrl && ( - - ) } - - ); -}; - /** * Add the ClassifAI panel to Gutenberg */ @@ -626,40 +416,9 @@ const ClassifAIPlugin = () => { { nluPermissionCheck && } ) } - { classifaiTTSEnabled && } ); }; -let saveHappened = false; -let showingNotice = false; - -subscribe( () => { - if ( saveHappened === false ) { - saveHappened = wp.data.select( 'core/editor' ).isSavingPost() === true; - } - - if ( - saveHappened && - wp.data.select( 'core/editor' ).isSavingPost() === false && - showingNotice === false - ) { - const meta = wp.data - .select( 'core/editor' ) - .getCurrentPostAttribute( 'meta' ); - if ( meta && meta._classifai_text_to_speech_error ) { - showingNotice = true; - const error = JSON.parse( meta._classifai_text_to_speech_error ); - wp.data - .dispatch( 'core/notices' ) - .createErrorNotice( - `Audio generation failed. Error: ${ error.code } - ${ error.message }` - ); - saveHappened = false; - showingNotice = false; - } - } -} ); - registerPlugin( 'classifai-plugin', { render: ClassifAIPlugin } ); diff --git a/src/js/plugins/slot-fill/index.js b/src/js/plugins/slot-fill/index.js new file mode 100644 index 000000000..f89751dee --- /dev/null +++ b/src/js/plugins/slot-fill/index.js @@ -0,0 +1,34 @@ +import { PluginDocumentSettingPanel } from '@wordpress/edit-post'; +import { Icon, SlotFillProvider, Slot, Fill, } from '@wordpress/components'; +import { PluginArea, registerPlugin } from '@wordpress/plugins'; +import { __ } from '@wordpress/i18n'; + +const ClassifAIIcon = ( { icon } ) => ( + +); + +const ClassifAIPluginArea = () => { + return ( + + + + + + + ); +}; + +registerPlugin( + 'classifai-plugin-area', + { + render: ClassifAIPluginArea + } +); + +export const ClassifaiEditorSettingPanel = ( { children } ) => { + return { children }; +}; diff --git a/src/js/plugins/text-to-speech/index.js b/src/js/plugins/text-to-speech/index.js new file mode 100644 index 000000000..05935a768 --- /dev/null +++ b/src/js/plugins/text-to-speech/index.js @@ -0,0 +1,261 @@ + +/** + * External dependencies. + */ +import { useState, useEffect, useRef } from '@wordpress/element'; +import { ToggleControl, BaseControl, Button, Icon } from '@wordpress/components'; +import { useSelect, subscribe } from '@wordpress/data'; +import { registerPlugin } from '@wordpress/plugins'; +import { __ } from '@wordpress/i18n'; + +/** + * Internal dependencies. + */ +import { ClassifaiEditorSettingPanel } from '../slot-fill'; +import { store as postAudioStore } from './store'; + +/** + * ClassifAI Text to Audio component. + */ +const TextToSpeechPlugin = () => { + // State of the audio being previewed in PluginDocumentSettingPanel. + const [ isPreviewing, setIsPreviewing ] = useState( false ); + + const [ timestamp, setTimestamp ] = useState( new Date().getTime() ); + + // Indicates whether speech synthesis is enabled for the current post. + const isSynthesizeSpeech = useSelect( ( select ) => + select( 'core/editor' ).getEditedPostAttribute( + 'classifai_synthesize_speech' + ) + ); + + // Indicates whether generated audio should be displayed on the frontend. + const displayGeneratedAudio = useSelect( ( select ) => + select( 'core/editor' ).getEditedPostAttribute( + 'classifai_display_generated_audio' + ) + ); + + // Post type label. + const postTypeLabel = useSelect( + ( select ) => + ( typeof select( 'core/editor' ).getPostTypeLabel !== 'undefined' && + select( 'core/editor' ).getPostTypeLabel() ) || + __( 'Post', 'classifai' ) + ); + + // Says whether speech synthesis is in progress. + const isProcessingAudio = useSelect( ( select ) => + select( postAudioStore ).getIsProcessing() + ); + + // The audio ID saved in the DB for the current post. + const defaultAudioId = useSelect( ( select ) => + select( 'core/editor' ).getEditedPostAttribute( + 'classifai_post_audio_id' + ) + ); + + // New audio ID in case it is regenerated manually or through publishing/updating the current post. + const audioId = + useSelect( ( select ) => select( postAudioStore ).getAudioId() ) || + defaultAudioId; + + // Get the attachment data by audio ID. + const attachments = useSelect( ( select ) => + select( 'core' ).getEntityRecords( 'postType', 'attachment', { + include: [ audioId ], + } ) + ); + + // Get URL for the attachment. + const sourceUrl = + attachments && attachments.length > 0 && attachments[ 0 ].source_url; + + const isProcessingAudioProgress = useRef( false ); + const isPostSavingInProgress = useRef( false ); + const { isSavingPost } = useSelect( ( select ) => { + return { + isSavingPost: select( 'core/editor' ).isSavingPost(), + }; + } ); + const { isAutosavingPost } = useSelect( ( select ) => { + return { + isSavingPost: select( 'core/editor' ).isAutosavingPost(), + }; + } ); + + // Handles playing/pausing post audio during preview. + useEffect( () => { + const audioEl = document.getElementById( 'classifai-audio-preview' ); + + if ( ! audioEl ) { + return; + } + + if ( isPreviewing ) { + audioEl.play(); + } else { + audioEl.pause(); + } + }, [ isPreviewing ] ); + + // Generates a unique timestamp to cache bust audio file. + useEffect( () => { + if ( isProcessingAudio ) { + isProcessingAudioProgress.current = true; + } + + if ( isProcessingAudioProgress.current && ! isProcessingAudio ) { + setTimestamp( new Date().getTime() ); + } + }, [ isProcessingAudio ] ); + + useEffect( () => { + // Code to run during post saving is in process. + if ( + isSavingPost && + ! isAutosavingPost && + ! isPostSavingInProgress.current + ) { + isPostSavingInProgress.current = true; + if ( isSynthesizeSpeech ) { + wp.data.dispatch( postAudioStore ).setIsProcessing( true ); + } + } + + if ( + ! isSavingPost && + ! isAutosavingPost && + isPostSavingInProgress.current + ) { + // Code to run after post is done saving. + isPostSavingInProgress.current = false; + wp.data.dispatch( postAudioStore ).setIsProcessing( false ); + } + }, [ isSavingPost, isAutosavingPost, isSynthesizeSpeech ] ); + + // Fetches the latest audio file to avoid disk cache. + const cacheBustingUrl = `${ sourceUrl }?ver=${ timestamp }`; + + let audioIcon = 'controls-play'; + + if ( isProcessingAudio ) { + audioIcon = 'format-audio'; + } else if ( isPreviewing ) { + audioIcon = 'controls-pause'; + } + + return ( + + { + wp.data.dispatch( 'core/editor' ).editPost( { + classifai_synthesize_speech: value, + } ); + } } + disabled={ isProcessingAudio } + isBusy={ isProcessingAudio } + /> + { sourceUrl && ( + <> + { + wp.data.dispatch( 'core/editor' ).editPost( { + classifai_display_generated_audio: value, + } ); + } } + disabled={ isProcessingAudio } + isBusy={ isProcessingAudio } + /> + + + + + ) } + { sourceUrl && ( + + ) } + + ); +}; + +registerPlugin( + 'classifai-text-to-speech', + { + render: TextToSpeechPlugin + } +); + + +let saveHappened = false; +let showingNotice = false; + +subscribe( () => { + if ( saveHappened === false ) { + saveHappened = wp.data.select( 'core/editor' ).isSavingPost() === true; + } + + if ( + saveHappened && + wp.data.select( 'core/editor' ).isSavingPost() === false && + showingNotice === false + ) { + const meta = wp.data + .select( 'core/editor' ) + .getCurrentPostAttribute( 'meta' ); + if ( meta && meta._classifai_text_to_speech_error ) { + showingNotice = true; + const error = JSON.parse( meta._classifai_text_to_speech_error ); + wp.data + .dispatch( 'core/notices' ) + .createErrorNotice( + `Audio generation failed. Error: ${ error.code } - ${ error.message }` + ); + saveHappened = false; + showingNotice = false; + } + } +} ); diff --git a/src/js/store/register.js b/src/js/plugins/text-to-speech/store.js similarity index 100% rename from src/js/store/register.js rename to src/js/plugins/text-to-speech/store.js diff --git a/webpack.config.js b/webpack.config.js index 6acba9b7c..7e566a80d 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -43,6 +43,9 @@ module.exports = { './src/js/media-modal/views/generate-image-media-upload.js', ], 'extend-image-blocks': './src/js/extend-image-block-generate-image.js', + + 'classifai-plugin-fill': './src/js/plugins/slot-fill/index.js', + 'classifai-plugin-text-to-speech': './src/js/plugins/text-to-speech/index.js', }, module: { rules: [ From ca7566f3d8663b6d64535356acf449068fc9010b Mon Sep 17 00:00:00 2001 From: Siddharth Thevaril Date: Thu, 19 Sep 2024 21:41:35 +0530 Subject: [PATCH 02/24] move classification out as a separate plugin --- .../Classifai/Features/Classification.php | 10 +- .../classification/classification-button.js} | 123 ++---------------- .../classification/classification-toggle.js | 34 +++++ src/js/plugins/classification/index.js | 66 ++++++++++ .../pre-publish-classify-post.js | 0 .../classification}/taxonomy-controls.js | 6 +- webpack.config.js | 2 +- 7 files changed, 120 insertions(+), 121 deletions(-) rename src/js/{gutenberg-plugin.js => plugins/classification/classification-button.js} (70%) create mode 100644 src/js/plugins/classification/classification-toggle.js create mode 100644 src/js/plugins/classification/index.js rename src/js/{gutenberg-plugins => plugins/classification}/pre-publish-classify-post.js (100%) rename src/js/{ => plugins/classification}/taxonomy-controls.js (98%) diff --git a/includes/Classifai/Features/Classification.php b/includes/Classifai/Features/Classification.php index f3b8427d7..8bd394a8a 100644 --- a/includes/Classifai/Features/Classification.php +++ b/includes/Classifai/Features/Classification.php @@ -338,15 +338,15 @@ public function enqueue_editor_assets() { } wp_enqueue_script( - 'classifai-gutenberg-plugin', - CLASSIFAI_PLUGIN_URL . 'dist/gutenberg-plugin.js', - array_merge( get_asset_info( 'gutenberg-plugin', 'dependencies' ), array( 'lodash' ) ), - get_asset_info( 'gutenberg-plugin', 'version' ), + 'classifai-plugin-classification-js', + CLASSIFAI_PLUGIN_URL . 'dist/classifai-plugin-classification.js', + array_merge( get_asset_info( 'classifai-plugin-classification', 'dependencies' ), array( 'lodash' ), array( Feature::PLUGIN_AREA_SCRIPT ) ), + get_asset_info( 'classifai-plugin-classification', 'version' ), true ); wp_add_inline_script( - 'classifai-gutenberg-plugin', + 'classifai-plugin-classification-js', sprintf( 'var classifaiPostData = %s;', wp_json_encode( diff --git a/src/js/gutenberg-plugin.js b/src/js/plugins/classification/classification-button.js similarity index 70% rename from src/js/gutenberg-plugin.js rename to src/js/plugins/classification/classification-button.js index 33f91e236..4b13fc4aa 100644 --- a/src/js/gutenberg-plugin.js +++ b/src/js/plugins/classification/classification-button.js @@ -1,71 +1,31 @@ -/* eslint-disable no-unused-vars */ -import { ReactComponent as icon } from '../../assets/img/block-icon.svg'; -import { handleClick } from './helpers'; -import { useSelect, useDispatch, subscribe } from '@wordpress/data'; -import { PluginDocumentSettingPanel } from '@wordpress/edit-post'; -import { - Button, - Icon, - ToggleControl, - Modal, -} from '@wordpress/components'; -import { __, sprintf } from '@wordpress/i18n'; -import { registerPlugin } from '@wordpress/plugins'; -import { useState } from '@wordpress/element'; -import TaxonomyControls from './taxonomy-controls'; -import PrePubClassifyPost from './gutenberg-plugins/pre-publish-classify-post'; -import { DisableFeatureButton } from './components'; - -const { classifaiPostData } = window; - /** - * Create the ClassifAI icon + * External dependencies. */ -const ClassifAIIcon = ( { icon } ) => ( - -); +import { select, dispatch, useSelect } from '@wordpress/data'; +import { useState } from '@wordpress/element'; +import { Button, Modal } from '@wordpress/components'; +import { __ } from '@wordpress/i18n'; /** - * ClassificationToggle Component. - * - * Used to toggle the classification process on or off. + * Internal dependencies. */ -const ClassificationToggle = () => { - // Use the datastore to retrieve all the meta for this post. - const processContent = useSelect( ( select ) => - select( 'core/editor' ).getEditedPostAttribute( - 'classifai_process_content' - ) - ); - - // Use the datastore to tell the post to update the meta. - const { editPost } = useDispatch( 'core/editor' ); - const enabled = 'yes' === processContent ? 'yes' : 'no'; - - return ( - { - editPost( { classifai_process_content: value ? 'yes' : 'no' } ); - } } - /> - ); -}; +import TaxonomyControls from './taxonomy-controls'; +import PrePubClassifyPost from './pre-publish-classify-post'; +import { DisableFeatureButton } from '../../components'; +import { handleClick } from '../../../js/helpers'; /** * Classify button. * * Used to manually classify the content. */ -const ClassificationButton = () => { +export const ClassificationButton = () => { const processContent = useSelect( ( select ) => select( 'core/editor' ).getEditedPostAttribute( 'classifai_process_content' ) ); - const { select, dispatch } = wp.data; const postId = select( 'core/editor' ).getCurrentPostId(); const postType = select( 'core/editor' ).getCurrentPostType(); const postTypeLabel = @@ -361,64 +321,3 @@ const ClassificationButton = () => { ); }; - -/** - * Add the ClassifAI panel to Gutenberg - */ -const ClassifAIPlugin = () => { - const postType = useSelect( ( select ) => - select( 'core/editor' ).getCurrentPostType() - ); - const postStatus = useSelect( ( select ) => - select( 'core/editor' ).getCurrentPostAttribute( 'status' ) - ); - - // Ensure that at least one feature is enabled. - const isNLULanguageProcessingEnabled = - classifaiPostData && classifaiPostData.NLUEnabled; - - // Ensure we are on a supported post type, checking settings from all features. - const isNLUPostTypeSupported = - classifaiPostData && - classifaiPostData.supportedPostTypes && - classifaiPostData.supportedPostTypes.includes( postType ); - - // Ensure we are on a supported post status, checking settings from all features. - const isNLUPostStatusSupported = - classifaiPostData && - classifaiPostData.supportedPostStatues && - classifaiPostData.supportedPostStatues.includes( postStatus ); - - // Ensure the user has permissions to use the feature. - const userHasNLUPermissions = - classifaiPostData && - ! ( - classifaiPostData.noPermissions && - 1 === parseInt( classifaiPostData.noPermissions ) - ); - - const nluPermissionCheck = - userHasNLUPermissions && - isNLULanguageProcessingEnabled && - isNLUPostTypeSupported && - isNLUPostStatusSupported; - - return ( - - <> - { nluPermissionCheck && ( - <> - - { nluPermissionCheck && } - - ) } - - - ); -}; - -registerPlugin( 'classifai-plugin', { render: ClassifAIPlugin } ); diff --git a/src/js/plugins/classification/classification-toggle.js b/src/js/plugins/classification/classification-toggle.js new file mode 100644 index 000000000..aefd99f5f --- /dev/null +++ b/src/js/plugins/classification/classification-toggle.js @@ -0,0 +1,34 @@ +/** + * Internal dependencies. + */ +import { ToggleControl } from '@wordpress/components'; +import { useSelect, useDispatch } from '@wordpress/data'; +import { __ } from '@wordpress/i18n'; + +/** + * ClassificationToggle Component. + * + * Used to toggle the classification process on or off. + */ +export const ClassificationToggle = () => { + // Use the datastore to retrieve all the meta for this post. + const processContent = useSelect( ( select ) => + select( 'core/editor' ).getEditedPostAttribute( + 'classifai_process_content' + ) + ); + + // Use the datastore to tell the post to update the meta. + const { editPost } = useDispatch( 'core/editor' ); + const enabled = 'yes' === processContent ? 'yes' : 'no'; + + return ( + { + editPost( { classifai_process_content: value ? 'yes' : 'no' } ); + } } + /> + ); +}; diff --git a/src/js/plugins/classification/index.js b/src/js/plugins/classification/index.js new file mode 100644 index 000000000..92ce2381f --- /dev/null +++ b/src/js/plugins/classification/index.js @@ -0,0 +1,66 @@ +/** + * External dependencies. + */ +import { useSelect } from '@wordpress/data'; +import { registerPlugin } from '@wordpress/plugins'; + +/** + * Internal dependencies. + */ +import { ClassifaiEditorSettingPanel } from '../slot-fill'; +import { ClassificationToggle } from './classification-toggle'; +import { ClassificationButton } from './classification-button'; + +const { classifaiPostData } = window; + +const ClassificationPlugin = () => { + const postType = useSelect( ( select ) => + select( 'core/editor' ).getCurrentPostType() + ); + const postStatus = useSelect( ( select ) => + select( 'core/editor' ).getCurrentPostAttribute( 'status' ) + ); + + // Ensure we are on a supported post type, checking settings from all features. + const isNLUPostTypeSupported = + classifaiPostData && + classifaiPostData.supportedPostTypes && + classifaiPostData.supportedPostTypes.includes( postType ); + + // Ensure we are on a supported post status, checking settings from all features. + const isNLUPostStatusSupported = + classifaiPostData && + classifaiPostData.supportedPostStatues && + classifaiPostData.supportedPostStatues.includes( postStatus ); + + // Ensure the user has permissions to use the feature. + const userHasNLUPermissions = + classifaiPostData && + ! ( + classifaiPostData.noPermissions && + 1 === parseInt( classifaiPostData.noPermissions ) + ); + + const nluPermissionCheck = + userHasNLUPermissions && + isNLUPostTypeSupported && + isNLUPostStatusSupported; + + return ( + <> + { nluPermissionCheck && ( + + + + + ) } + + ); +}; + +registerPlugin( + 'classifai-text-to-speech', + { + render: ClassificationPlugin + } +); diff --git a/src/js/gutenberg-plugins/pre-publish-classify-post.js b/src/js/plugins/classification/pre-publish-classify-post.js similarity index 100% rename from src/js/gutenberg-plugins/pre-publish-classify-post.js rename to src/js/plugins/classification/pre-publish-classify-post.js diff --git a/src/js/taxonomy-controls.js b/src/js/plugins/classification/taxonomy-controls.js similarity index 98% rename from src/js/taxonomy-controls.js rename to src/js/plugins/classification/taxonomy-controls.js index 4e43daa8a..c7e20dcfd 100644 --- a/src/js/taxonomy-controls.js +++ b/src/js/plugins/classification/taxonomy-controls.js @@ -10,7 +10,7 @@ import { store as coreStore } from '@wordpress/core-data'; import { getEntitiesInfo, useTaxonomies, -} from '../../includes/Classifai/Blocks/recommended-content-block/utils'; +} from '../../../../includes/Classifai/Blocks/recommended-content-block/utils'; import { useState } from '@wordpress/element'; import { __, sprintf } from '@wordpress/i18n'; @@ -274,7 +274,7 @@ const TaxonomyControls = ( { onChange, query } ) => { } return ( - <> + { ) }
- + ); } ) } diff --git a/webpack.config.js b/webpack.config.js index 7e566a80d..ce3f03649 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -13,7 +13,6 @@ module.exports = { media: [ './src/js/media.js' ], admin: [ './src/js/admin.js' ], 'language-processing': [ './src/js/language-processing.js' ], - 'gutenberg-plugin': [ './src/js/gutenberg-plugin.js' ], 'post-audio-controls': [ './src/js/post-audio-controls.js' ], 'post-status-info': [ './src/js/gutenberg-plugins/post-status-info.js', @@ -44,6 +43,7 @@ module.exports = { ], 'extend-image-blocks': './src/js/extend-image-block-generate-image.js', + 'classifai-plugin-classification': './src/js/plugins/classification/index.js', 'classifai-plugin-fill': './src/js/plugins/slot-fill/index.js', 'classifai-plugin-text-to-speech': './src/js/plugins/text-to-speech/index.js', }, From a385f737d4365f3422cbf166bbcd3200d18f515d Mon Sep 17 00:00:00 2001 From: Siddharth Thevaril Date: Thu, 19 Sep 2024 22:00:29 +0530 Subject: [PATCH 03/24] move content resizing out as a separate plugin --- includes/Classifai/Features/ContentResizing.php | 14 +++++++------- .../content-resizing/index.js} | 6 +++--- webpack.config.js | 7 +------ 3 files changed, 11 insertions(+), 16 deletions(-) rename src/js/{gutenberg-plugins/content-resizing-plugin.js => plugins/content-resizing/index.js} (98%) diff --git a/includes/Classifai/Features/ContentResizing.php b/includes/Classifai/Features/ContentResizing.php index 34836ade0..be1914f55 100644 --- a/includes/Classifai/Features/ContentResizing.php +++ b/includes/Classifai/Features/ContentResizing.php @@ -189,18 +189,18 @@ public function enqueue_editor_assets() { } wp_enqueue_script( - 'classifai-content-resizing-plugin-js', - CLASSIFAI_PLUGIN_URL . 'dist/content-resizing-plugin.js', - get_asset_info( 'content-resizing-plugin', 'dependencies' ), - get_asset_info( 'content-resizing-plugin', 'version' ), + 'classifai-plugin-content-resizing-js', + CLASSIFAI_PLUGIN_URL . 'dist/classifai-plugin-content-resizing.js', + get_asset_info( 'classifai-plugin-content-resizing', 'dependencies' ), + get_asset_info( 'classifai-plugin-content-resizing', 'version' ), true ); wp_enqueue_style( - 'classifai-content-resizing-plugin-css', - CLASSIFAI_PLUGIN_URL . 'dist/content-resizing-plugin.css', + 'classifai-plugin-content-resizing-css', + CLASSIFAI_PLUGIN_URL . 'dist/classifai-plugin-content-resizing.css', [], - get_asset_info( 'content-resizing-plugin', 'version' ), + get_asset_info( 'classifai-plugin-content-resizing', 'version' ), 'all' ); } diff --git a/src/js/gutenberg-plugins/content-resizing-plugin.js b/src/js/plugins/content-resizing/index.js similarity index 98% rename from src/js/gutenberg-plugins/content-resizing-plugin.js rename to src/js/plugins/content-resizing/index.js index 31ba78255..6a3fcb88d 100644 --- a/src/js/gutenberg-plugins/content-resizing-plugin.js +++ b/src/js/plugins/content-resizing/index.js @@ -23,8 +23,8 @@ import { } from '@wordpress/wordcount'; import { __, _nx } from '@wordpress/i18n'; -import { DisableFeatureButton } from '../components'; -import '../../scss/content-resizing-plugin.scss'; +import { DisableFeatureButton } from '../../components'; +import '../../../scss/content-resizing-plugin.scss'; const aiIconSvg = ( Date: Thu, 19 Sep 2024 22:01:37 +0530 Subject: [PATCH 04/24] move title generation out as a separate plugin --- .../Classifai/Features/TitleGeneration.php | 10 +- src/js/gutenberg-plugins/post-status-info.js | 4 +- src/js/plugins/title-generation/index.js | 155 ++++++++++++++++++ webpack.config.js | 1 + 4 files changed, 163 insertions(+), 7 deletions(-) create mode 100644 src/js/plugins/title-generation/index.js diff --git a/includes/Classifai/Features/TitleGeneration.php b/includes/Classifai/Features/TitleGeneration.php index be6646471..128a7cee4 100644 --- a/includes/Classifai/Features/TitleGeneration.php +++ b/includes/Classifai/Features/TitleGeneration.php @@ -200,15 +200,15 @@ public function enqueue_editor_assets() { } wp_enqueue_script( - 'classifai-post-status-info', - CLASSIFAI_PLUGIN_URL . 'dist/post-status-info.js', - get_asset_info( 'post-status-info', 'dependencies' ), - get_asset_info( 'post-status-info', 'version' ), + 'classifai-plugin-title-generation-js', + CLASSIFAI_PLUGIN_URL . 'dist/classifai-plugin-title-generation.js', + get_asset_info( 'classifai-plugin-title-generation', 'dependencies' ), + get_asset_info( 'classifai-plugin-title-generation', 'version' ), true ); wp_add_inline_script( - 'classifai-post-status-info', + 'classifai-plugin-title-generation-js', sprintf( 'var classifaiChatGPTData = %s;', wp_json_encode( $this->get_localised_vars() ) diff --git a/src/js/gutenberg-plugins/post-status-info.js b/src/js/gutenberg-plugins/post-status-info.js index d386b9cd7..f970b0e83 100644 --- a/src/js/gutenberg-plugins/post-status-info.js +++ b/src/js/gutenberg-plugins/post-status-info.js @@ -18,7 +18,7 @@ const RenderError = ( { error } ) => { return
{ error }
; }; -const PostStatusInfo = () => { +const TextGenerationPlugin = () => { const [ isLoading, setIsLoading ] = useState( false ); const [ isOpen, setOpen ] = useState( false ); const [ error, setError ] = useState( false ); @@ -153,4 +153,4 @@ const PostStatusInfo = () => { ); }; -registerPlugin( 'classifai-status-info', { render: PostStatusInfo } ); +registerPlugin( 'classifai-plugin-text-generation', { render: TextGenerationPlugin } ); diff --git a/src/js/plugins/title-generation/index.js b/src/js/plugins/title-generation/index.js new file mode 100644 index 000000000..33f95f8bf --- /dev/null +++ b/src/js/plugins/title-generation/index.js @@ -0,0 +1,155 @@ +import { dispatch, select } from '@wordpress/data'; +import { PluginPostStatusInfo } from '@wordpress/edit-post'; +import { PostTypeSupportCheck } from '@wordpress/editor'; +import { Button, Modal, Spinner } from '@wordpress/components'; +import { __ } from '@wordpress/i18n'; +import { registerPlugin } from '@wordpress/plugins'; +import { useState } from '@wordpress/element'; +import apiFetch from '@wordpress/api-fetch'; +import { DisableFeatureButton } from '../../components'; + +const { classifaiChatGPTData } = window; + +const RenderError = ( { error } ) => { + if ( ! error ) { + return null; + } + + return
{ error }
; +}; + +const TitleGenerationPlugin = () => { + const [ isLoading, setIsLoading ] = useState( false ); + const [ isOpen, setOpen ] = useState( false ); + const [ error, setError ] = useState( false ); + const [ data, setData ] = useState( [] ); + + if ( ! classifaiChatGPTData || ! classifaiChatGPTData.enabledFeatures ) { + return null; + } + + // Ensure the user has proper permissions + if ( + classifaiChatGPTData.noPermissions && + 1 === parseInt( classifaiChatGPTData.noPermissions ) + ) { + return null; + } + + const postId = select( 'core/editor' ).getCurrentPostId(); + const postType = select( 'core/editor' ).getCurrentPostType(); + const postContent = + select( 'core/editor' ).getEditedPostAttribute( 'content' ); + const openModal = () => setOpen( true ); + const closeModal = () => + setOpen( false ) && setData( [] ) && setError( false ); + + const buttonClick = async ( path ) => { + setIsLoading( true ); + openModal(); + apiFetch( { + path, + method: 'POST', + data: { id: postId, content: postContent }, + } ).then( + ( res ) => { + setData( res ); + setError( false ); + setIsLoading( false ); + }, + ( err ) => { + setError( err?.message ); + setData( [] ); + setIsLoading( false ); + } + ); + }; + + const RenderData = ( { data: dataToRender } ) => { + if ( ! dataToRender ) { + return null; + } + + return ( + <> + { dataToRender.map( ( item, i ) => { + return ( +
+ - -
- ); - } ) } - - ); - }; - - return ( - - { isOpen && ( - - { isLoading && } - { ! isLoading && data && } - { ! isLoading && error && } - { ! isLoading && ( - - ) } - - ) } - { classifaiChatGPTData.enabledFeatures.map( ( feature ) => { - const path = feature?.path; - return ( - - - - ); - } ) } - - ); -}; - -registerPlugin( 'classifai-plugin-text-generation', { render: TextGenerationPlugin } ); diff --git a/src/js/post-excerpt/index.js b/src/js/plugins/excerpt-generation/index.js similarity index 100% rename from src/js/post-excerpt/index.js rename to src/js/plugins/excerpt-generation/index.js diff --git a/src/js/post-excerpt/maybe-excerpt-panel.js b/src/js/plugins/excerpt-generation/maybe-excerpt-panel.js similarity index 100% rename from src/js/post-excerpt/maybe-excerpt-panel.js rename to src/js/plugins/excerpt-generation/maybe-excerpt-panel.js diff --git a/src/js/post-excerpt/panel.js b/src/js/plugins/excerpt-generation/panel.js similarity index 98% rename from src/js/post-excerpt/panel.js rename to src/js/plugins/excerpt-generation/panel.js index e4ba898c3..88cafb089 100644 --- a/src/js/post-excerpt/panel.js +++ b/src/js/plugins/excerpt-generation/panel.js @@ -7,7 +7,7 @@ import { withSelect, withDispatch } from '@wordpress/data'; import { compose } from '@wordpress/compose'; import { useState } from '@wordpress/element'; import apiFetch from '@wordpress/api-fetch'; -import { DisableFeatureButton } from '../components'; +import { DisableFeatureButton } from '../../components'; /** * PostExcerpt component. diff --git a/webpack.config.js b/webpack.config.js index 90012a04d..ea2631512 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -20,7 +20,6 @@ module.exports = { 'recommended-content-block-frontend': [ './includes/Classifai/Blocks/recommended-content-block/frontend.js', ], - 'post-excerpt': [ './src/js/post-excerpt/index.js' ], 'media-modal': [ './src/js/media-modal/index.js' ], 'inserter-media-category': [ './src/js/gutenberg-plugins/inserter-media-category.js', @@ -42,6 +41,7 @@ module.exports = { 'classifai-plugin-text-to-speech': './src/js/plugins/text-to-speech/index.js', 'classifai-plugin-content-resizing': './src/js/plugins/content-resizing/index.js', 'classifai-plugin-title-generation': './src/js/plugins/title-generation/index.js', + 'classifai-plugin-excerpt-generation': './src/js/plugins/excerpt-generation/index.js', }, module: { rules: [ From 76967bd485c46c12264506535b2b409bf6f32fc0 Mon Sep 17 00:00:00 2001 From: Siddharth Thevaril Date: Thu, 19 Sep 2024 23:23:16 +0530 Subject: [PATCH 07/24] move title and exerpt generation (classic) out as a separate plugin --- .../Classifai/Features/ExcerptGeneration.php | 16 ++++++++-------- includes/Classifai/Features/TitleGeneration.php | 14 +++++++------- .../excerpt-generation/classic/index.js} | 2 +- .../title-generation/classic/index.js} | 2 +- webpack.config.js | 8 ++------ 5 files changed, 19 insertions(+), 23 deletions(-) rename src/js/{openai/classic-editor-excerpt-generator.js => plugins/excerpt-generation/classic/index.js} (97%) rename src/js/{openai/classic-editor-title-generator.js => plugins/title-generation/classic/index.js} (98%) diff --git a/includes/Classifai/Features/ExcerptGeneration.php b/includes/Classifai/Features/ExcerptGeneration.php index 2af8fd0af..073bafa7d 100644 --- a/includes/Classifai/Features/ExcerptGeneration.php +++ b/includes/Classifai/Features/ExcerptGeneration.php @@ -220,23 +220,23 @@ public function enqueue_admin_assets( string $hook_suffix ) { if ( $screen && ! $screen->is_block_editor() ) { if ( post_type_supports( $screen->post_type, 'excerpt' ) ) { wp_enqueue_style( - 'classifai-generate-title-classic-css', - CLASSIFAI_PLUGIN_URL . 'dist/generate-title-classic.css', + 'classifai-plugin-classic-title-generation-css', + CLASSIFAI_PLUGIN_URL . 'dist/classifai-plugin-classic-title-generation.css', [], - get_asset_info( 'generate-title-classic', 'version' ), + get_asset_info( 'classifai-plugin-classic-title-generation', 'version' ), 'all' ); wp_enqueue_script( - 'classifai-generate-excerpt-classic-js', - CLASSIFAI_PLUGIN_URL . 'dist/generate-excerpt-classic.js', - array_merge( get_asset_info( 'generate-excerpt-classic', 'dependencies' ), array( 'wp-api' ) ), - get_asset_info( 'generate-excerpt-classic', 'version' ), + 'classifai-plugin-classic-excerpt-generation-js', + CLASSIFAI_PLUGIN_URL . 'dist/classifai-plugin-classic-excerpt-generation.js', + array_merge( get_asset_info( 'classifai-plugin-classic-excerpt-generation', 'dependencies' ), array( 'wp-api' ) ), + get_asset_info( 'classifai-plugin-classic-excerpt-generation', 'version' ), true ); wp_add_inline_script( - 'classifai-generate-excerpt-classic-js', + 'classifai-plugin-classic-excerpt-generation-js', sprintf( 'var classifaiGenerateExcerpt = %s;', wp_json_encode( diff --git a/includes/Classifai/Features/TitleGeneration.php b/includes/Classifai/Features/TitleGeneration.php index 128a7cee4..ecd28a6b3 100644 --- a/includes/Classifai/Features/TitleGeneration.php +++ b/includes/Classifai/Features/TitleGeneration.php @@ -231,23 +231,23 @@ public function enqueue_admin_assets( string $hook_suffix ) { if ( $screen && ! $screen->is_block_editor() ) { if ( post_type_supports( $screen->post_type, 'title' ) ) { wp_enqueue_style( - 'classifai-generate-title-classic-css', - CLASSIFAI_PLUGIN_URL . 'dist/generate-title-classic.css', + 'classifai-plugin-classic-title-generation-css', + CLASSIFAI_PLUGIN_URL . 'dist/classifai-plugin-classic-title-generation.css', [], - get_asset_info( 'generate-title-classic', 'version' ), + get_asset_info( 'classifai-plugin-classic-title-generation', 'version' ), 'all' ); wp_enqueue_script( - 'classifai-generate-title-classic-js', - CLASSIFAI_PLUGIN_URL . 'dist/generate-title-classic.js', - array_merge( get_asset_info( 'generate-title-classic', 'dependencies' ), array( 'wp-api' ) ), + 'classifai-plugin-classic-title-generation-js', + CLASSIFAI_PLUGIN_URL . 'dist/classifai-plugin-classic-title-generation.js', + array_merge( get_asset_info( 'classifai-plugin-classic-title-generation', 'dependencies' ), array( 'wp-api' ) ), get_asset_info( 'generate-title-classic', 'version' ), true ); wp_add_inline_script( - 'classifai-generate-title-classic-js', + 'classifai-plugin-classic-title-generation-js', sprintf( 'var classifaiChatGPTData = %s;', wp_json_encode( $this->get_localised_vars() ) diff --git a/src/js/openai/classic-editor-excerpt-generator.js b/src/js/plugins/excerpt-generation/classic/index.js similarity index 97% rename from src/js/openai/classic-editor-excerpt-generator.js rename to src/js/plugins/excerpt-generation/classic/index.js index df4fe7f19..325ea9519 100644 --- a/src/js/openai/classic-editor-excerpt-generator.js +++ b/src/js/plugins/excerpt-generation/classic/index.js @@ -1,6 +1,6 @@ import { __ } from '@wordpress/i18n'; import apiFetch from '@wordpress/api-fetch'; -import '../../scss/openai/classic-editor-title-generator.scss'; +import '../../../../scss/openai/classic-editor-title-generator.scss'; const ClassifAI = window.ClassifAI || {}; const classifaiExcerptData = window.classifaiGenerateExcerpt || {}; diff --git a/src/js/openai/classic-editor-title-generator.js b/src/js/plugins/title-generation/classic/index.js similarity index 98% rename from src/js/openai/classic-editor-title-generator.js rename to src/js/plugins/title-generation/classic/index.js index dcfe7e5ab..36730fb87 100644 --- a/src/js/openai/classic-editor-title-generator.js +++ b/src/js/plugins/title-generation/classic/index.js @@ -1,6 +1,6 @@ import { __ } from '@wordpress/i18n'; import apiFetch from '@wordpress/api-fetch'; -import '../../scss/openai/classic-editor-title-generator.scss'; +import '../../../../scss/openai/classic-editor-title-generator.scss'; const ClassifAI = window.ClassifAI || {}; const classifaiChatGPTData = window.classifaiChatGPTData || {}; diff --git a/webpack.config.js b/webpack.config.js index ea2631512..e3af357b0 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -24,12 +24,6 @@ module.exports = { 'inserter-media-category': [ './src/js/gutenberg-plugins/inserter-media-category.js', ], - 'generate-excerpt-classic': [ - './src/js/openai/classic-editor-excerpt-generator.js', - ], - 'generate-title-classic': [ - './src/js/openai/classic-editor-title-generator.js', - ], commands: [ './src/js/gutenberg-plugins/commands.js' ], 'generate-image-media-upload': [ './src/js/media-modal/views/generate-image-media-upload.js', @@ -41,7 +35,9 @@ module.exports = { 'classifai-plugin-text-to-speech': './src/js/plugins/text-to-speech/index.js', 'classifai-plugin-content-resizing': './src/js/plugins/content-resizing/index.js', 'classifai-plugin-title-generation': './src/js/plugins/title-generation/index.js', + 'classifai-plugin-classic-title-generation': './src/js/plugins/title-generation/classic/index.js', 'classifai-plugin-excerpt-generation': './src/js/plugins/excerpt-generation/index.js', + 'classifai-plugin-classic-excerpt-generation': './src/js/plugins/excerpt-generation/classic/index.js', }, module: { rules: [ From dce784f12eace6763fbc106bba560a28f3f186ca Mon Sep 17 00:00:00 2001 From: Siddharth Thevaril Date: Thu, 19 Sep 2024 23:42:50 +0530 Subject: [PATCH 08/24] move image generation out as a separate plugin --- .../Classifai/Features/ImageGeneration.php | 34 +++++++++---------- .../inserter-media-category.js | 0 .../media-modal/collections/images.js | 0 .../image-generation}/media-modal/index.js | 2 +- .../media-modal/models/image.js | 0 .../media-modal/views/error-message.js | 0 .../views/generate-image-media-upload.js | 0 .../media-modal/views/generated-image.js | 0 .../views/generated-images-container.js | 0 .../media-modal/views/prompt.js | 0 webpack.config.js | 10 ++---- 11 files changed, 21 insertions(+), 25 deletions(-) rename src/js/{gutenberg-plugins => plugins/image-generation}/inserter-media-category.js (100%) rename src/js/{ => plugins/image-generation}/media-modal/collections/images.js (100%) rename src/js/{ => plugins/image-generation}/media-modal/index.js (98%) rename src/js/{ => plugins/image-generation}/media-modal/models/image.js (100%) rename src/js/{ => plugins/image-generation}/media-modal/views/error-message.js (100%) rename src/js/{ => plugins/image-generation}/media-modal/views/generate-image-media-upload.js (100%) rename src/js/{ => plugins/image-generation}/media-modal/views/generated-image.js (100%) rename src/js/{ => plugins/image-generation}/media-modal/views/generated-images-container.js (100%) rename src/js/{ => plugins/image-generation}/media-modal/views/prompt.js (100%) diff --git a/includes/Classifai/Features/ImageGeneration.php b/includes/Classifai/Features/ImageGeneration.php index 56df86aef..13f8873e2 100644 --- a/includes/Classifai/Features/ImageGeneration.php +++ b/includes/Classifai/Features/ImageGeneration.php @@ -186,26 +186,26 @@ public function enqueue_admin_scripts( string $hook_suffix = '' ) { wp_enqueue_media(); wp_enqueue_style( - 'classifai-image-processing-style', - CLASSIFAI_PLUGIN_URL . 'dist/media-modal.css', + 'classifai-plugin-image-generation-media-modal-css', + CLASSIFAI_PLUGIN_URL . 'dist/classifai-plugin-image-generation-media-modal.css', [], - get_asset_info( 'media-modal', 'version' ), + get_asset_info( 'classifai-plugin-image-generation-media-modal', 'version' ), 'all' ); wp_enqueue_script( - 'classifai-generate-images', - CLASSIFAI_PLUGIN_URL . 'dist/media-modal.js', - array_merge( get_asset_info( 'media-modal', 'dependencies' ), array( 'jquery', 'wp-api' ) ), - get_asset_info( 'media-modal', 'version' ), + 'classifai-plugin-image-generation-media-modal-js', + CLASSIFAI_PLUGIN_URL . 'dist/classifai-plugin-image-generation-media-modal.js', + array_merge( get_asset_info( 'classifai-plugin-image-generation-media-modal', 'dependencies' ), array( 'jquery', 'wp-api' ) ), + get_asset_info( 'classifai-plugin-image-generation-media-modal', 'version' ), true ); wp_enqueue_script( - 'classifai-inserter-media-category', - CLASSIFAI_PLUGIN_URL . 'dist/inserter-media-category.js', - get_asset_info( 'inserter-media-category', 'dependencies' ), - get_asset_info( 'inserter-media-category', 'version' ), + 'classifai-plugin-inserter-media-category-js', + CLASSIFAI_PLUGIN_URL . 'dist/classifai-plugin-inserter-media-category.js', + get_asset_info( 'classifai-plugin-inserter-media-category', 'dependencies' ), + get_asset_info( 'classifai-plugin-inserter-media-category', 'version' ), true ); @@ -237,7 +237,7 @@ public function enqueue_admin_scripts( string $hook_suffix = '' ) { ); wp_localize_script( - 'classifai-generate-images', + 'classifai-plugin-image-generation-media-modal-js', 'classifaiDalleData', [ 'endpoint' => 'classifai/v1/generate-image', @@ -253,15 +253,15 @@ public function enqueue_admin_scripts( string $hook_suffix = '' ) { if ( 'classifai-generate-image' === $action ) { wp_enqueue_script( - 'classifai-generate-images-media-upload', - CLASSIFAI_PLUGIN_URL . 'dist/generate-image-media-upload.js', - array_merge( get_asset_info( 'generate-image-media-upload', 'dependencies' ), array( 'jquery' ) ), - get_asset_info( 'classifai-generate-images-media-upload', 'version' ), + 'classifai-plugin-image-generation-generate-image-media-upload-js', + CLASSIFAI_PLUGIN_URL . 'dist/classifai-plugin-image-generation-generate-image-media-upload.js', + array_merge( get_asset_info( 'classifai-plugin-image-generation-generate-image-media-upload', 'dependencies' ), array( 'jquery' ) ), + get_asset_info( 'classifai-plugin-image-generation-generate-image-media-upload', 'version' ), true ); wp_localize_script( - 'classifai-generate-images-media-upload', + 'classifai-plugin-image-generation-generate-image-media-upload-js', 'classifaiGenerateImages', [ 'upload_url' => esc_url( admin_url( 'upload.php' ) ), diff --git a/src/js/gutenberg-plugins/inserter-media-category.js b/src/js/plugins/image-generation/inserter-media-category.js similarity index 100% rename from src/js/gutenberg-plugins/inserter-media-category.js rename to src/js/plugins/image-generation/inserter-media-category.js diff --git a/src/js/media-modal/collections/images.js b/src/js/plugins/image-generation/media-modal/collections/images.js similarity index 100% rename from src/js/media-modal/collections/images.js rename to src/js/plugins/image-generation/media-modal/collections/images.js diff --git a/src/js/media-modal/index.js b/src/js/plugins/image-generation/media-modal/index.js similarity index 98% rename from src/js/media-modal/index.js rename to src/js/plugins/image-generation/media-modal/index.js index 75dcabb65..d7474b285 100644 --- a/src/js/media-modal/index.js +++ b/src/js/plugins/image-generation/media-modal/index.js @@ -1,7 +1,7 @@ /* eslint object-shorthand: 0 */ import Prompt from './views/prompt'; -import '../../scss/media-modal.scss'; +import '../../../../scss/media-modal.scss'; const currentMediaSelectFrame = wp.media.view.MediaFrame.Select; const currentPostFrame = wp.media.view.MediaFrame.Post; diff --git a/src/js/media-modal/models/image.js b/src/js/plugins/image-generation/media-modal/models/image.js similarity index 100% rename from src/js/media-modal/models/image.js rename to src/js/plugins/image-generation/media-modal/models/image.js diff --git a/src/js/media-modal/views/error-message.js b/src/js/plugins/image-generation/media-modal/views/error-message.js similarity index 100% rename from src/js/media-modal/views/error-message.js rename to src/js/plugins/image-generation/media-modal/views/error-message.js diff --git a/src/js/media-modal/views/generate-image-media-upload.js b/src/js/plugins/image-generation/media-modal/views/generate-image-media-upload.js similarity index 100% rename from src/js/media-modal/views/generate-image-media-upload.js rename to src/js/plugins/image-generation/media-modal/views/generate-image-media-upload.js diff --git a/src/js/media-modal/views/generated-image.js b/src/js/plugins/image-generation/media-modal/views/generated-image.js similarity index 100% rename from src/js/media-modal/views/generated-image.js rename to src/js/plugins/image-generation/media-modal/views/generated-image.js diff --git a/src/js/media-modal/views/generated-images-container.js b/src/js/plugins/image-generation/media-modal/views/generated-images-container.js similarity index 100% rename from src/js/media-modal/views/generated-images-container.js rename to src/js/plugins/image-generation/media-modal/views/generated-images-container.js diff --git a/src/js/media-modal/views/prompt.js b/src/js/plugins/image-generation/media-modal/views/prompt.js similarity index 100% rename from src/js/media-modal/views/prompt.js rename to src/js/plugins/image-generation/media-modal/views/prompt.js diff --git a/webpack.config.js b/webpack.config.js index e3af357b0..eb19b0ec6 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -20,14 +20,7 @@ module.exports = { 'recommended-content-block-frontend': [ './includes/Classifai/Blocks/recommended-content-block/frontend.js', ], - 'media-modal': [ './src/js/media-modal/index.js' ], - 'inserter-media-category': [ - './src/js/gutenberg-plugins/inserter-media-category.js', - ], commands: [ './src/js/gutenberg-plugins/commands.js' ], - 'generate-image-media-upload': [ - './src/js/media-modal/views/generate-image-media-upload.js', - ], 'extend-image-blocks': './src/js/extend-image-block-generate-image.js', 'classifai-plugin-classification': './src/js/plugins/classification/index.js', @@ -38,6 +31,9 @@ module.exports = { 'classifai-plugin-classic-title-generation': './src/js/plugins/title-generation/classic/index.js', 'classifai-plugin-excerpt-generation': './src/js/plugins/excerpt-generation/index.js', 'classifai-plugin-classic-excerpt-generation': './src/js/plugins/excerpt-generation/classic/index.js', + 'classifai-plugin-inserter-media-category': './src/js/plugins/image-generation/inserter-media-category.js', + 'classifai-plugin-image-generation-media-modal': './src/js/plugins/image-generation/media-modal/index.js', + 'classifai-plugin-image-generation-generate-image-media-upload': './src/js/plugins/image-generation/media-modal/views/generate-image-media-upload.js', }, module: { rules: [ From 803ff9e37a44867a02c1e1e83ff05104d84f2cf5 Mon Sep 17 00:00:00 2001 From: Siddharth Thevaril Date: Fri, 20 Sep 2024 17:05:54 +0530 Subject: [PATCH 09/24] move text to speech (frontend) out as a separate plugin --- includes/Classifai/Features/TextToSpeech.php | 14 +++++++------- .../text-to-speech/frontend/index.js} | 2 +- .../plugins/text-to-speech/frontend/index.scss} | 0 webpack.config.js | 2 +- 4 files changed, 9 insertions(+), 9 deletions(-) rename src/js/{post-audio-controls.js => plugins/text-to-speech/frontend/index.js} (96%) rename src/{scss/post-audio-controls.scss => js/plugins/text-to-speech/frontend/index.scss} (100%) diff --git a/includes/Classifai/Features/TextToSpeech.php b/includes/Classifai/Features/TextToSpeech.php index 8e8d9a21b..1f177fe0a 100644 --- a/includes/Classifai/Features/TextToSpeech.php +++ b/includes/Classifai/Features/TextToSpeech.php @@ -657,18 +657,18 @@ public function render_post_audio_controls( string $content ): string { } wp_enqueue_script( - 'classifai-post-audio-player-js', - CLASSIFAI_PLUGIN_URL . 'dist/post-audio-controls.js', - get_asset_info( 'post-audio-controls', 'dependencies' ), - get_asset_info( 'post-audio-controls', 'version' ), + 'classifai-plugin-text-to-speech-frontend-js', + CLASSIFAI_PLUGIN_URL . 'dist/classifai-plugin-text-to-speech-frontend.js', + get_asset_info( 'classifai-plugin-text-to-speech-frontend', 'dependencies' ), + get_asset_info( 'classifai-plugin-text-to-speech-frontend', 'version' ), true ); wp_enqueue_style( - 'classifai-post-audio-player-css', - CLASSIFAI_PLUGIN_URL . 'dist/post-audio-controls.css', + 'classifai-plugin-text-to-speech-frontend-css', + CLASSIFAI_PLUGIN_URL . 'dist/classifai-plugin-text-to-speech-frontend.css', array( 'dashicons' ), - get_asset_info( 'post-audio-controls', 'version' ), + get_asset_info( 'classifai-plugin-text-to-speech-frontend', 'version' ), 'all' ); diff --git a/src/js/post-audio-controls.js b/src/js/plugins/text-to-speech/frontend/index.js similarity index 96% rename from src/js/post-audio-controls.js rename to src/js/plugins/text-to-speech/frontend/index.js index 69b88df3d..d4df03cd0 100644 --- a/src/js/post-audio-controls.js +++ b/src/js/plugins/text-to-speech/frontend/index.js @@ -1,4 +1,4 @@ -import '../scss/post-audio-controls.scss'; +import './index.scss'; const audioControlEl = document.querySelector( '.class-post-audio-controls' ); const playBtn = document.querySelector( '.dashicons-controls-play' ); diff --git a/src/scss/post-audio-controls.scss b/src/js/plugins/text-to-speech/frontend/index.scss similarity index 100% rename from src/scss/post-audio-controls.scss rename to src/js/plugins/text-to-speech/frontend/index.scss diff --git a/webpack.config.js b/webpack.config.js index eb19b0ec6..c445ae3a9 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -13,7 +13,6 @@ module.exports = { media: [ './src/js/media.js' ], admin: [ './src/js/admin.js' ], 'language-processing': [ './src/js/language-processing.js' ], - 'post-audio-controls': [ './src/js/post-audio-controls.js' ], 'recommended-content-block': [ './includes/Classifai/Blocks/recommended-content-block/index.js', ], @@ -26,6 +25,7 @@ module.exports = { 'classifai-plugin-classification': './src/js/plugins/classification/index.js', 'classifai-plugin-fill': './src/js/plugins/slot-fill/index.js', 'classifai-plugin-text-to-speech': './src/js/plugins/text-to-speech/index.js', + 'classifai-plugin-text-to-speech-frontend': './src/js/plugins/text-to-speech/frontend/index.js', 'classifai-plugin-content-resizing': './src/js/plugins/content-resizing/index.js', 'classifai-plugin-title-generation': './src/js/plugins/title-generation/index.js', 'classifai-plugin-classic-title-generation': './src/js/plugins/title-generation/classic/index.js', From 6669139657568faada8e7c6f9ede186397f6abeb Mon Sep 17 00:00:00 2001 From: Siddharth Thevaril Date: Fri, 20 Sep 2024 17:10:09 +0530 Subject: [PATCH 10/24] move .scss files to feature directories --- src/js/plugins/content-resizing/index.js | 2 +- .../plugins/content-resizing/index.scss} | 0 src/js/plugins/image-generation/media-modal/index.js | 2 +- .../plugins/image-generation/media-modal/index.scss} | 0 4 files changed, 2 insertions(+), 2 deletions(-) rename src/{scss/content-resizing-plugin.scss => js/plugins/content-resizing/index.scss} (100%) rename src/{scss/media-modal.scss => js/plugins/image-generation/media-modal/index.scss} (100%) diff --git a/src/js/plugins/content-resizing/index.js b/src/js/plugins/content-resizing/index.js index 6a3fcb88d..66e9cccb3 100644 --- a/src/js/plugins/content-resizing/index.js +++ b/src/js/plugins/content-resizing/index.js @@ -24,7 +24,7 @@ import { import { __, _nx } from '@wordpress/i18n'; import { DisableFeatureButton } from '../../components'; -import '../../../scss/content-resizing-plugin.scss'; +import './index.scss'; const aiIconSvg = ( Date: Fri, 20 Sep 2024 17:50:59 +0530 Subject: [PATCH 11/24] fix title & excerpt generation implementation --- .../Classifai/Features/ExcerptGeneration.php | 6 +- .../Classifai/Features/TitleGeneration.php | 12 ++-- .../excerpt-generation/classic/index.js | 24 ++++---- .../excerpt-generation/classic/index.scss | 55 +++++++++++++++++++ .../plugins/title-generation/classic/index.js | 54 +++++++++--------- .../title-generation/classic/index.scss} | 43 ++------------- 6 files changed, 109 insertions(+), 85 deletions(-) create mode 100644 src/js/plugins/excerpt-generation/classic/index.scss rename src/{scss/openai/classic-editor-title-generator.scss => js/plugins/title-generation/classic/index.scss} (74%) diff --git a/includes/Classifai/Features/ExcerptGeneration.php b/includes/Classifai/Features/ExcerptGeneration.php index 073bafa7d..3431fe2c6 100644 --- a/includes/Classifai/Features/ExcerptGeneration.php +++ b/includes/Classifai/Features/ExcerptGeneration.php @@ -220,10 +220,10 @@ public function enqueue_admin_assets( string $hook_suffix ) { if ( $screen && ! $screen->is_block_editor() ) { if ( post_type_supports( $screen->post_type, 'excerpt' ) ) { wp_enqueue_style( - 'classifai-plugin-classic-title-generation-css', - CLASSIFAI_PLUGIN_URL . 'dist/classifai-plugin-classic-title-generation.css', + 'classifai-plugin-classic-excerpt-generation-css', + CLASSIFAI_PLUGIN_URL . 'dist/classifai-plugin-classic-excerpt-generation.css', [], - get_asset_info( 'classifai-plugin-classic-title-generation', 'version' ), + get_asset_info( 'classifai-plugin-classic-excerpt-generation', 'version' ), 'all' ); diff --git a/includes/Classifai/Features/TitleGeneration.php b/includes/Classifai/Features/TitleGeneration.php index ecd28a6b3..7af32c522 100644 --- a/includes/Classifai/Features/TitleGeneration.php +++ b/includes/Classifai/Features/TitleGeneration.php @@ -271,12 +271,12 @@ public function enqueue_admin_assets( string $hook_suffix ) { */ public function register_generated_titles_template() { ?> -