fix: Changing language doesn't affect echarts charts by jpchev · Pull Request #31751 · apache/superset

jpchev · 2025-01-08T12:30:03Z

SUMMARY

this is to propagate the current locale up to the echarts configuration.

fixes: #30131

BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF

TESTING INSTRUCTIONS

switch the locale and verify that charts have the correct locale (for example in months name and in buttons)

korbit-ai

Review by Korbit AI

Korbit automatically attempts to detect when you fix issues in new commits.

Category	Issue	Fix Detected
	Unsafe Dynamic Module Import ▹ view	✅
	Missing Locale Fallback ▹ view	✅
	Missing locale state fallback ▹ view	✅

Need a new review? Comment /korbit-review on this PR and I'll review your latest changes.

Korbit Guide: Usage and Customization

Interacting with Korbit

You can manually ask Korbit to review your PR using the /korbit-review command in a comment at the root of your PR.

You can ask Korbit to generate a new PR description using the /korbit-generate-pr-description command in any comment on your PR.

Too many Korbit comments? I can resolve all my comment threads if you use the /korbit-resolve command in any comment on your PR.

Chat with Korbit on issues we post by tagging @korbit-ai in your reply.

Help train Korbit to improve your reviews by giving a 👍 or 👎 on the comments Korbit posts.

Customizing Korbit

Check out our docs on how you can make Korbit work best for you and your team.

Customize Korbit for your organization through the Korbit Console.

Feedback and Support

Tell us what you think of Korbit

Schedule a call with our team

Email us @ support@korbit.ai

superset-frontend/plugins/plugin-chart-echarts/src/components/Echart.tsx

  }));

+  const localeObj = useSelector((state: ExplorePageState) => state?.common?.locale);
+  const lang = require('echarts/lib/i18n/lang' + localeObj.toUpperCase()).default;


superset-frontend/plugins/plugin-chart-echarts/src/components/Echart.tsx

pomegranited

Thank you for submitting this PR @jpchev , you beat me to it :)
With just a few small changes, this is working well for me.

superset-frontend/plugins/plugin-chart-echarts/src/components/Echart.tsx

pomegranited

👍 This change is working great! Thank you @jpchev :)

I tested this by combining it with #31692 to test changing languages while viewing and editing the Pie Chart echart. I verified that this change ensures the "Inv" and "All" buttons on that echart are now translated as expected.
I read through the code

translate.echarts.mp4

rusackas · 2025-01-22T06:22:55Z

@villebro might be most qualified to look at this one, if he has time. That said, there are some failing tests that could use attention, and a more descritive PR title could help too :D

jpchev · 2025-01-22T12:40:31Z

@villebro might be most qualified to look at this one, if he has time. That said, there are some failing tests that could use attention, and a more descritive PR title could help too :D

sorry for the cryptic title, I've put the title of the issue it fixes.
Also, I see one of the checks fails because I used the 'require' import

https://github.com/apache/superset/actions/runs/12825802735/job/35764682648?pr=31751#step:4:4582

I know it's not recommended, but I don't know how to dynamically import a js file without using 'require'.
There is an async alternative, but that would make the code much less clear, in my opinion.

pomegranited · 2025-01-23T01:19:55Z

superset-frontend/plugins/plugin-chart-echarts/src/components/Echart.tsx

+  const locale = useSelector(
+    (state: ExplorePageState) => state?.common?.locale ?? 'en',
+  ).toUpperCase();
+  try {
+    const lang = require(`echarts/lib/i18n/lang${locale}`).default;
+    registerLocale(locale, lang);
+  } catch (e) {
+    console.warn(`Locale ${locale} not supported in ECharts`);
+  }
+


@jpchev I think we need to use dynamic imports instead, but they're tricky to use in React. I tried a few ways and wasn't able to get it to render properly, so am asking the bot:

@dosu how do we refactor this to ensure we await the import and registerLocale calls before calling init below?

Reply is here: #30131 (comment)

But it doesn't work :(

Yes, I tried something similar, without success. That's why I went for require.

@jpchev I found the culprit! handleSizeChange wasn't running because of race conditions on render.

See jpchev#2

jpchev · 2025-01-24T12:50:08Z

@pomegranited I fixed almost all the checks, there is this one left which I don't how to treat https://github.com/apache/superset/actions/runs/12949242972/job/36119814005?pr=31751

do you have an idea? It seems there are errors also on files not impacted by changes in this PR,
for instance

