Fix browser language detection for region specific languages (#8982)

[rmogstad]

Proposed change

Detect hyphenated languages (e.g. en-US) as we are looking through the list of browser languages, rather than as a separate step. This prevents it from picking a later language that is non-hyphenated instead of using the preferred language.

Type of change

• Dependency upgrade
• Bugfix (non-breaking change which fixes an issue)
• New feature (thank you!)
• Breaking change (fix/feature causing existing functionality to break)
• Code quality improvements to existing code or addition of tests

Example configuration

Additional information

• This PR fixes or closes issue: fixes When default language is set to a hyphenated locale (e.g. en-US), the frontend will choose the first non-hyphenated language in the translation list #8982
• This PR is related to issue or discussion:
• Link to documentation pull request:

Checklist

• The code change is tested and works locally.
• There is no commented out code in this PR.
• Tests have been added to verify that the new code works.

If user exposed functionality or configuration variables are added/changed:

• Documentation added/updated for www.home-assistant.io

[bramkragten]

I think adding it to navigator.languages makes sense, but we should not remove it here? We should instead make a helper function for:

      language = findAvailableLanguage(locale);
      if (language) {
        return language;
      }
      if (locale.includes("-")) {
        language = findAvailableLanguage(locale.split("-")[0]);
        if (language) {
          return language;
        }
      }

[rmogstad]

OK, I see. I misunderstood what navigator.language was. I will make a method and call it in both places.

[rmogstad]

I made a change that is a little different. I couldn't think of a good name for the helper function, and it seemed like something we would want to always check when searching for an available translation, so I added it to that function.

I'll understand if you prefer not to have the recursive call there and want me to break it out differently.

This is my first time doing a CR on github, first time submitting to HA (or any OS project, for that matter), and first time working with TS, so I'm not super familiar with the industry best practices, nor with the project best practices. I am more than happy to make changes to make it

I am in the discord (@Zondebok) if you want to discuss directly.

[rmogstad]

should I squash/rebase this at some point?

[bramkragten]

should I squash/rebase this at some point?

No, we squash when we merge :-)