From eed746ead87c18a743f63233d54258f2cafad478 Mon Sep 17 00:00:00 2001 From: Miu Razvan Date: Thu, 30 Jan 2025 17:25:06 +0200 Subject: [PATCH] make schema work with intl --- src/editor/index.js | 8 +- src/editor/schema.js | 215 +++++++++++++++++++++++-------------------- 2 files changed, 120 insertions(+), 103 deletions(-) diff --git a/src/editor/index.js b/src/editor/index.js index 79bb4af..2d88ad5 100644 --- a/src/editor/index.js +++ b/src/editor/index.js @@ -1,5 +1,5 @@ import commentSVG from '@plone/volto/icons/comment.svg'; -import { defineMessages } from 'react-intl'; // , defineMessages +import { defineMessages, useIntl } from 'react-intl'; // , defineMessages import { makeInlineElementPlugin } from '@plone/volto-slate/elementEditor'; @@ -21,6 +21,11 @@ const messages = defineMessages({ }, }); +const SchemaProvider = ({ editSchema, children }) => { + const intl = useIntl(); + return children(editSchema({ intl })); +}; + export default function install(config) { const opts = { title: 'Label', @@ -28,6 +33,7 @@ export default function install(config) { elementType: LABEL, element: LabelElement, isInlineElement: true, + schemaProvider: SchemaProvider, editSchema: LabelEditorSchema, extensions: [withLabel, withBeforeInsertFragment], hasValue: (formData) => !!formData, diff --git a/src/editor/schema.js b/src/editor/schema.js index 471adae..fb2d10f 100644 --- a/src/editor/schema.js +++ b/src/editor/schema.js @@ -1,104 +1,115 @@ -export const LabelEditorSchema = { - title: 'Add label', - fieldsets: [ - { - id: 'default', - title: 'Default', - fields: ['label_type', 'label_pointing'], - }, - { - id: 'tooltip', - title: 'Tooltip', - fields: [ - 'tooltip_content', - 'tooltip_pointing', - 'tooltip_type', - 'tooltip_size', - 'always_show', - 'show_on_hover', - ], - }, - ], - properties: { - label_type: { - title: 'Type of label', - type: 'string', - factory: 'Choice', - choices: [ - ['simple', 'Simple'], - ['medium', 'Medium importance'], - ['high', 'High importance'], - ['highlight', 'Highlight'], - ], - default: 'simple', - description: 'Choose a type or leave the default value (Simple).', - required: true, - noValueOption: false, - }, - label_pointing: { - title: 'Label pointing', - type: 'string', - factory: 'Choice', - choices: [ - ['pointing', 'Up'], - ['right pointing', 'Right'], - ['left pointing', 'Left'], - ['pointing below', 'Down'], - ], - description: - 'Choose an orientation or leave the default value (No value).', - }, - tooltip_content: { - title: 'Tooltip content', - widget: 'slate', - description: 'Enter the text you want to display in the tooltip.', - }, - tooltip_pointing: { - title: 'Tooltip position', - type: 'string', - factory: 'Choice', - choices: [ - ['top center', 'top center'], - ['top left', 'top left'], - ['top right', 'top right'], - ['bottom center', 'bottom center'], - ['bottom left', 'bottom left'], - ['bottom right', 'bottom right'], - ['right center', 'right center'], - ['left center', 'left center'], - ], - }, - tooltip_type: { - title: 'Tooltip type', - type: 'string', - factory: 'Choice', - choices: [ - ['medium', 'Medium importance'], - ['high', 'High importance'], - ['highlight', 'Highlight'], - ], - default: '', - }, - tooltip_size: { - title: 'Tooltip size', - type: 'string', - factory: 'Choice', - choices: [ - ['wide', 'Wide'], - ['extra', 'Extra wide'], - ], - default: '', - }, - always_show: { - title: 'Always show tooltip', - description: 'Always show the content label tooltip.', - type: 'boolean', - }, - show_on_hover: { - title: 'Show tooltip on hover', - description: 'Show the content label tooltip on hover.', - type: 'boolean', - }, +import { defineMessages } from 'react-intl'; + +const messages = defineMessages({ + LabelType: { + id: 'LabelType', + defaultMessage: 'Type of label', }, - required: [], +}); + +export const LabelEditorSchema = ({ intl }) => { + return { + title: 'Add label', + fieldsets: [ + { + id: 'default', + title: 'Default', + fields: ['label_type', 'label_pointing'], + }, + { + id: 'tooltip', + title: 'Tooltip', + fields: [ + 'tooltip_content', + 'tooltip_pointing', + 'tooltip_type', + 'tooltip_size', + 'always_show', + 'show_on_hover', + ], + }, + ], + properties: { + label_type: { + title: intl.formatMessage(messages.LabelType), + type: 'string', + factory: 'Choice', + choices: [ + ['simple', 'Simple'], + ['medium', 'Medium importance'], + ['high', 'High importance'], + ['highlight', 'Highlight'], + ], + default: 'simple', + description: 'Choose a type or leave the default value (Simple).', + required: true, + noValueOption: false, + }, + label_pointing: { + title: 'Label pointing', + type: 'string', + factory: 'Choice', + choices: [ + ['pointing', 'Up'], + ['right pointing', 'Right'], + ['left pointing', 'Left'], + ['pointing below', 'Down'], + ], + description: + 'Choose an orientation or leave the default value (No value).', + }, + tooltip_content: { + title: 'Tooltip content', + widget: 'slate', + description: 'Enter the text you want to display in the tooltip.', + }, + tooltip_pointing: { + title: 'Tooltip position', + type: 'string', + factory: 'Choice', + choices: [ + ['top center', 'top center'], + ['top left', 'top left'], + ['top right', 'top right'], + ['bottom center', 'bottom center'], + ['bottom left', 'bottom left'], + ['bottom right', 'bottom right'], + ['right center', 'right center'], + ['left center', 'left center'], + ], + }, + tooltip_type: { + title: 'Tooltip type', + type: 'string', + factory: 'Choice', + choices: [ + ['medium', 'Medium importance'], + ['high', 'High importance'], + ['highlight', 'Highlight'], + ], + default: '', + }, + tooltip_size: { + title: 'Tooltip size', + type: 'string', + factory: 'Choice', + choices: [ + ['wide', 'Wide'], + ['extra', 'Extra wide'], + ], + default: '', + }, + always_show: { + title: 'Always show tooltip', + description: 'Always show the content label tooltip.', + type: 'boolean', + }, + show_on_hover: { + title: 'Show tooltip on hover', + description: 'Show the content label tooltip on hover.', + type: 'boolean', + }, + }, + required: [], + }; };