rusackas opened a new pull request, #41183:
URL: https://github.com/apache/superset/pull/41183
### SUMMARY
The top navigation bar highlights the active tab by matching the current
route against the menu item keys. Those keys were the menu items' **displayed
labels**, while the active-tab matcher compared against **hardcoded English
strings** (`"Dashboards"`, `"Charts"`, `"SQL"`, …). In any non-English locale
the displayed label is translated, so it never matched the English comparison
string and **no tab was highlighted**.
This is a systemic i18n bug — it affects every language whose menu
translations differ from English, not just Russian (reported in #36403).
**Fix:** key each menu item by its stable Flask-AppBuilder `name` (the
internal view/category identifier, which is locale-independent) instead of its
localized label, and match the active tab against those same names. `name`
falls back to `label` when absent, so operator-defined custom menu entries keep
working.
The change is in `superset-frontend/src/features/home/Menu.tsx`:
- `buildMenuItem` now uses `key: name ?? label` for top-level entries.
- The route → active-tab effect sets the stable names (`Dashboards`,
`Charts`, `Datasets`, `SQL Lab`) instead of English labels. As a bonus this
decouples the Datasets tab from the semantic-layer label override.
### BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF
Before — Russian locale, on the Dashboards page, the **Dashboards** tab is
not highlighted.
After — the active tab is highlighted in every language.
(See the screenshots in #36403 for the broken-vs-working comparison.)
### TESTING INSTRUCTIONS
1. Set two languages in `superset_config.py`:
```py
LANGUAGES = {
"en": {"flag": "us", "name": "English"},
"ru": {"flag": "ru", "name": "Russian"},
}
```
2. Switch the UI language to Russian.
3. Open the Dashboards (or Charts / Datasets / SQL Lab) page.
4. Confirm the corresponding top-nav tab is highlighted as active.
Automated coverage added in `Menu.test.tsx`:
- Highlights the active top-level tab on a matching route (English) —
regression guard.
- Highlights the active top-level tab when the label is **localized**.
- Highlights the active SQL submenu tab when the label is localized.
```
npx jest src/features/home/Menu.test.tsx
```
### ADDITIONAL INFORMATION
- [x] Has associated issue: Fixes #36403
- [ ] Required feature flags:
- [x] Changes UI
- [ ] Includes DB Migration (follow approval process in
[SIP-59](https://github.com/apache/superset/issues/13351))
- [ ] Migration is atomic, supports rollback & is backwards-compatible
- [ ] Confirm DB migration upgrade and downgrade tested
- [ ] Runtime estimates and downtime expectations provided
- [ ] Introduces new feature or API
- [ ] Removes existing feature or API
🤖 Generated with [Claude Code](https://claude.com/claude-code)
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
