PLANET-7635 Move remaining code from plugin

This is in preparation to finally retire it

assets/src/block-editor/BlockFilters/ImageBlockEdit.js

@@ -0,0 +1,57 @@
+/**
+ * Return an editable image block
+ *
+ * - display image credits in caption during edition
+ *
+ * @param {Object} BlockEdit
+ * @return {Object} interface to edit images on the Editor
+ */
+export const ImageBlockEdit = BlockEdit => props => {
+  if ('core/image' !== props.name) {
+    return <BlockEdit {...props} />;
+  }
+
+  const {attributes, clientId} = props;
+  const {id, className = ''} = attributes;
+
+  // Get image data
+  const image = wp.data.useSelect(select => id ? select('core').getMedia(id) : null);
+  const credits = image?.meta?._credit_text;
+  const captionText = image?.caption?.raw;
+  // Compile data for insertion
+  let image_credits = null;
+  if (credits && credits.length > 0 && (!captionText || !captionText.includes(credits))) {
+    image_credits = credits.includes('©') ? credits : `© ${credits}`;
+  }
+
+  const block_id = clientId ? `block-${clientId}` : null;
+
+  // Update width and height when sized rounded styles are selected
+  if (className.includes('is-style-rounded-')) {
+    const classes = className.split(' ');
+    const size = classes.find(c => c.includes('is-style-rounded-')).replace('is-style-rounded-', '') || 180;
+    attributes.width = parseInt(size);
+    attributes.height = parseInt(size);
+  }
+
+  // Force to use square images when the class `square-*` is added
+  if (className.includes('square-')) {
+    const size = className.slice(className.search('square-') + 'square-'.length).split(' ')[0] || 180;
+    attributes.width = parseInt(size);
+    attributes.height = parseInt(size);
+  }
+
+  return (
+    <>
+      <BlockEdit {...props} />
+      {block_id && image_credits && (
+        captionText ?
+          <style dangerouslySetInnerHTML={{
+            __html: `#${block_id} figcaption::after { content: " ${image_credits}"; }`,
+          }}>
+          </style> :
+          <figcaption style={{marginTop: -24}}>{image_credits}</figcaption>
+      )}
+    </>
+  );
+};

assets/src/block-editor/BlockFilters/index.js

@@ -0,0 +1,40 @@
+const {addFilter} = wp.hooks;
+
+import {ImageBlockEdit} from './ImageBlockEdit';
+
+export const addBlockFilters = () => {
+  addFileBlockFilter();
+  addImageBlockFilter();
+  addGravityFormsBlockFilter();
+};
+
+const addFileBlockFilter = () => {
+  const setDownloadButtonToggleDefualtFalse = (settings, name) => {
+    if ('core/file' !== name) {
+      return settings;
+    }
+
+    settings.attributes.showDownloadButton.default = false;
+
+    return settings;
+  };
+
+  addFilter('blocks.registerBlockType', 'planet4-blocks/filters/file', setDownloadButtonToggleDefualtFalse);
+};
+
+const addImageBlockFilter = () => addFilter('editor.BlockEdit', 'core/image/edit', ImageBlockEdit);
+
+// Enforce "AJAX" toggle setting enabled by default, on Gravity form block.
+const addGravityFormsBlockFilter = () => {
+  const setAJAXToggleDefaultTrue = (settings, name) => {
+    if ('gravityforms/form' !== name) {
+      return settings;
+    }
+
+    settings.attributes.ajax.default = true;
+
+    return settings;
+  };
+
+  addFilter('blocks.registerBlockType', 'planet4-blocks/filters/file', setAJAXToggleDefaultTrue);
+};

assets/src/block-editor/addButtonLinkPasteWarning.js

@@ -0,0 +1,18 @@
+export const addButtonLinkPasteWarning = () => document.addEventListener('DOMContentLoaded', () => {
+  document.onpaste = event => {
+    const {target} = event;
+    if (!target.matches('.wp-block-button__link, .wp-block-button__link *')) {
+      return;
+    }
+
+    const aTags = target.querySelectorAll('a');
+    if (aTags.length) {
+      const {__} = wp.i18n;
+      // eslint-disable-next-line no-alert
+      alert(__(
+        'You are pasting a link into the button text. Please ensure your clipboard only has text in it. Alternatively you can press control/command + SHIFT + V to paste only the text in your clipboard.',
+        'planet4-blocks-backend'
+      ));
+    }
+  };
+});

assets/src/editorIndex.js

@@ -12,6 +12,8 @@ import {registerColumnsBlock} from './blocks/Columns/ColumnsBlock';
 import {registerBlockStyles} from './block-styles';
 import {registerBlockVariations} from './block-variations';
 import {registerActionButtonTextBlock} from './blocks/ActionCustomButtonText';
+import {addButtonLinkPasteWarning} from './block-editor/addButtonLinkPasteWarning';
+import {addBlockFilters} from './block-editor/BlockFilters';
 
 wp.domReady(() => {
   // Blocks
@@ -37,10 +39,10 @@ wp.domReady(() => {
 
   // Block variations
   registerBlockVariations();
-});
-
-setupCustomSidebar();
+  setupQueryLoopBlockExtension();
 
-// Setup new attributes to the core/query.
-// It should be executed after the DOM is ready
-setupQueryLoopBlockExtension();
+  // Editor behaviour.
+  setupCustomSidebar();
+  addButtonLinkPasteWarning();
+  addBlockFilters();
+});

assets/src/scss/blocks.scss

@@ -29,6 +29,7 @@
 @import "blocks/core-overrides/Columns";
 @import "blocks/core-overrides/Heading";
 @import "blocks/core-overrides/Embed";
+@import "blocks/core-overrides/File";
 
 // Other
 @import "blocks/WideBlocks";

assets/src/scss/blocks/core-overrides/File.scss

@@ -0,0 +1,6 @@
+.wp-block-file .wp-block-file__button {
+  overflow: unset;
+  padding: 0 1em;
+  margin-inline-start: 1em;
+  font-size: .8em;
+}