Overview

Follow-up to #3582478: Symmetrically translatable config-defined component trees, STEP 2: change config schema type for `inputs` to allow translating via core's Config Translation UI.

\Drupal\canvas\Plugin\Canvas\ComponentSource\GeneratedFieldExplicitInputUxComponentSourceBase::getExplicitInputDefinitionsAsConfigSchemaMapping() supports the following prop shapes:

      // Plain strings, HTML strings and URLs are considered translatable. So:
      // - type: string
      // - type: string: format: iri
      // - type: string: format: iri-reference
      // - type: string: format: uri
      // - type: string: format: uri-reference
      // - type: string, contentMediaType: text/html
      // - type: string, contentMediaType: text/html, x-formatting-context: inline
      // - type: string, contentMediaType: text/html, x-formatting-context: block
      // @todo: arrays of either of those.

Canvas will make every SDC prop (or code component prop) translatable that is of one of those particular shapes.

But what if for some SDC (or even some site using an SDC), some type: string, format prop should be translatable? This is impossible to know without core's SDC subsystem's JSON Schema describing translatability of props. → Needs upstream feature

Proposed resolution

  1. Introduce an alter hook that allows sites/modules modifying \Drupal\canvas\Plugin\Canvas\ComponentSource\GeneratedFieldExplicitInputUxComponentSourceBase::getExplicitInputDefinitionsAsConfigSchemaMapping()'s behavior.
  2. However, this must be @internal until both GeneratedFieldExplicitInputUxComponentSourceBase and ComponentSourceInterface are public APIs.
  3. Test-only module that verifies it works end-to-end, for both content-defined component trees and config-defined component trees
  4. Config translation-specific concern The implementer of the hook must specify the appropriate form_element_class to use for the field type associated with that prop shape.
    ⚠️ Note that Drupal core's config_translation module has limited support for field types! It in fact only supports plain strings (TextField) and HTML strings (\Drupal\config_translation\FormElement\TextFormat — see type: text_format).
    For example, opting in a type: string, format: uri prop would require a new config translation form element class, because it uses the link field type, which causes it to receive a value like this:

    All solved now; existing field widgets are used automatically — see #6. Support for URLs was added with zero changes to form_element_class stuff. 🥳

User interface changes

None.

Comments

wim leers created an issue. See original summary.

wim leers’s picture

Issue summary: View changes
StatusFileSize
new128.64 KB

Thanks @tedbow for your research into this!

wim leers’s picture

Status: Active » Postponed
wim leers’s picture

Issue summary: View changes
wim leers’s picture

Assigned: Unassigned » tedbow
Issue summary: View changes
Issue tags: +Needs issue summary update

Ted, can you also update the IS to include your TMGMT-specific findings?

wim leers’s picture

Issue summary: View changes

Update to account for the significant changes in the past ~2 days to https://git.drupalcode.org/project/canvas/-/merge_requests/898.

Basically, that MR was rearchitected to not use Config Translation's Text(Field|Area), but a new custom class CanvasStaticPropSourceFieldWidget extends FormElementBase that automatically reuses the field widget in use on the static prop source that is being translated. Which means that many of the challenges outlined here … disappear!

wim leers’s picture

Title: [later phase] Add alter hook for marking additional SDC/code component prop shapes as translatable » [later phase] Add alter hook for marking additional SDC/code component prop shapes AND/OR specific props as translatable
Related issues: +#3586342: Symmetrically translatable component trees, STEP 1: introduce `ComponentInstanceInputsConfigSchemaGeneratorInterface`

#3586342: Symmetrically translatable component trees, STEP 1: introduce `ComponentInstanceInputsConfigSchemaGeneratorInterface` has clarified where what is needed.

We may need two alter hooks, or alternatively: one that supports either marking specific component props as translatable, or all props that have a specific shape (e.g. all type: string, enum: [foo, bar]).