feat: add language detector middleware and helpers #3787
Conversation
|
if this got accepted am willing to add docs in the official website to let people know how to use it |
Codecov ReportAttention: Patch coverage is
Additional details and impacted files@@ Coverage Diff @@
## main #3787 +/- ##
==========================================
- Coverage 91.71% 91.60% -0.12%
==========================================
Files 160 162 +2
Lines 10181 10367 +186
Branches 2896 2985 +89
==========================================
+ Hits 9338 9497 +159
- Misses 842 869 +27
Partials 1 1 ☔ View full report in Codecov by Sentry. |
|
i forgot to mention the full use of the middleware options are: app.use(
'*',
languageDetector({
// Detection strategies and their order
order: ['path', 'querystring', 'cookie', 'header'],
// Supported languages and fallback
supportedLanguages: ['en', 'ar'],
fallbackLanguage: 'en',
// Query parameter settings
lookupQuerystring: 'lang', // ?lang=en
// Path settings
lookupFromPathIndex: 0, // /en/about -> takes 'en'
// Cookie settings
lookupCookie: 'user-language',
caches: false, // Set to false to disable caching
// Header settings
lookupFromHeaderKey: 'accept-language',
// Language code handling
ignoreCase: true,
convertDetectedLanguage: (lang: string) => {
// Optional: Convert language codes
// e.g., 'en-US' -> 'en'
return lang?.split('-')[0]?.toLowerCase() ?? '';
},
// Debugging
debug: process.env.NODE_ENV !== 'production',
}),
); |
|
|
||
| const DEFAULT_OPTIONS: DetectorOptions = { | ||
| order: ['querystring', 'cookie', 'header'], | ||
| lookupQuerystring: 'lang', |
There was a problem hiding this comment.
| lookupQuerystring: 'lang', | |
| lookupQueryString: 'lang', |
There was a problem hiding this comment.
I love it! This entirely solves the lang detection for me. Would also be cool to have a way to disable cookie/query detection altogether, or could this be done with
orderparam?
yep just provide the order: ['header'] and it will only detect the header
|
Thanks @lord007tn I'll review this later. Hey @sor4chi What do you think of this feature? |
There was a problem hiding this comment.
Thank you for the wonderful PR, I liked it. I have one suggestion, what do you think?
Also, I feel a bit of discomfort with the naming hono/language. Personally, I would prefer something like hono/language-detector, but I’ll leave it to @yusukebe.
| * @param header Accept-Language header string | ||
| * @returns Array of parsed languages with quality scores | ||
| */ | ||
| export function parseAcceptLanguage(header: string): Array<{ lang: string; q: number }> { |
There was a problem hiding this comment.
I feel that this function overlaps in functionality with parseAccept. As an experiment, when I tried the following:
export function parseAcceptLanguage(header: string): Array<{ lang: string; q: number }> {
return parseAccept(header)
.map(({ type, q }) => ({ lang: type, q }))
.sort((a, b) => b.q - a.q)
}I was able to pass the tests (though I may have overlooked edge cases). In this case, how about implementing a common parser in the utils and having both helper/accept and middleware/language reference it?
yusukebe
changed the title
Closes #3785
Description
Add language detector middleware to support future i18n functionality in Hono applications.
Features
c.get('language')Usage