Translations don't seem to apply to labels of link items in the sidebar

[novusnota]

Consider the following sidebar from astro.config.mjs:

sidebar: [
  {
    label: 'Book',
    translations: { 'zh-CN': '图书' },
    link: '#', attrs: { class: 'sidebar-separator' }
  },
  // other entries
]

Where sidebar-separator is defined in the custom css as:

/* Add a sidebar separator */
.sidebar-separator {
    margin-top: 1rem;
    font-weight: 600;
    pointer-events: none;
}

When I switch the language in the top bar, only the entries with external links stay the same (in their English variant) — all other i18n-capable items. Am I missing something, or that's not implemented yet / a bug?

[HiDeoo]

Thanks for the feedback 🙌

I did not manage to reproduce the issue you are facing. Considering the following Starlight internationalization configuration:

locales: {
  root: { label: "English", lang: "en" },
  "zh-cn": { label: "简体中文", lang: "zh-CN" },
},

And the following sidebar configuration (which includes the link you shared):

sidebar: [
  {
    label: "Guides",
    translations: {
      "zh-CN": "指南",
    },
    items: [
      { slug: "guides/example" },
      {
        label: "Getting Started",
        translations: {
          "zh-CN": "开始使用",
        },
        link: "https://starlight.astro.build/",
        attrs: { class: "test-sidebar" },
      },
      {
        label: "Book",
        translations: { "zh-CN": "图书" },
        link: "#",
        attrs: { class: "sidebar-separator" },
      },
    ],
  },
],

I properly get translated labels in the sidebar for the first internal link (which use the translated page title from content frontmatter), for the second external link (which uses the manually specified translations under the translations key), and same for the last one (which is the example you shared).

English	简体中文

You can also take a look at this StackBlitz example I just made to test this behavior.

[novusnota]

Curiously enough, your example works even if I try to break it apart (removing zh-cn folder, adding defaultLocale property, using yarn over npm, etc.). But mine, which also follows the configuration and even adds the defaultLocale: "root", just refuses to work. Don't know what's the source of the issue yet, but I'll try to figure it out :)

[HiDeoo]

Is your example with the issue public and available on GitHub? If yes, I can take a look, maybe a fresh pair of eyes can help.

[novusnota]

Yes, here it is. Also, thank you so much for your time and very thorough answers 🙏 ❤️

[HiDeoo]

No problem, I think the issue may be that some of your translations are using the zn-CN key instead of zh-CN one.

[novusnota]

Oh, thanks, that was the culprit. My bad — all links had that typo in them, all other translations were correct. Consistency :)

Is it possible to introduce auto-completion for some common cases? I think it would reduce those kinds of typos. Or, perhaps, validate them somehow — because as of now they aren't spotted automatically, only eyeballed