diff --git a/assets/js/src/form_editor/form_editor.jsx b/assets/js/src/form_editor/form_editor.jsx index 9c4b5e82a6..daef2d8520 100644 --- a/assets/js/src/form_editor/form_editor.jsx +++ b/assets/js/src/form_editor/form_editor.jsx @@ -6,6 +6,7 @@ import Notices from 'notices/notices.jsx'; import Editor from './components/editor.jsx'; import initStore from './store/store.jsx'; import { initBlocks } from './blocks/blocks.jsx'; +import initHooks from './hooks'; const App = () => ( @@ -22,6 +23,7 @@ window.addEventListener('DOMContentLoaded', () => { // Initialize WP API apiFetch.use(apiFetch.createRootURLMiddleware(window.wpApiSettings.root)); apiFetch.use(apiFetch.createNonceMiddleware(window.wpApiSettings.nonce)); + initHooks(); initStore(); initBlocks(); ReactDOM.render( diff --git a/assets/js/src/form_editor/hooks.tsx b/assets/js/src/form_editor/hooks.tsx new file mode 100644 index 0000000000..048fef1eef --- /dev/null +++ b/assets/js/src/form_editor/hooks.tsx @@ -0,0 +1,13 @@ +import { MediaUpload } from '@wordpress/media-utils'; +import { addFilter } from '@wordpress/hooks'; + +export default () => { + // This hook replaces dummy media upload buttons within Gutenberg + // see https://github.com/WordPress/gutenberg/blob/master/packages/block-editor/src/components/media-upload/README.md + const replaceMediaUpload = () => MediaUpload; + addFilter( + 'editor.MediaUpload', + 'mailpoet/form-editor/replace-media-upload', + replaceMediaUpload + ); +};