fix(login): address review feedback on language dropdown PR

- Fix import path: use i18n barrel instead of TranslationContext directly
- Encapsulate localStorage key behind hasStoredLanguage() helper in settingsStore
- Fix pt-BR detection: only map pt-BR to br, pt-PT now returns null correctly
- Add comment linking server SUPPORTED_LANG_CODES to canonical client source
- Extract /api/config inline handler to routes/publicConfig.ts
- Add aria-haspopup, aria-expanded, role=listbox/option, aria-selected to dropdown
- Add 8 tests for detectBrowserLanguage (FE-COMP-I18N-016–023)
- Add 3 tests for setLanguageTransient (FE-STORE-SETTINGS-015–017)

client/src/i18n/TranslationContext.tsx

@@ -59,8 +59,10 @@ export function detectBrowserLanguage(): string | null {
     const exactMatch = supported.find(s => s.toLowerCase() === lang.toLowerCase())
     if (exactMatch) return exactMatch
 
-    // Portuguese variants → our code is 'br' (pt-BR)
-    if (lang.toLowerCase().startsWith('pt')) return 'br'
+    // pt-BR has no exact match (our code is 'br', not 'pt-BR'), so map it explicitly.
+    // pt-PT and bare 'pt' are NOT mapped — they fall through to null and let the
+    // server default or 'en' fallback apply instead.
+    if (lang.toLowerCase() === 'pt-br') return 'br'
 
     // Prefix match (e.g. 'de-AT' → 'de', 'zh-CN' → 'zh') — case-insensitive
     const prefix = lang.split('-')[0].toLowerCase()

client/src/pages/LoginPage.tsx

@@ -2,8 +2,9 @@ import React, { useState, useEffect, useMemo, useRef } from 'react'
 import { useNavigate, useLocation } from 'react-router-dom'
 import { useAuthStore } from '../store/authStore'
 import { useSettingsStore } from '../store/settingsStore'
-import { SUPPORTED_LANGUAGES, useTranslation, detectBrowserLanguage } from '../i18n/TranslationContext'
+import { SUPPORTED_LANGUAGES, useTranslation, detectBrowserLanguage } from '../i18n'
 import { authApi, configApi } from '../api/client'
+import { hasStoredLanguage } from '../store/settingsStore'
 import { getApiErrorMessage } from '../types'
 import { Plane, Eye, EyeOff, Mail, Lock, MapPin, Calendar, Package, User, Globe, Zap, Users, Wallet, Map, CheckSquare, BookMarked, FolderOpen, Route, Shield, KeyRound, ChevronDown } from 'lucide-react'
 
@@ -124,7 +125,7 @@ export default function LoginPage(): React.ReactElement {
   // 3. Server default (DEFAULT_LANGUAGE env var)
   // 4. 'en' → hardcoded fallback already in store
   useEffect(() => {
-    if (localStorage.getItem('app_language')) return
+    if (hasStoredLanguage()) return
 
     const detected = detectBrowserLanguage()
     if (detected) {
@@ -396,6 +397,9 @@ export default function LoginPage(): React.ReactElement {
       <div style={{ position: 'absolute', top: 16, right: 16, zIndex: 10 }}>
         <button
           onClick={(e) => { e.stopPropagation(); setLangDropdownOpen(o => !o) }}
+          aria-haspopup="listbox"
+          aria-expanded={langDropdownOpen}
+          aria-label="Change language"
           style={{
             display: 'flex', alignItems: 'center', gap: 6,
             padding: '6px 12px', borderRadius: 99,
@@ -414,6 +418,8 @@ export default function LoginPage(): React.ReactElement {
 
         {langDropdownOpen && (
           <div
+            role="listbox"
+            aria-label="Select language"
             onClick={(e) => e.stopPropagation()}
             style={{
               position: 'absolute', top: '100%', right: 0, marginTop: 4,
@@ -426,6 +432,8 @@ export default function LoginPage(): React.ReactElement {
             {SUPPORTED_LANGUAGES.map(({ value, label }) => (
               <button
                 key={value}
+                role="option"
+                aria-selected={value === language}
                 onClick={() => { setLanguageLocal(value); setLangDropdownOpen(false) }}
                 style={{
                   display: 'block', width: '100%', textAlign: 'left',

client/src/store/settingsStore.ts

@@ -15,6 +15,11 @@ interface SettingsState {
   updateSettings: (settingsObj: Partial<Settings>) => Promise<void>
 }
 
+// Returns true when the user has explicitly chosen a language (persisted in localStorage).
+// Use this instead of reading localStorage directly so the key stays encapsulated here.
+export const hasStoredLanguage = (): boolean =>
+  typeof localStorage !== 'undefined' && !!localStorage.getItem('app_language')
+
 export const useSettingsStore = create<SettingsState>((set, get) => ({
   settings: {
     map_tile_url: '',