Add hook for media upload component

[MAILPOET-2750]

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 = () => (
   <GlobalContext.Provider value={useGlobalContextValue(window)}>
@@ -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(

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
+  );
+};