[Feature] translate rich text blocks

README.md

@@ -74,9 +74,10 @@ module.exports = {
  },
  // Which field types are translated (default string, text, richtext, components and dynamiczones)
  // Either string or object with type and format
- // Possible formats: plain, markdown, html (default plain)
+ // Possible formats: plain, markdown, html, jsonb (default plain)
  translatedFieldTypes: [
  'string',
+ { type: 'blocks', format: 'jsonb' },
  { type: 'text', format: 'plain' },
  { type: 'richtext', format: 'markdown' },
  'component',

playground/config/plugins.js

@@ -6,6 +6,14 @@ module.exports = ({ env }) => ({
  config: {
  provider: env('TRANSLATE_PROVIDER', 'deepl'),
  providerOptions: {},
+ translatedFieldTypes: [
+ 'string',
+ { type: 'blocks', format: 'jsonb' },
+ { type: 'text', format: 'plain' },
+ { type: 'richtext', format: 'markdown' },
+ 'component',
+ 'dynamiczone',
+ ],
  regenerateUids: true,
  },
  },

playground/src/api/blocks-article/content-types/blocks-article/schema.json

@@ -0,0 +1,62 @@
+{
+ "kind": "collectionType",
+ "collectionName": "blocks_articles",
+ "info": {
+ "singularName": "blocks-article",
+ "pluralName": "blocks-articles",
+ "displayName": "BlocksArticle",
+ "description": ""
+ },
+ "options": {
+ "draftAndPublish": true
+ },
+ "pluginOptions": {
+ "i18n": {
+ "localized": true
+ }
+ },
+ "attributes": {
+ "Title": {
+ "type": "string",
+ "pluginOptions": {
+ "i18n": {
+ "localized": true
+ },
+ "translate": {
+ "translate": "translate"
+ }
+ }
+ },
+ "Content": {
+ "type": "blocks",
+ "pluginOptions": {
+ "i18n": {
+ "localized": true
+ },
+ "translate": {
+ "translate": "translate"
+ }
+ }
+ },
+ "writer": {
+ "type": "relation",
+ "relation": "oneToOne",
+ "target": "api::writer.writer",
+ "pluginOptions": {
+ "translate": {
+ "translate": "translate"
+ }
+ }
+ },
+ "category": {
+ "type": "relation",
+ "relation": "oneToOne",
+ "target": "api::category.category",
+ "pluginOptions": {
+ "translate": {
+ "translate": "translate"
+ }
+ }
+ }
+ }
+}

playground/src/api/blocks-article/controllers/blocks-article.js

@@ -0,0 +1,9 @@
+'use strict';
+
+/**
+ * blocks-article controller
+ */
+
+const { createCoreController } = require('@strapi/strapi').factories;
+
+module.exports = createCoreController('api::blocks-article.blocks-article');

playground/src/api/blocks-article/routes/blocks-article.js

@@ -0,0 +1,9 @@
+'use strict';
+
+/**
+ * blocks-article router
+ */
+
+const { createCoreRouter } = require('@strapi/strapi').factories;
+
+module.exports = createCoreRouter('api::blocks-article.blocks-article');

playground/src/api/blocks-article/services/blocks-article.js

@@ -0,0 +1,9 @@
+'use strict';
+
+/**
+ * blocks-article service
+ */
+
+const { createCoreService } = require('@strapi/strapi').factories;
+
+module.exports = createCoreService('api::blocks-article.blocks-article');

plugin/README.md

@@ -74,9 +74,10 @@ module.exports = {
  },
  // Which field types are translated (default string, text, richtext, components and dynamiczones)
  // Either string or object with type and format
- // Possible formats: plain, markdown, html (default plain)
+ // Possible formats: plain, markdown, html, jsonb (default plain)
  translatedFieldTypes: [
  'string',
+ { type: 'blocks', format: 'jsonb' },
  { type: 'text', format: 'plain' },
  { type: 'richtext', format: 'markdown' },
  'component',

plugin/admin/src/utils/translatableFields.js

@@ -6,6 +6,7 @@ const TRANSLATABLE_FIELDS = [
  'string',
  'text',
  'relation',
+ 'blocks',
 ]
 
 export default TRANSLATABLE_FIELDS

plugin/package.json

@@ -29,7 +29,9 @@
  "dependencies": {
  "@strapi/helper-plugin": "^4.15.0",
  "axios": "^1.6.7",
+ "blocks-html-renderer": "^1.0.5",
  "bottleneck": "^2.19.5",
+ "cache-manager": "^6.1.0",
  "jsdom": "^24.0.0",
  "showdown": "^2.1.0"
  },

plugin/server/config/index.js

@@ -45,7 +45,7 @@ module.exports = {
  }
  if (
  field.format &&
- !['plain', 'markdown', 'html'].includes(field.format)
+ !['plain', 'markdown', 'html', 'jsonb'].includes(field.format)
  ) {
  throw new Error(
  `unhandled format ${field.format} for translated field ${field.type}`

plugin/server/services/__tests__/block.json

@@ -0,0 +1,233 @@
+[
+ [
+ {
+ "type": "paragraph",
+ "children": [
+ {
+ "type": "text",
+ "text": "This is a new English Text."
+ }
+ ]
+ },
+ {
+ "type": "paragraph",
+ "children": [
+ {
+ "type": "text",
+ "text": "The "
+ },
+ {
+ "type": "text",
+ "text": "highlighted and ",
+ "bold": true,
+ "italic": true
+ },
+ {
+ "text": "not highlighted regions, should be persisted. ",
+ "type": "text"
+ },
+ {
+ "type": "link",
+ "url": "https://example.com/",
+ "children": [
+ {
+ "type": "text",
+ "text": "Links "
+ }
+ ]
+ },
+ {
+ "type": "text",
+ "text": "should work as well. "
+ },
+ {
+ "text": "Inline code",
+ "type": "text",
+ "code": true
+ },
+ {
+ "text": " should probably not be translated.",
+ "type": "text"
+ }
+ ]
+ },
+ {
+ "type": "paragraph",
+ "children": [
+ {
+ "type": "text",
+ "text": "Images should be preserved correctly:"
+ }
+ ]
+ },
+ {
+ "type": "image",
+ "image": {
+ "name": "default-image",
+ "alternativeText": "default-image",
+ "url": "http://localhost:1337/uploads/default_image_42c3f849b9.png",
+ "caption": "default-image",
+ "width": 1208,
+ "height": 715,
+ "formats": {
+ "thumbnail": {
+ "name": "thumbnail_default-image",
+ "hash": "thumbnail_default_image_42c3f849b9",
+ "ext": ".png",
+ "mime": "image/png",
+ "path": null,
+ "width": 245,
+ "height": 145,
+ "size": 23.28,
+ "url": "/uploads/thumbnail_default_image_42c3f849b9.png"
+ },
+ "medium": {
+ "name": "medium_default-image",
+ "hash": "medium_default_image_42c3f849b9",
+ "ext": ".png",
+ "mime": "image/png",
+ "path": null,
+ "width": 750,
+ "height": 444,
+ "size": 187.83,
+ "url": "/uploads/medium_default_image_42c3f849b9.png"
+ },
+ "small": {
+ "name": "small_default-image",
+ "hash": "small_default_image_42c3f849b9",
+ "ext": ".png",
+ "mime": "image/png",
+ "path": null,
+ "width": 500,
+ "height": 296,
+ "size": 77.77,
+ "url": "/uploads/small_default_image_42c3f849b9.png"
+ },
+ "large": {
+ "name": "large_default-image",
+ "hash": "large_default_image_42c3f849b9",
+ "ext": ".png",
+ "mime": "image/png",
+ "path": null,
+ "width": 1000,
+ "height": 592,
+ "size": 343.7,
+ "url": "/uploads/large_default_image_42c3f849b9.png"
+ }
+ },
+ "hash": "default_image_42c3f849b9",
+ "ext": ".png",
+ "mime": "image/png",
+ "size": 81.61,
+ "previewUrl": null,
+ "provider": "local",
+ "provider_metadata": null,
+ "createdAt": "2023-03-20T13:39:39.483Z",
+ "updatedAt": "2023-03-20T13:39:39.483Z"
+ },
+ "children": [
+ {
+ "type": "text",
+ "text": ""
+ }
+ ]
+ },
+ {
+ "type": "code",
+ "children": [
+ {
+ "type": "text",
+ "text": "Code blocks should also probably not be translated\nint variable = function(example);"
+ }
+ ]
+ },
+ {
+ "type": "heading",
+ "children": [
+ {
+ "type": "text",
+ "text": "Headings should be preserved."
+ }
+ ],
+ "level": 3
+ },
+ {
+ "type": "paragraph",
+ "children": [
+ {
+ "type": "text",
+ "text": ""
+ }
+ ]
+ },
+ {
+ "type": "quote",
+ "children": [
+ {
+ "type": "text",
+ "text": "Quotes are probably fine to translate?"
+ }
+ ]
+ },
+ {
+ "type": "list",
+ "format": "ordered",
+ "children": [
+ {
+ "type": "list-item",
+ "children": [
+ {
+ "type": "text",
+ "text": "Lists should be"
+ }
+ ]
+ },
+ {
+ "type": "list-item",
+ "children": [
+ {
+ "type": "text",
+ "text": "preserved"
+ }
+ ]
+ },
+ {
+ "type": "list-item",
+ "children": [
+ {
+ "type": "text",
+ "text": "in their"
+ }
+ ]
+ },
+ {
+ "type": "list-item",
+ "children": [
+ {
+ "type": "text",
+ "text": "order"
+ }
+ ]
+ },
+ {
+ "type": "list-item",
+ "children": [
+ {
+ "type": "text",
+ "text": "but translated"
+ }
+ ]
+ },
+ {
+ "type": "list-item",
+ "children": [
+ {
+ "type": "text",
+ "text": "on their own"
+ }
+ ]
+ }
+ ]
+ }
+ ]
+]