Changing schema properties in config.js

I'm using the volto-hero-block from eeacms and I need the fields in the edit mode, etc. in German, but the names of the properties are set in the schema.js file and not defined as a message. Now I wondered if it is possible to change the title of a property in my config.js file and, if yes, how this would work.

Bad EEA developers, they don't implement i18n.

The most straight-forward way would be to shadow the schema.js file. Here's an example file that shadows a component from a eeamcs addon. You only need to notice the path of the file (src/customizations..) https://github.com/eea/volto-cca-policy/blob/master/src/customizations/%40eeacms/volto-eea-design-system/ui/Footer/Contact.jsx

The complicated way would be to write a schemaEnhancer that takes your declared internationalised labels and sets them in the schema. This you can do in the config.js

1 Like

Yes unfortunately :smiling_face_with_tear:

Well, I wanted to avoid shadowing the schema file, but this seems to be the simplest solution.
Thank you!

@tiberiuichim So I got the same problem again, but with the volto-editablefooter. I need to shadow the FooterColumns.jsx file because they don't check if one of the fields has content, and thus it will throw an error if the field is empty. My problem is that the volto-editablefooter isn't part of the omelette/src/ it's just in the node_modules folder, but if I try to shadow this file with volto/volto-editablefooter/src/components/FooterColumns.jsx nothing will happen. What am I doing wrong?

you should have the file src/customizations/volto-editablefooter/components/FooterColumns.jsx

The customization (shadowing) works by "aliasing". When the JS bundles are compiled, the webpack bundler is instructed with a special "resolve aliases". "resolve" as in, "when I import a module by name, what file do I get?". And so, by registering an alias for an "import path", we override the "old" original file. As you can imagine, this is highly dependent on the order of execution. See https://github.com/plone/volto/blob/985e419396b4d00567d12e7e309ea420012e9cc7/razzle.config.js#L227-L230

With this in mind, you'll see that your path is wrong. The first "volto" bit of the path is reserved as a customization folder for volto itself, then you don't need the src bit in the path, as that's not part of the import naming.

That worked. Thank you for the explanation!