@superset-ui/plugin-chart-echarts: ../../scripts/tsc.sh: line 25: exit: ../../src/components/Icons/Icon.tsx(23,29): error TS2307: Cannot find module 'src/assets/images/icons/transparent.svg' or its corresponding type declarations.

superset-frontend/plugins/plugin-chart-echarts/src/components/Echart.tsx

superset-frontend/plugins/plugin-chart-echarts/package.json

pomegranited · 2025-01-29T12:27:02Z

superset-frontend/package-lock.json

Could you revert these changes? I don't think they're needed.

jpchev · 2025-01-29T13:32:17Z

@pomegranited I've pushed again my code from scratch, in order to resolve the conflict on superset-frontend/package-lock.json I think it needs again to be approved

jpchev · 2025-03-10T18:10:24Z

@jpchev looks like pre-commits are failing, but I think we fixed this in master already. Can you rebase against master?

@sadpandajoe thank you, I've rebased and now all checks pass.
Can somebody please review and merge this PR? @michael-s-molina @kgabryje @justinpark

jpchev · 2025-03-18T10:22:52Z

@villebro do you know if there is anything I'm missing on this PR to have it reviewed?

jpchev · 2025-03-18T14:40:05Z

@geido can you please have a look at this PR?

villebro

LGTM except for the dev dependency being in regular dependencies

villebro · 2025-03-19T00:00:30Z

superset-frontend/plugins/plugin-chart-echarts/package.json

    "lodash": "^4.17.21",
-    "dayjs": "^1.11.13"
+    "dayjs": "^1.11.13",
+    "@types/react-redux": "^7.1.10"


I think this should be in devDependencies

villebro

LGTM!

villebro · 2025-03-19T16:49:02Z

@jpchev my apologies, for some reason it appears to require having the type package under regular dependencies 🤔 My apologies (not sure why this is, I need to investigate this in more detail..) Anyway, please revert that change and I'll merge when CI is green again.

jpchev · 2025-03-19T17:33:45Z

@villebro ok, thank you, I reverted the change in order to have the type under dependencies.
The CI is green

Co-authored-by: Giampaolo Capelli <giampaolo.capelli@docaposte.fr> (cherry picked from commit 78efb62)

pull-request-size bot added the size/S label Jan 8, 2025

github-actions bot added the plugins label Jan 8, 2025

dosubot bot added the viz:charts:echarts Related to Echarts label Jan 8, 2025

jpchev mentioned this pull request Jan 8, 2025

Changing languages doesn't affect echarts charts. #30131

Closed

3 tasks

korbit-ai bot reviewed Jan 8, 2025

View reviewed changes

jpchev changed the title ~~fixes for https://github.com/apache/superset/issues/30131~~ fix(issue): 30131 Jan 8, 2025

sadpandajoe requested review from michael-s-molina and villebro January 8, 2025 18:32

justinpark reviewed Jan 8, 2025

View reviewed changes

superset-frontend/plugins/plugin-chart-echarts/src/components/Echart.tsx Outdated Show resolved Hide resolved

rusackas mentioned this pull request Jan 9, 2025

build(eslint): disabling wildcard imports with eslint #31761

Merged

9 tasks

pomegranited reviewed Jan 16, 2025

View reviewed changes

pomegranited approved these changes Jan 17, 2025

View reviewed changes

pomegranited mentioned this pull request Jan 21, 2025

Superset i18n: Fix language settings in echarts openedx/openedx-aspects#300

Closed

1 task

