volto icon indicating copy to clipboard operation
volto copied to clipboard

Fix Toolbar Types crash when language code is missing in langmap (#7637)

Open pratyush07-hub opened this issue 3 weeks ago • 6 comments

This fixes a bug where the Toolbar Types component crashes if a language in Plone is not in Volto’s langmap.

This PR fixes the issue by :

  • The crash happened because the code assumed langmap[lang] always exists.
  • Now, if a language is not in langmap, it will fall back to displaying the language code itself, preventing the toolbar from crashing.

Files changed:

  • packages/volto/src/components/manage/Toolbar/Types.jsx
  • packages/volto/news/7637.bugfix

Changelog:

  • Added a news file documenting this bug fix.


Closes #7637


pratyush07-hub avatar Dec 04 '25 21:12 pratyush07-hub

@pratyush07-hub If I add fr-ht to the available languages ​​and then install plone.app.multilingual, I get the error:

Cannot read properties of undefined (reading 'nativeName')

I can't even add content afterwards. Perhaps issue #7637 is incomplete?

wesleybl avatar Dec 05 '25 02:12 wesleybl

@pratyush07-hub If I add fr-ht to the available languages ​​and then install plone.app.multilingual, I get the error:

Cannot read properties of undefined (reading 'nativeName')

I can't even add content afterwards. Perhaps issue #7637 is incomplete?

I have checked it, and this is an additional issue that is not covered by my PR. fr-ht doesn’t exist in the language map, so that’s why the error appears. I’m trying to fix this issue now.

pratyush07-hub avatar Dec 05 '25 07:12 pratyush07-hub

@pratyush07-hub If I add fr-ht to the available languages ​​and then install plone.app.multilingual, I get the error:

Cannot read properties of undefined (reading 'nativeName')

I can't even add content afterwards. Perhaps issue #7637 is incomplete?

Hi @wesleybl , I recorded a screen demo to show that my original fix works correctly. The new issue happens only after a reload, and that's when the missing language in langmap causes the nativeName error you mentioned. I didn’t notice this earlier, but now I understand the cause and I’m currently working on fixing this as well.

Screencast from 2025-12-05 14-09-58.webm

pratyush07-hub avatar Dec 05 '25 08:12 pratyush07-hub

Hi @wesleybl @stevepiercy ,

I’ve been looking into the crash that happens when Plone has a language that Volto doesn’t recognize in its LanguageMap.

What’s going wrong: Plone can include languages like "fr-ht", but Volto doesn’t have an entry for them in LanguageMap. When the UI tries to read langmap[lang].nativeName, it ends up being undefined, which causes Volto to crash.

What I am trying to do:

  • In LanguageSelector.tsx, I added a safe fallback so the UI won’t crash. If a language isn’t in the map, it just displays the language code.
  • In MultilingualRedirector.jsx, I added checks so unsupported languages in cookies fall back to the default language, and missing locale files don’t cause errors.

However, these fixes alone are not enough.

I need your guidance here:

  1. should we show unsupported languages using their code (e.g., “fr-ht”), or
  2. should we block them in the selector and prevent users from choosing them.
  3. Also, should we consider adding these missing languages to LanguageMap.js?

I am thinking that option 2 might be the better choice, but I’d like your guidance.

pratyush07-hub avatar Dec 08 '25 17:12 pratyush07-hub

should we show unsupported languages using their code (e.g., “fr-ht”)

If the backend supports a specific language and the user has selected that language, I think it's best not to have limitations and only display the language code.

I don't think we need to update LanguageMap.js if Volto doesn't support that language.

wesleybl avatar Dec 09 '25 12:12 wesleybl

hey @wesleybl,

I've updated LanguageSelector so it falls back to showing the language code if nativeName is missing, which fixes the crash. MultilingualRedirector now reads the language directly from the URL, so languages supported by the backend (like fr-ht) work even if they aren’t in the frontend map.

I also removed the strict LanguageMap filter in Types.jsx, so all backend languages now appear in the translation menu.

Overall, these changes remove unnecessary limits. Users can open any supported language URL without redirects, and if a locale is missing, the UI shows English labels while keeping the correct content language and URL.

pratyush07-hub avatar Dec 10 '25 21:12 pratyush07-hub

Hey @wesleybl, I’ve attached a screen recording to show what is currently happening, especially after configuring things as you suggested.

When I select Brazilian Portuguese as the default language and also as an available language, and then create a page inside the pt-br folder with a link pointing to http://localhost:3000, clicking that link redirects to:

http://localhost:3000/pt_BR

instead of:

http://localhost:3000/pt-br

After my recent changes, it now redirects to /en (as per the previous update), but as you mentioned earlier, on the main branch it was redirecting to pt_BR and not pt-br.

I’ve recorded the screen after applying my code changes so you can see the exact behavior and all the related changes. Please review it and let me know how we can resolve this or if there’s a better approach to handle the locale mapping consistently.

Screencast from 2025-12-14 14-34-23.webm

pratyush07-hub avatar Dec 14 '25 09:12 pratyush07-hub