Languages: Sort the global content language selector (closes #22628)

[AndyButland]

Description

Fixes #22628 which reports that the language dropdown above the content tree lists languages in insert order, which is hard to scan when there are many.

This PR aligns its ordering with the document workspace variant selector (fixed earlier in PR #21435): default first, then mandatory, then alphabetical by name.

Testing

• Create several languages, ensuring at least one that you create after another is before it alphabetically.
• Verify that the content language selector shows the languages in the expected order.

E.g. here I have created English (default), Italian and French. Previously they would display in that order. Now they are:

If I make Italian mandatory, it is shown above French.

[claude]

Claude finished @AndyButland's task in 3m 29s —— View job

---

PR Review

Target: origin/main · Based on commit: 754f75eb · Skipped: 0 noise files out of 4 total

Adds a sortLanguages comparator utility to @umbraco-cms/backoffice/language and applies it to the umb-app-language-select dropdown, aligning its sort order (default → mandatory → alphabetical) with the document variant selector fixed in PR #21435. Includes unit tests.

• Other changes: The global content language dropdown above the content tree now displays default language first, then mandatory, then alphabetical — previously insertion-order. This is a visible UX change for users with multiple languages.

---

Suggestions

• utils.ts:10: Inner comparator helpers (compareDefault, compareMandatory, compareName) are closures defined inside sortLanguages, which means they're re-created on every comparator invocation. The sibling sortVariants in documents/documents/utils.ts uses module-level function declarations instead — consider aligning with that established pattern by hoisting the helpers to module scope. The outer a/b parameter shadowing also disappears as a bonus.

• utils.ts:7: @param {UmbLanguageDetailModel} type annotations in JSDoc are redundant in TypeScript (the signature already carries the types). The sort-order description on line 3 is the valuable documentation; the param/returns tags just restate the obvious.

---

Approved with Suggestions for improvement

Clean, well-scoped, and correctly tested. The implementation mirrors the pattern from the variant selector and includes a spread-copy before sort ([...data.items].sort(...)) to avoid mutating the source array. The test suite covers the key priority tiers and the missing-name edge case. The suggestions above are entirely optional polish.

[Copilot]

Pull request overview

Improves the usability of the global Content-tree language dropdown by sorting available languages in a consistent, scan-friendly order (matching the earlier variant-selector behavior): default language first, then mandatory languages, then alphabetical by language name.

Changes:

• Added a sortLanguages comparator utility under @umbraco-cms/backoffice/language.
• Applied the new sorting in umb-app-language-select (without changing repository/context ordering for other consumers).
• Added unit tests covering priority chain behavior and missing-name handling.

Reviewed changes

Copilot reviewed 4 out of 4 changed files in this pull request and generated 1 comment.

File	Description
src/Umbraco.Web.UI.Client/src/packages/language/utils.ts	Introduces the sortLanguages comparator (default → mandatory → name).
src/Umbraco.Web.UI.Client/src/packages/language/utils.test.ts	Adds unit tests validating the sorting rules and edge cases.
src/Umbraco.Web.UI.Client/src/packages/language/index.ts	Re-exports the new utility from the package index.
src/Umbraco.Web.UI.Client/src/packages/language/app-language-select/app-language-select.element.ts	Applies sorting at the language selector consumer by sorting fetched items.

[engijlr]

Clean fix! Tested and work as expected 👍

[madsrasmussen]

A few notes for future ideas:

As a principle, I think it is wrong to order a paginated endpoint on the consumer side. I know that the languages entity is an area where we are least likely to encounter problems because there is a limit to how many languages you can actually create. At a minimum, we need to ensure that all languages are loaded on the client by comparing the received amount with the total and continuing to request until we have them all.

I think this is a good opportunity to figure out how “advanced” ordering could be implemented in the Management API to provide more flexibility for consumers. Would it be possible to develop an API design that produces the same order we currently have on the client by combining different ordering parameters?

[umbracocommunity]

This pull request has been mentioned on Umbraco community forum. There might be relevant details there:

https://forum.umbraco.com/t/umbraco-languages-sortorder/7939/4

[AndyButland]

Thanks for the feeback @madsrasmussen. I've raised #22765 to address:

At a minimum, we need to ensure that all languages are loaded on the client by comparing the received amount with the total and continuing to request until we have them all.

With regard to the ordering, I did think about whether this should be server-side but in the end applied it client-side to align with what we were already doing for the variant selector. But I don't see any harm in pushing it up to the management API endpoint. Perhaps an ?orderBy=...&orderDirection=... parameter for language with accepted enum values of Created, Alphabetical, Importance and asc, desc respectively? Let me know what you think and we could make this available.