jpchev changed the title ~~fix(issue): 30131~~ fix(Changing languages doesn't affect echarts charts): 30131 Jan 22, 2025

jpchev changed the title ~~fix(Changing languages doesn't affect echarts charts): 30131~~ fix(Changing languages doesn't affect echarts charts): issue 30131 Jan 22, 2025

pomegranited reviewed Jan 23, 2025

View reviewed changes

pull-request-size bot added size/M and removed size/S labels Jan 24, 2025

github-actions bot added the dependencies:npm label Jan 24, 2025

pomegranited reviewed Jan 29, 2025

View reviewed changes

jpchev force-pushed the fix/issue_30131 branch from bba5d7a to 0c8010c Compare January 29, 2025 14:03

jpchev closed this Jan 29, 2025

jpchev force-pushed the fix/issue_30131 branch from e19e66c to e4bdb28 Compare January 29, 2025 14:21

pull-request-size bot added size/XS and removed size/M labels Jan 29, 2025

jpchev reopened this Jan 29, 2025

jpchev added 6 commits March 10, 2025 18:50

Update package.json

0a31c94

modified linter to let devDependencies contain types

48d007f

Update .eslintrc.js

8712142

Update .eslintrc.js

c95cd33

Update .eslintrc.js

2f96ce0

Update package.json

417274a

jpchev force-pushed the fix/issue_30131 branch from 7c7eca4 to 417274a Compare March 10, 2025 17:52

jpchev changed the title ~~fix: Changing languages doesn't affect echarts charts~~ fix: Changing language doesn't affect echarts charts Mar 11, 2025

villebro reviewed Mar 19, 2025

View reviewed changes

Update package.json

00493dc

villebro approved these changes Mar 19, 2025

View reviewed changes

Update package.json

3f34a41

villebro merged commit 78efb62 into apache:master Mar 19, 2025
47 checks passed

michael-s-molina added the v5.0 Label added by the release manager to track PRs to be included in the 5.0 branch label Mar 20, 2025

michael-s-molina pushed a commit that referenced this pull request Mar 20, 2025

fix: Changing language doesn't affect echarts charts (#31751)

4a7014b

Co-authored-by: Giampaolo Capelli <giampaolo.capelli@docaposte.fr> (cherry picked from commit 78efb62)

jpchev deleted the fix/issue_30131 branch March 25, 2025 09:13

justinpark mentioned this pull request Apr 16, 2025

fix(echart): Thrown errors shown after resized #33143

Merged

9 tasks

sadpandajoe removed the testenv-up label Jun 25, 2025

mistercrunch added 🍒 5.0.0 Cherry-picked to 5.0.0 🏷️ bot A label used by `supersetbot` to keep track of which PR where auto-tagged with release labels labels Jul 29, 2025

justinpark mentioned this pull request Aug 1, 2025

fix(echart): initial chart animation #34516

Merged

9 tasks

silveira-js mentioned this pull request Jan 7, 2026

Add MapLibre support to charts PortalTelemedicina/superset#4

Merged

9 tasks

This was referenced Jan 15, 2026

Point explicit service account to client PortalTelemedicina/superset#9

Merged

Fix margin parameters PortalTelemedicina/superset#10

Merged

silveira-js mentioned this pull request Jan 26, 2026

Adjust Styling Options PortalTelemedicina/superset#11

Closed

Conversation

jpchev commented Jan 8, 2025 • edited by sadpandajoe Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

SUMMARY

BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF

TESTING INSTRUCTIONS

Uh oh!

korbit-ai bot left a comment • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Review by Korbit AI

Korbit automatically attempts to detect when you fix issues in new commits.

Interacting with Korbit

Customizing Korbit

Feedback and Support

Uh oh!

This comment was marked as resolved.

Uh oh!

Uh oh!

Uh oh!

Uh oh!

pomegranited left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

pomegranited left a comment • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

rusackas commented Jan 22, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

jpchev commented Jan 22, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

pomegranited Jan 23, 2025

Choose a reason for hiding this comment

Uh oh!

pomegranited Jan 23, 2025

Choose a reason for hiding this comment

Uh oh!

jpchev Jan 23, 2025

Choose a reason for hiding this comment

Uh oh!

pomegranited Jan 24, 2025

Choose a reason for hiding this comment

Uh oh!

jpchev commented Jan 24, 2025

Uh oh!

Uh oh!

Uh oh!

pomegranited Jan 29, 2025

Choose a reason for hiding this comment

Uh oh!

jpchev commented Jan 29, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

jpchev commented Mar 10, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

jpchev commented Mar 18, 2025

Uh oh!

jpchev commented Mar 18, 2025

Uh oh!

villebro left a comment

Choose a reason for hiding this comment

Uh oh!

villebro Mar 19, 2025

Choose a reason for hiding this comment

Uh oh!

villebro left a comment

Choose a reason for hiding this comment

Uh oh!

villebro commented Mar 19, 2025

Uh oh!

jpchev commented Mar 19, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

jpchev commented Jan 8, 2025 •

edited by sadpandajoe

Loading

korbit-ai bot left a comment •

edited

Loading

pomegranited left a comment •

edited

Loading

rusackas commented Jan 22, 2025 •

edited

Loading

jpchev commented Jan 22, 2025 •

edited

Loading

jpchev commented Jan 29, 2025 •

edited

Loading

jpchev commented Mar 10, 2025 •

edited

Loading

jpchev commented Mar 19, 2025 •

edited

Loading