Bluesky app fork with some witchin' additions 💫

Dynamically load `date-fns` locale data (#9535)

authored by samuel.fm and committed by

GitHub 41b37423 512ce3d5

+315 -214
+7 -93
src/components/hooks/dates.ts
··· 7 * {@link https://github.com/date-fns/date-fns/blob/main/docs/i18n.md} 8 */ 9 10 - import React from 'react' 11 - import {formatDistance, type Locale} from 'date-fns' 12 - import { 13 - ca, 14 - cy, 15 - da, 16 - de, 17 - el, 18 - enGB, 19 - eo, 20 - es, 21 - eu, 22 - fi, 23 - fr, 24 - fy, 25 - gd, 26 - gl, 27 - hi, 28 - hu, 29 - id, 30 - it, 31 - ja, 32 - km, 33 - ko, 34 - nl, 35 - pl, 36 - pt, 37 - ptBR, 38 - ro, 39 - ru, 40 - sv, 41 - th, 42 - tr, 43 - uk, 44 - vi, 45 - zhCN, 46 - zhHK, 47 - zhTW, 48 - } from 'date-fns/locale' 49 50 - import {type AppLanguage} from '#/locale/languages' 51 - import {useLanguagePrefs} from '#/state/preferences' 52 - 53 - /** 54 - * {@link AppLanguage} 55 - */ 56 - const locales: Record<AppLanguage, Locale | undefined> = { 57 - en: undefined, 58 - an: undefined, 59 - ast: undefined, 60 - ca, 61 - cy, 62 - da, 63 - de, 64 - el, 65 - ['en-GB']: enGB, 66 - eo, 67 - es, 68 - eu, 69 - fi, 70 - fr, 71 - fy, 72 - ga: undefined, 73 - gd, 74 - gl, 75 - hi, 76 - hu, 77 - ia: undefined, 78 - id, 79 - it, 80 - ja, 81 - km, 82 - ko, 83 - ne: undefined, 84 - nl, 85 - pl, 86 - ['pt-PT']: pt, 87 - ['pt-BR']: ptBR, 88 - ro, 89 - ru, 90 - sv, 91 - th, 92 - tr, 93 - uk, 94 - vi, 95 - ['zh-Hans-CN']: zhCN, 96 - ['zh-Hant-HK']: zhHK, 97 - ['zh-Hant-TW']: zhTW, 98 - } 99 100 /** 101 * Returns a localized `formatDistance` function. 102 * {@link formatDistance} 103 */ 104 export function useFormatDistance() { 105 - const {appLanguage} = useLanguagePrefs() 106 - return React.useCallback<typeof formatDistance>( 107 (date, baseDate, options) => { 108 - const locale = locales[appLanguage as AppLanguage] 109 - return formatDistance(date, baseDate, {...options, locale: locale}) 110 }, 111 - [appLanguage], 112 ) 113 }
··· 7 * {@link https://github.com/date-fns/date-fns/blob/main/docs/i18n.md} 8 */ 9 10 + import {useCallback} from 'react' 11 + import {formatDistance} from 'date-fns' 12 13 + import {useDateLocale} from '#/locale/i18nProvider' 14 15 /** 16 * Returns a localized `formatDistance` function. 17 * {@link formatDistance} 18 */ 19 export function useFormatDistance() { 20 + const locale = useDateLocale() 21 + return useCallback<typeof formatDistance>( 22 (date, baseDate, options) => { 23 + return formatDistance(date, baseDate, {...options, locale}) 24 }, 25 + [locale], 26 ) 27 }
+124 -80
src/locale/i18n.ts
··· 8 import '@formatjs/intl-numberformat/locale-data/en' 9 import '@formatjs/intl-displaynames/locale-data/en' 10 11 - import {useEffect} from 'react' 12 import {i18n} from '@lingui/core' 13 14 import {sanitizeAppLanguageSetting} from '#/locale/helpers' 15 import {AppLanguage} from '#/locale/languages' ··· 63 switch (locale) { 64 case AppLanguage.an: { 65 i18n.loadAndActivate({locale, messages: messagesAn}) 66 - await Promise.all([ 67 import('@formatjs/intl-pluralrules/locale-data/an'), 68 import('@formatjs/intl-numberformat/locale-data/es'), 69 import('@formatjs/intl-displaynames/locale-data/es'), 70 ]) 71 - break 72 } 73 case AppLanguage.ast: { 74 i18n.loadAndActivate({locale, messages: messagesAst}) 75 - await Promise.all([ 76 import('@formatjs/intl-pluralrules/locale-data/ast'), 77 import('@formatjs/intl-numberformat/locale-data/ast'), 78 import('@formatjs/intl-displaynames/locale-data/ast'), 79 ]) 80 - break 81 } 82 case AppLanguage.ca: { 83 i18n.loadAndActivate({locale, messages: messagesCa}) 84 - await Promise.all([ 85 import('@formatjs/intl-pluralrules/locale-data/ca'), 86 import('@formatjs/intl-numberformat/locale-data/ca'), 87 import('@formatjs/intl-displaynames/locale-data/ca'), 88 ]) 89 - break 90 } 91 case AppLanguage.cy: { 92 i18n.loadAndActivate({locale, messages: messagesCy}) 93 - await Promise.all([ 94 import('@formatjs/intl-pluralrules/locale-data/cy'), 95 import('@formatjs/intl-numberformat/locale-data/cy'), 96 import('@formatjs/intl-displaynames/locale-data/cy'), 97 ]) 98 - break 99 } 100 case AppLanguage.da: { 101 i18n.loadAndActivate({locale, messages: messagesDa}) 102 - await Promise.all([ 103 import('@formatjs/intl-pluralrules/locale-data/da'), 104 import('@formatjs/intl-numberformat/locale-data/da'), 105 import('@formatjs/intl-displaynames/locale-data/da'), 106 ]) 107 - break 108 } 109 case AppLanguage.de: { 110 i18n.loadAndActivate({locale, messages: messagesDe}) 111 - await Promise.all([ 112 import('@formatjs/intl-pluralrules/locale-data/de'), 113 import('@formatjs/intl-numberformat/locale-data/de'), 114 import('@formatjs/intl-displaynames/locale-data/de'), 115 ]) 116 - break 117 } 118 case AppLanguage.el: { 119 i18n.loadAndActivate({locale, messages: messagesEl}) 120 - await Promise.all([ 121 import('@formatjs/intl-pluralrules/locale-data/el'), 122 import('@formatjs/intl-numberformat/locale-data/el'), 123 import('@formatjs/intl-displaynames/locale-data/el'), 124 ]) 125 - break 126 } 127 case AppLanguage.en_GB: { 128 i18n.loadAndActivate({locale, messages: messagesEn_GB}) 129 - await Promise.all([ 130 import('@formatjs/intl-pluralrules/locale-data/en'), 131 import('@formatjs/intl-numberformat/locale-data/en-GB'), 132 import('@formatjs/intl-displaynames/locale-data/en-GB'), 133 ]) 134 - break 135 } 136 case AppLanguage.eo: { 137 i18n.loadAndActivate({locale, messages: messagesEo}) 138 - await Promise.all([ 139 import('@formatjs/intl-pluralrules/locale-data/eo'), 140 import('@formatjs/intl-numberformat/locale-data/eo'), 141 // borked, see https://github.com/bluesky-social/social-app/pull/9574 142 // import('@formatjs/intl-displaynames/locale-data/eo'), 143 ]) 144 - break 145 } 146 case AppLanguage.es: { 147 i18n.loadAndActivate({locale, messages: messagesEs}) 148 - await Promise.all([ 149 import('@formatjs/intl-pluralrules/locale-data/es'), 150 import('@formatjs/intl-numberformat/locale-data/es'), 151 import('@formatjs/intl-displaynames/locale-data/es'), 152 ]) 153 - break 154 } 155 case AppLanguage.eu: { 156 i18n.loadAndActivate({locale, messages: messagesEu}) 157 - await Promise.all([ 158 import('@formatjs/intl-pluralrules/locale-data/eu'), 159 import('@formatjs/intl-numberformat/locale-data/eu'), 160 import('@formatjs/intl-displaynames/locale-data/eu'), 161 ]) 162 - break 163 } 164 case AppLanguage.fi: { 165 i18n.loadAndActivate({locale, messages: messagesFi}) 166 - await Promise.all([ 167 import('@formatjs/intl-pluralrules/locale-data/fi'), 168 import('@formatjs/intl-numberformat/locale-data/fi'), 169 import('@formatjs/intl-displaynames/locale-data/fi'), 170 ]) 171 - break 172 } 173 case AppLanguage.fr: { 174 i18n.loadAndActivate({locale, messages: messagesFr}) 175 - await Promise.all([ 176 import('@formatjs/intl-pluralrules/locale-data/fr'), 177 import('@formatjs/intl-numberformat/locale-data/fr'), 178 import('@formatjs/intl-displaynames/locale-data/fr'), 179 ]) 180 - break 181 } 182 case AppLanguage.fy: { 183 i18n.loadAndActivate({locale, messages: messagesFy}) 184 - await Promise.all([ 185 import('@formatjs/intl-pluralrules/locale-data/fy'), 186 import('@formatjs/intl-numberformat/locale-data/fy'), 187 import('@formatjs/intl-displaynames/locale-data/fy'), 188 ]) 189 - break 190 } 191 case AppLanguage.ga: { 192 i18n.loadAndActivate({locale, messages: messagesGa}) ··· 195 import('@formatjs/intl-numberformat/locale-data/ga'), 196 import('@formatjs/intl-displaynames/locale-data/ga'), 197 ]) 198 - break 199 } 200 case AppLanguage.gd: { 201 i18n.loadAndActivate({locale, messages: messagesGd}) 202 - await Promise.all([ 203 import('@formatjs/intl-pluralrules/locale-data/gd'), 204 import('@formatjs/intl-numberformat/locale-data/gd'), 205 import('@formatjs/intl-displaynames/locale-data/gd'), 206 ]) 207 - break 208 } 209 case AppLanguage.gl: { 210 i18n.loadAndActivate({locale, messages: messagesGl}) 211 - await Promise.all([ 212 import('@formatjs/intl-pluralrules/locale-data/gl'), 213 import('@formatjs/intl-numberformat/locale-data/gl'), 214 import('@formatjs/intl-displaynames/locale-data/gl'), 215 ]) 216 - break 217 } 218 case AppLanguage.hi: { 219 i18n.loadAndActivate({locale, messages: messagesHi}) 220 - await Promise.all([ 221 import('@formatjs/intl-pluralrules/locale-data/hi'), 222 import('@formatjs/intl-numberformat/locale-data/hi'), 223 import('@formatjs/intl-displaynames/locale-data/hi'), 224 ]) 225 - break 226 } 227 case AppLanguage.hu: { 228 i18n.loadAndActivate({locale, messages: messagesHu}) 229 - await Promise.all([ 230 import('@formatjs/intl-pluralrules/locale-data/hu'), 231 import('@formatjs/intl-numberformat/locale-data/hu'), 232 import('@formatjs/intl-displaynames/locale-data/hu'), 233 ]) 234 - break 235 } 236 case AppLanguage.ia: { 237 i18n.loadAndActivate({locale, messages: messagesIa}) ··· 240 import('@formatjs/intl-numberformat/locale-data/ia'), 241 import('@formatjs/intl-displaynames/locale-data/ia'), 242 ]) 243 - break 244 } 245 case AppLanguage.id: { 246 i18n.loadAndActivate({locale, messages: messagesId}) 247 - await Promise.all([ 248 import('@formatjs/intl-pluralrules/locale-data/id'), 249 import('@formatjs/intl-numberformat/locale-data/id'), 250 import('@formatjs/intl-displaynames/locale-data/id'), 251 ]) 252 - break 253 } 254 case AppLanguage.it: { 255 i18n.loadAndActivate({locale, messages: messagesIt}) 256 - await Promise.all([ 257 import('@formatjs/intl-pluralrules/locale-data/it'), 258 import('@formatjs/intl-numberformat/locale-data/it'), 259 import('@formatjs/intl-displaynames/locale-data/it'), 260 ]) 261 - break 262 } 263 case AppLanguage.ja: { 264 i18n.loadAndActivate({locale, messages: messagesJa}) 265 - await Promise.all([ 266 import('@formatjs/intl-pluralrules/locale-data/ja'), 267 import('@formatjs/intl-numberformat/locale-data/ja'), 268 import('@formatjs/intl-displaynames/locale-data/ja'), 269 ]) 270 - break 271 } 272 case AppLanguage.km: { 273 i18n.loadAndActivate({locale, messages: messagesKm}) 274 - await Promise.all([ 275 import('@formatjs/intl-pluralrules/locale-data/km'), 276 import('@formatjs/intl-numberformat/locale-data/km'), 277 import('@formatjs/intl-displaynames/locale-data/km'), 278 ]) 279 - break 280 } 281 case AppLanguage.ko: { 282 i18n.loadAndActivate({locale, messages: messagesKo}) 283 - await Promise.all([ 284 import('@formatjs/intl-pluralrules/locale-data/ko'), 285 import('@formatjs/intl-numberformat/locale-data/ko'), 286 import('@formatjs/intl-displaynames/locale-data/ko'), 287 ]) 288 - break 289 } 290 case AppLanguage.ne: { 291 i18n.loadAndActivate({locale, messages: messagesNe}) ··· 294 import('@formatjs/intl-numberformat/locale-data/ne'), 295 import('@formatjs/intl-displaynames/locale-data/ne'), 296 ]) 297 - break 298 } 299 case AppLanguage.nl: { 300 i18n.loadAndActivate({locale, messages: messagesNl}) 301 - await Promise.all([ 302 import('@formatjs/intl-pluralrules/locale-data/nl'), 303 import('@formatjs/intl-numberformat/locale-data/nl'), 304 import('@formatjs/intl-displaynames/locale-data/nl'), 305 ]) 306 - break 307 } 308 case AppLanguage.pl: { 309 i18n.loadAndActivate({locale, messages: messagesPl}) 310 - await Promise.all([ 311 import('@formatjs/intl-pluralrules/locale-data/pl'), 312 import('@formatjs/intl-numberformat/locale-data/pl'), 313 import('@formatjs/intl-displaynames/locale-data/pl'), 314 ]) 315 - break 316 } 317 case AppLanguage.pt_BR: { 318 i18n.loadAndActivate({locale, messages: messagesPt_BR}) 319 - await Promise.all([ 320 import('@formatjs/intl-pluralrules/locale-data/pt'), 321 import('@formatjs/intl-numberformat/locale-data/pt'), 322 import('@formatjs/intl-displaynames/locale-data/pt'), 323 ]) 324 - break 325 } 326 case AppLanguage.pt_PT: { 327 i18n.loadAndActivate({locale, messages: messagesPt_PT}) 328 - await Promise.all([ 329 import('@formatjs/intl-pluralrules/locale-data/pt-PT'), 330 import('@formatjs/intl-numberformat/locale-data/pt-PT'), 331 import('@formatjs/intl-displaynames/locale-data/pt-PT'), 332 ]) 333 - break 334 } 335 case AppLanguage.ro: { 336 i18n.loadAndActivate({locale, messages: messagesRo}) 337 - await Promise.all([ 338 import('@formatjs/intl-pluralrules/locale-data/ro'), 339 import('@formatjs/intl-numberformat/locale-data/ro'), 340 import('@formatjs/intl-displaynames/locale-data/ro'), 341 ]) 342 - break 343 } 344 case AppLanguage.ru: { 345 i18n.loadAndActivate({locale, messages: messagesRu}) 346 - await Promise.all([ 347 import('@formatjs/intl-pluralrules/locale-data/ru'), 348 import('@formatjs/intl-numberformat/locale-data/ru'), 349 import('@formatjs/intl-displaynames/locale-data/ru'), 350 ]) 351 - break 352 } 353 case AppLanguage.sv: { 354 i18n.loadAndActivate({locale, messages: messagesSv}) 355 - await Promise.all([ 356 import('@formatjs/intl-pluralrules/locale-data/sv'), 357 import('@formatjs/intl-numberformat/locale-data/sv'), 358 import('@formatjs/intl-displaynames/locale-data/sv'), 359 ]) 360 - break 361 } 362 case AppLanguage.th: { 363 i18n.loadAndActivate({locale, messages: messagesTh}) 364 - await Promise.all([ 365 import('@formatjs/intl-pluralrules/locale-data/th'), 366 import('@formatjs/intl-numberformat/locale-data/th'), 367 import('@formatjs/intl-displaynames/locale-data/th'), 368 ]) 369 - break 370 } 371 case AppLanguage.tr: { 372 i18n.loadAndActivate({locale, messages: messagesTr}) 373 - await Promise.all([ 374 import('@formatjs/intl-pluralrules/locale-data/tr'), 375 import('@formatjs/intl-numberformat/locale-data/tr'), 376 import('@formatjs/intl-displaynames/locale-data/tr'), 377 ]) 378 - break 379 } 380 case AppLanguage.uk: { 381 i18n.loadAndActivate({locale, messages: messagesUk}) 382 - await Promise.all([ 383 import('@formatjs/intl-pluralrules/locale-data/uk'), 384 import('@formatjs/intl-numberformat/locale-data/uk'), 385 import('@formatjs/intl-displaynames/locale-data/uk'), 386 ]) 387 - break 388 } 389 case AppLanguage.vi: { 390 i18n.loadAndActivate({locale, messages: messagesVi}) 391 - await Promise.all([ 392 import('@formatjs/intl-pluralrules/locale-data/vi'), 393 import('@formatjs/intl-numberformat/locale-data/vi'), 394 import('@formatjs/intl-displaynames/locale-data/vi'), 395 ]) 396 - break 397 } 398 case AppLanguage.zh_CN: { 399 i18n.loadAndActivate({locale, messages: messagesZh_CN}) 400 - await Promise.all([ 401 import('@formatjs/intl-pluralrules/locale-data/zh'), 402 import('@formatjs/intl-numberformat/locale-data/zh'), 403 import('@formatjs/intl-displaynames/locale-data/zh'), 404 ]) 405 - break 406 } 407 case AppLanguage.zh_HK: { 408 i18n.loadAndActivate({locale, messages: messagesZh_HK}) 409 - await Promise.all([ 410 import('@formatjs/intl-pluralrules/locale-data/zh'), 411 import('@formatjs/intl-numberformat/locale-data/zh'), 412 import('@formatjs/intl-displaynames/locale-data/zh'), 413 ]) 414 - break 415 } 416 case AppLanguage.zh_TW: { 417 i18n.loadAndActivate({locale, messages: messagesZh_TW}) 418 - await Promise.all([ 419 import('@formatjs/intl-pluralrules/locale-data/zh'), 420 import('@formatjs/intl-numberformat/locale-data/zh'), 421 import('@formatjs/intl-displaynames/locale-data/zh'), 422 ]) 423 - break 424 } 425 default: { 426 i18n.loadAndActivate({locale, messages: messagesEn}) 427 - break 428 } 429 } 430 } 431 432 export function useLocaleLanguage() { 433 const {appLanguage} = useLanguagePrefs() 434 useEffect(() => { 435 - dynamicActivate(sanitizeAppLanguageSetting(appLanguage)) 436 }, [appLanguage]) 437 }
··· 8 import '@formatjs/intl-numberformat/locale-data/en' 9 import '@formatjs/intl-displaynames/locale-data/en' 10 11 + import {useEffect, useState} from 'react' 12 import {i18n} from '@lingui/core' 13 + import defaultLocale from 'date-fns/locale/en-US' 14 15 import {sanitizeAppLanguageSetting} from '#/locale/helpers' 16 import {AppLanguage} from '#/locale/languages' ··· 64 switch (locale) { 65 case AppLanguage.an: { 66 i18n.loadAndActivate({locale, messages: messagesAn}) 67 + const [{default: dateLocale}] = await Promise.all([ 68 + import('date-fns/locale/es'), 69 import('@formatjs/intl-pluralrules/locale-data/an'), 70 import('@formatjs/intl-numberformat/locale-data/es'), 71 import('@formatjs/intl-displaynames/locale-data/es'), 72 ]) 73 + return dateLocale 74 } 75 case AppLanguage.ast: { 76 i18n.loadAndActivate({locale, messages: messagesAst}) 77 + const [{default: dateLocale}] = await Promise.all([ 78 + import('date-fns/locale/es'), 79 import('@formatjs/intl-pluralrules/locale-data/ast'), 80 import('@formatjs/intl-numberformat/locale-data/ast'), 81 import('@formatjs/intl-displaynames/locale-data/ast'), 82 ]) 83 + return dateLocale 84 } 85 case AppLanguage.ca: { 86 i18n.loadAndActivate({locale, messages: messagesCa}) 87 + const [{default: dateLocale}] = await Promise.all([ 88 + import('date-fns/locale/ca'), 89 import('@formatjs/intl-pluralrules/locale-data/ca'), 90 import('@formatjs/intl-numberformat/locale-data/ca'), 91 import('@formatjs/intl-displaynames/locale-data/ca'), 92 ]) 93 + return dateLocale 94 } 95 case AppLanguage.cy: { 96 i18n.loadAndActivate({locale, messages: messagesCy}) 97 + const [{default: dateLocale}] = await Promise.all([ 98 + import('date-fns/locale/cy'), 99 import('@formatjs/intl-pluralrules/locale-data/cy'), 100 import('@formatjs/intl-numberformat/locale-data/cy'), 101 import('@formatjs/intl-displaynames/locale-data/cy'), 102 ]) 103 + return dateLocale 104 } 105 case AppLanguage.da: { 106 i18n.loadAndActivate({locale, messages: messagesDa}) 107 + const [{default: dateLocale}] = await Promise.all([ 108 + import('date-fns/locale/da'), 109 import('@formatjs/intl-pluralrules/locale-data/da'), 110 import('@formatjs/intl-numberformat/locale-data/da'), 111 import('@formatjs/intl-displaynames/locale-data/da'), 112 ]) 113 + return dateLocale 114 } 115 case AppLanguage.de: { 116 i18n.loadAndActivate({locale, messages: messagesDe}) 117 + const [{default: dateLocale}] = await Promise.all([ 118 + import('date-fns/locale/de'), 119 import('@formatjs/intl-pluralrules/locale-data/de'), 120 import('@formatjs/intl-numberformat/locale-data/de'), 121 import('@formatjs/intl-displaynames/locale-data/de'), 122 ]) 123 + return dateLocale 124 } 125 case AppLanguage.el: { 126 i18n.loadAndActivate({locale, messages: messagesEl}) 127 + const [{default: dateLocale}] = await Promise.all([ 128 + import('date-fns/locale/el'), 129 import('@formatjs/intl-pluralrules/locale-data/el'), 130 import('@formatjs/intl-numberformat/locale-data/el'), 131 import('@formatjs/intl-displaynames/locale-data/el'), 132 ]) 133 + return dateLocale 134 } 135 case AppLanguage.en_GB: { 136 i18n.loadAndActivate({locale, messages: messagesEn_GB}) 137 + const [{default: dateLocale}] = await Promise.all([ 138 + import('date-fns/locale/en-GB'), 139 import('@formatjs/intl-pluralrules/locale-data/en'), 140 import('@formatjs/intl-numberformat/locale-data/en-GB'), 141 import('@formatjs/intl-displaynames/locale-data/en-GB'), 142 ]) 143 + return dateLocale 144 } 145 case AppLanguage.eo: { 146 i18n.loadAndActivate({locale, messages: messagesEo}) 147 + const [{default: dateLocale}] = await Promise.all([ 148 + import('date-fns/locale/eo'), 149 import('@formatjs/intl-pluralrules/locale-data/eo'), 150 import('@formatjs/intl-numberformat/locale-data/eo'), 151 // borked, see https://github.com/bluesky-social/social-app/pull/9574 152 // import('@formatjs/intl-displaynames/locale-data/eo'), 153 ]) 154 + return dateLocale 155 } 156 case AppLanguage.es: { 157 i18n.loadAndActivate({locale, messages: messagesEs}) 158 + const [{default: dateLocale}] = await Promise.all([ 159 + import('date-fns/locale/es'), 160 import('@formatjs/intl-pluralrules/locale-data/es'), 161 import('@formatjs/intl-numberformat/locale-data/es'), 162 import('@formatjs/intl-displaynames/locale-data/es'), 163 ]) 164 + return dateLocale 165 } 166 case AppLanguage.eu: { 167 i18n.loadAndActivate({locale, messages: messagesEu}) 168 + const [{default: dateLocale}] = await Promise.all([ 169 + import('date-fns/locale/eu'), 170 import('@formatjs/intl-pluralrules/locale-data/eu'), 171 import('@formatjs/intl-numberformat/locale-data/eu'), 172 import('@formatjs/intl-displaynames/locale-data/eu'), 173 ]) 174 + return dateLocale 175 } 176 case AppLanguage.fi: { 177 i18n.loadAndActivate({locale, messages: messagesFi}) 178 + const [{default: dateLocale}] = await Promise.all([ 179 + import('date-fns/locale/fi'), 180 import('@formatjs/intl-pluralrules/locale-data/fi'), 181 import('@formatjs/intl-numberformat/locale-data/fi'), 182 import('@formatjs/intl-displaynames/locale-data/fi'), 183 ]) 184 + return dateLocale 185 } 186 case AppLanguage.fr: { 187 i18n.loadAndActivate({locale, messages: messagesFr}) 188 + const [{default: dateLocale}] = await Promise.all([ 189 + import('date-fns/locale/fr'), 190 import('@formatjs/intl-pluralrules/locale-data/fr'), 191 import('@formatjs/intl-numberformat/locale-data/fr'), 192 import('@formatjs/intl-displaynames/locale-data/fr'), 193 ]) 194 + return dateLocale 195 } 196 case AppLanguage.fy: { 197 i18n.loadAndActivate({locale, messages: messagesFy}) 198 + const [{default: dateLocale}] = await Promise.all([ 199 + import('date-fns/locale/fy'), 200 import('@formatjs/intl-pluralrules/locale-data/fy'), 201 import('@formatjs/intl-numberformat/locale-data/fy'), 202 import('@formatjs/intl-displaynames/locale-data/fy'), 203 ]) 204 + return dateLocale 205 } 206 case AppLanguage.ga: { 207 i18n.loadAndActivate({locale, messages: messagesGa}) ··· 210 import('@formatjs/intl-numberformat/locale-data/ga'), 211 import('@formatjs/intl-displaynames/locale-data/ga'), 212 ]) 213 + return undefined 214 } 215 case AppLanguage.gd: { 216 i18n.loadAndActivate({locale, messages: messagesGd}) 217 + const [{default: dateLocale}] = await Promise.all([ 218 + import('date-fns/locale/gd'), 219 import('@formatjs/intl-pluralrules/locale-data/gd'), 220 import('@formatjs/intl-numberformat/locale-data/gd'), 221 import('@formatjs/intl-displaynames/locale-data/gd'), 222 ]) 223 + return dateLocale 224 } 225 case AppLanguage.gl: { 226 i18n.loadAndActivate({locale, messages: messagesGl}) 227 + const [{default: dateLocale}] = await Promise.all([ 228 + import('date-fns/locale/gl'), 229 import('@formatjs/intl-pluralrules/locale-data/gl'), 230 import('@formatjs/intl-numberformat/locale-data/gl'), 231 import('@formatjs/intl-displaynames/locale-data/gl'), 232 ]) 233 + return dateLocale 234 } 235 case AppLanguage.hi: { 236 i18n.loadAndActivate({locale, messages: messagesHi}) 237 + const [{default: dateLocale}] = await Promise.all([ 238 + import('date-fns/locale/hi'), 239 import('@formatjs/intl-pluralrules/locale-data/hi'), 240 import('@formatjs/intl-numberformat/locale-data/hi'), 241 import('@formatjs/intl-displaynames/locale-data/hi'), 242 ]) 243 + return dateLocale 244 } 245 case AppLanguage.hu: { 246 i18n.loadAndActivate({locale, messages: messagesHu}) 247 + const [{default: dateLocale}] = await Promise.all([ 248 + import('date-fns/locale/hu'), 249 import('@formatjs/intl-pluralrules/locale-data/hu'), 250 import('@formatjs/intl-numberformat/locale-data/hu'), 251 import('@formatjs/intl-displaynames/locale-data/hu'), 252 ]) 253 + return dateLocale 254 } 255 case AppLanguage.ia: { 256 i18n.loadAndActivate({locale, messages: messagesIa}) ··· 259 import('@formatjs/intl-numberformat/locale-data/ia'), 260 import('@formatjs/intl-displaynames/locale-data/ia'), 261 ]) 262 + return undefined 263 } 264 case AppLanguage.id: { 265 i18n.loadAndActivate({locale, messages: messagesId}) 266 + const [{default: dateLocale}] = await Promise.all([ 267 + import('date-fns/locale/id'), 268 import('@formatjs/intl-pluralrules/locale-data/id'), 269 import('@formatjs/intl-numberformat/locale-data/id'), 270 import('@formatjs/intl-displaynames/locale-data/id'), 271 ]) 272 + return dateLocale 273 } 274 case AppLanguage.it: { 275 i18n.loadAndActivate({locale, messages: messagesIt}) 276 + const [{default: dateLocale}] = await Promise.all([ 277 + import('date-fns/locale/it'), 278 import('@formatjs/intl-pluralrules/locale-data/it'), 279 import('@formatjs/intl-numberformat/locale-data/it'), 280 import('@formatjs/intl-displaynames/locale-data/it'), 281 ]) 282 + return dateLocale 283 } 284 case AppLanguage.ja: { 285 i18n.loadAndActivate({locale, messages: messagesJa}) 286 + const [{default: dateLocale}] = await Promise.all([ 287 + import('date-fns/locale/ja'), 288 import('@formatjs/intl-pluralrules/locale-data/ja'), 289 import('@formatjs/intl-numberformat/locale-data/ja'), 290 import('@formatjs/intl-displaynames/locale-data/ja'), 291 ]) 292 + return dateLocale 293 } 294 case AppLanguage.km: { 295 i18n.loadAndActivate({locale, messages: messagesKm}) 296 + const [{default: dateLocale}] = await Promise.all([ 297 + import('date-fns/locale/km'), 298 import('@formatjs/intl-pluralrules/locale-data/km'), 299 import('@formatjs/intl-numberformat/locale-data/km'), 300 import('@formatjs/intl-displaynames/locale-data/km'), 301 ]) 302 + return dateLocale 303 } 304 case AppLanguage.ko: { 305 i18n.loadAndActivate({locale, messages: messagesKo}) 306 + const [{default: dateLocale}] = await Promise.all([ 307 + import('date-fns/locale/ko'), 308 import('@formatjs/intl-pluralrules/locale-data/ko'), 309 import('@formatjs/intl-numberformat/locale-data/ko'), 310 import('@formatjs/intl-displaynames/locale-data/ko'), 311 ]) 312 + return dateLocale 313 } 314 case AppLanguage.ne: { 315 i18n.loadAndActivate({locale, messages: messagesNe}) ··· 318 import('@formatjs/intl-numberformat/locale-data/ne'), 319 import('@formatjs/intl-displaynames/locale-data/ne'), 320 ]) 321 + return undefined 322 } 323 case AppLanguage.nl: { 324 i18n.loadAndActivate({locale, messages: messagesNl}) 325 + const [{default: dateLocale}] = await Promise.all([ 326 + import('date-fns/locale/nl'), 327 import('@formatjs/intl-pluralrules/locale-data/nl'), 328 import('@formatjs/intl-numberformat/locale-data/nl'), 329 import('@formatjs/intl-displaynames/locale-data/nl'), 330 ]) 331 + return dateLocale 332 } 333 case AppLanguage.pl: { 334 i18n.loadAndActivate({locale, messages: messagesPl}) 335 + const [{default: dateLocale}] = await Promise.all([ 336 + import('date-fns/locale/pl'), 337 import('@formatjs/intl-pluralrules/locale-data/pl'), 338 import('@formatjs/intl-numberformat/locale-data/pl'), 339 import('@formatjs/intl-displaynames/locale-data/pl'), 340 ]) 341 + return dateLocale 342 } 343 case AppLanguage.pt_BR: { 344 i18n.loadAndActivate({locale, messages: messagesPt_BR}) 345 + const [{default: dateLocale}] = await Promise.all([ 346 + import('date-fns/locale/pt-BR'), 347 import('@formatjs/intl-pluralrules/locale-data/pt'), 348 import('@formatjs/intl-numberformat/locale-data/pt'), 349 import('@formatjs/intl-displaynames/locale-data/pt'), 350 ]) 351 + return dateLocale 352 } 353 case AppLanguage.pt_PT: { 354 i18n.loadAndActivate({locale, messages: messagesPt_PT}) 355 + const [{default: dateLocale}] = await Promise.all([ 356 + import('date-fns/locale/pt'), 357 import('@formatjs/intl-pluralrules/locale-data/pt-PT'), 358 import('@formatjs/intl-numberformat/locale-data/pt-PT'), 359 import('@formatjs/intl-displaynames/locale-data/pt-PT'), 360 ]) 361 + return dateLocale 362 } 363 case AppLanguage.ro: { 364 i18n.loadAndActivate({locale, messages: messagesRo}) 365 + const [{default: dateLocale}] = await Promise.all([ 366 + import('date-fns/locale/ro'), 367 import('@formatjs/intl-pluralrules/locale-data/ro'), 368 import('@formatjs/intl-numberformat/locale-data/ro'), 369 import('@formatjs/intl-displaynames/locale-data/ro'), 370 ]) 371 + return dateLocale 372 } 373 case AppLanguage.ru: { 374 i18n.loadAndActivate({locale, messages: messagesRu}) 375 + const [{default: dateLocale}] = await Promise.all([ 376 + import('date-fns/locale/ru'), 377 import('@formatjs/intl-pluralrules/locale-data/ru'), 378 import('@formatjs/intl-numberformat/locale-data/ru'), 379 import('@formatjs/intl-displaynames/locale-data/ru'), 380 ]) 381 + return dateLocale 382 } 383 case AppLanguage.sv: { 384 i18n.loadAndActivate({locale, messages: messagesSv}) 385 + const [{default: dateLocale}] = await Promise.all([ 386 + import('date-fns/locale/sv'), 387 import('@formatjs/intl-pluralrules/locale-data/sv'), 388 import('@formatjs/intl-numberformat/locale-data/sv'), 389 import('@formatjs/intl-displaynames/locale-data/sv'), 390 ]) 391 + return dateLocale 392 } 393 case AppLanguage.th: { 394 i18n.loadAndActivate({locale, messages: messagesTh}) 395 + const [{default: dateLocale}] = await Promise.all([ 396 + import('date-fns/locale/th'), 397 import('@formatjs/intl-pluralrules/locale-data/th'), 398 import('@formatjs/intl-numberformat/locale-data/th'), 399 import('@formatjs/intl-displaynames/locale-data/th'), 400 ]) 401 + return dateLocale 402 } 403 case AppLanguage.tr: { 404 i18n.loadAndActivate({locale, messages: messagesTr}) 405 + const [{default: dateLocale}] = await Promise.all([ 406 + import('date-fns/locale/tr'), 407 import('@formatjs/intl-pluralrules/locale-data/tr'), 408 import('@formatjs/intl-numberformat/locale-data/tr'), 409 import('@formatjs/intl-displaynames/locale-data/tr'), 410 ]) 411 + return dateLocale 412 } 413 case AppLanguage.uk: { 414 i18n.loadAndActivate({locale, messages: messagesUk}) 415 + const [{default: dateLocale}] = await Promise.all([ 416 + import('date-fns/locale/uk'), 417 import('@formatjs/intl-pluralrules/locale-data/uk'), 418 import('@formatjs/intl-numberformat/locale-data/uk'), 419 import('@formatjs/intl-displaynames/locale-data/uk'), 420 ]) 421 + return dateLocale 422 } 423 case AppLanguage.vi: { 424 i18n.loadAndActivate({locale, messages: messagesVi}) 425 + const [{default: dateLocale}] = await Promise.all([ 426 + import('date-fns/locale/vi'), 427 import('@formatjs/intl-pluralrules/locale-data/vi'), 428 import('@formatjs/intl-numberformat/locale-data/vi'), 429 import('@formatjs/intl-displaynames/locale-data/vi'), 430 ]) 431 + return dateLocale 432 } 433 case AppLanguage.zh_CN: { 434 i18n.loadAndActivate({locale, messages: messagesZh_CN}) 435 + const [{default: dateLocale}] = await Promise.all([ 436 + import('date-fns/locale/zh-CN'), 437 import('@formatjs/intl-pluralrules/locale-data/zh'), 438 import('@formatjs/intl-numberformat/locale-data/zh'), 439 import('@formatjs/intl-displaynames/locale-data/zh'), 440 ]) 441 + return dateLocale 442 } 443 case AppLanguage.zh_HK: { 444 i18n.loadAndActivate({locale, messages: messagesZh_HK}) 445 + const [{default: dateLocale}] = await Promise.all([ 446 + import('date-fns/locale/zh-HK'), 447 import('@formatjs/intl-pluralrules/locale-data/zh'), 448 import('@formatjs/intl-numberformat/locale-data/zh'), 449 import('@formatjs/intl-displaynames/locale-data/zh'), 450 ]) 451 + return dateLocale 452 } 453 case AppLanguage.zh_TW: { 454 i18n.loadAndActivate({locale, messages: messagesZh_TW}) 455 + const [{default: dateLocale}] = await Promise.all([ 456 + import('date-fns/locale/zh-TW'), 457 import('@formatjs/intl-pluralrules/locale-data/zh'), 458 import('@formatjs/intl-numberformat/locale-data/zh'), 459 import('@formatjs/intl-displaynames/locale-data/zh'), 460 ]) 461 + return dateLocale 462 } 463 default: { 464 i18n.loadAndActivate({locale, messages: messagesEn}) 465 + return defaultLocale 466 } 467 } 468 } 469 470 export function useLocaleLanguage() { 471 const {appLanguage} = useLanguagePrefs() 472 + const [dateLocale, setDateLocale] = useState(defaultLocale) 473 + 474 useEffect(() => { 475 + dynamicActivate(sanitizeAppLanguageSetting(appLanguage)).then(locale => { 476 + setDateLocale(locale ?? defaultLocale) 477 + }) 478 }, [appLanguage]) 479 + 480 + return dateLocale 481 }
+160 -39
src/locale/i18n.web.ts
··· 1 - import {useEffect} from 'react' 2 import {i18n} from '@lingui/core' 3 4 import {sanitizeAppLanguageSetting} from '#/locale/helpers' 5 import {AppLanguage} from '#/locale/languages' ··· 10 */ 11 export async function dynamicActivate(locale: AppLanguage) { 12 let mod: any 13 14 switch (locale) { 15 case AppLanguage.an: { 16 - mod = await import(`./locales/an/messages`) 17 break 18 } 19 case AppLanguage.ast: { 20 - mod = await import(`./locales/ast/messages`) 21 break 22 } 23 case AppLanguage.ca: { 24 - mod = await import(`./locales/ca/messages`) 25 break 26 } 27 case AppLanguage.cy: { 28 - mod = await import(`./locales/cy/messages`) 29 break 30 } 31 case AppLanguage.da: { 32 - mod = await import(`./locales/da/messages`) 33 break 34 } 35 case AppLanguage.de: { 36 - mod = await import(`./locales/de/messages`) 37 break 38 } 39 case AppLanguage.el: { 40 - mod = await import(`./locales/el/messages`) 41 break 42 } 43 case AppLanguage.en_GB: { 44 - mod = await import(`./locales/en-GB/messages`) 45 break 46 } 47 case AppLanguage.eo: { 48 - mod = await import(`./locales/eo/messages`) 49 break 50 } 51 case AppLanguage.es: { 52 - mod = await import(`./locales/es/messages`) 53 break 54 } 55 case AppLanguage.eu: { 56 - mod = await import(`./locales/eu/messages`) 57 break 58 } 59 case AppLanguage.fi: { 60 - mod = await import(`./locales/fi/messages`) 61 break 62 } 63 case AppLanguage.fr: { 64 - mod = await import(`./locales/fr/messages`) 65 break 66 } 67 case AppLanguage.fy: { 68 - mod = await import(`./locales/fy/messages`) 69 break 70 } 71 case AppLanguage.ga: { ··· 73 break 74 } 75 case AppLanguage.gd: { 76 - mod = await import(`./locales/gd/messages`) 77 break 78 } 79 case AppLanguage.gl: { 80 - mod = await import(`./locales/gl/messages`) 81 break 82 } 83 case AppLanguage.hi: { 84 - mod = await import(`./locales/hi/messages`) 85 break 86 } 87 case AppLanguage.hu: { 88 - mod = await import(`./locales/hu/messages`) 89 break 90 } 91 case AppLanguage.ia: { ··· 93 break 94 } 95 case AppLanguage.id: { 96 - mod = await import(`./locales/id/messages`) 97 break 98 } 99 case AppLanguage.it: { 100 - mod = await import(`./locales/it/messages`) 101 break 102 } 103 case AppLanguage.ja: { 104 - mod = await import(`./locales/ja/messages`) 105 break 106 } 107 case AppLanguage.km: { 108 - mod = await import(`./locales/km/messages`) 109 break 110 } 111 case AppLanguage.ko: { 112 - mod = await import(`./locales/ko/messages`) 113 break 114 } 115 case AppLanguage.ne: { ··· 117 break 118 } 119 case AppLanguage.nl: { 120 - mod = await import(`./locales/nl/messages`) 121 break 122 } 123 case AppLanguage.pl: { 124 - mod = await import(`./locales/pl/messages`) 125 break 126 } 127 case AppLanguage.pt_BR: { 128 - mod = await import(`./locales/pt-BR/messages`) 129 break 130 } 131 case AppLanguage.pt_PT: { 132 - mod = await import(`./locales/pt-PT/messages`) 133 break 134 } 135 case AppLanguage.ro: { 136 - mod = await import(`./locales/ro/messages`) 137 break 138 } 139 case AppLanguage.ru: { 140 - mod = await import(`./locales/ru/messages`) 141 break 142 } 143 case AppLanguage.sv: { 144 - mod = await import(`./locales/sv/messages`) 145 break 146 } 147 case AppLanguage.th: { 148 - mod = await import(`./locales/th/messages`) 149 break 150 } 151 case AppLanguage.tr: { 152 - mod = await import(`./locales/tr/messages`) 153 break 154 } 155 case AppLanguage.uk: { 156 - mod = await import(`./locales/uk/messages`) 157 break 158 } 159 case AppLanguage.vi: { 160 - mod = await import(`./locales/vi/messages`) 161 break 162 } 163 case AppLanguage.zh_CN: { 164 - mod = await import(`./locales/zh-CN/messages`) 165 break 166 } 167 case AppLanguage.zh_HK: { 168 - mod = await import(`./locales/zh-HK/messages`) 169 break 170 } 171 case AppLanguage.zh_TW: { 172 - mod = await import(`./locales/zh-TW/messages`) 173 break 174 } 175 default: { ··· 180 181 i18n.load(locale, mod.messages) 182 i18n.activate(locale) 183 } 184 185 export function useLocaleLanguage() { 186 const {appLanguage} = useLanguagePrefs() 187 useEffect(() => { 188 const sanitizedLanguage = sanitizeAppLanguageSetting(appLanguage) 189 190 document.documentElement.lang = sanitizedLanguage 191 - dynamicActivate(sanitizedLanguage) 192 }, [appLanguage]) 193 }
··· 1 + import {useEffect, useState} from 'react' 2 import {i18n} from '@lingui/core' 3 + import defaultLocale from 'date-fns/locale/en-US' 4 5 import {sanitizeAppLanguageSetting} from '#/locale/helpers' 6 import {AppLanguage} from '#/locale/languages' ··· 11 */ 12 export async function dynamicActivate(locale: AppLanguage) { 13 let mod: any 14 + let dateLocale: Locale = defaultLocale 15 16 switch (locale) { 17 case AppLanguage.an: { 18 + ;[mod, {default: dateLocale}] = await Promise.all([ 19 + import(`./locales/an/messages`), 20 + import('date-fns/locale/es'), 21 + ]) 22 break 23 } 24 case AppLanguage.ast: { 25 + ;[mod, {default: dateLocale}] = await Promise.all([ 26 + import(`./locales/ast/messages`), 27 + import('date-fns/locale/es'), 28 + ]) 29 break 30 } 31 case AppLanguage.ca: { 32 + ;[mod, {default: dateLocale}] = await Promise.all([ 33 + import(`./locales/ca/messages`), 34 + import('date-fns/locale/ca'), 35 + ]) 36 break 37 } 38 case AppLanguage.cy: { 39 + ;[mod, {default: dateLocale}] = await Promise.all([ 40 + import(`./locales/cy/messages`), 41 + import('date-fns/locale/cy'), 42 + ]) 43 break 44 } 45 case AppLanguage.da: { 46 + ;[mod, {default: dateLocale}] = await Promise.all([ 47 + import(`./locales/da/messages`), 48 + import('date-fns/locale/da'), 49 + ]) 50 break 51 } 52 case AppLanguage.de: { 53 + ;[mod, {default: dateLocale}] = await Promise.all([ 54 + import(`./locales/de/messages`), 55 + import('date-fns/locale/de'), 56 + ]) 57 break 58 } 59 case AppLanguage.el: { 60 + ;[mod, {default: dateLocale}] = await Promise.all([ 61 + import(`./locales/el/messages`), 62 + import('date-fns/locale/el'), 63 + ]) 64 break 65 } 66 case AppLanguage.en_GB: { 67 + ;[mod, {default: dateLocale}] = await Promise.all([ 68 + import(`./locales/en-GB/messages`), 69 + import('date-fns/locale/en-GB'), 70 + ]) 71 break 72 } 73 case AppLanguage.eo: { 74 + ;[mod, {default: dateLocale}] = await Promise.all([ 75 + import(`./locales/eo/messages`), 76 + import('date-fns/locale/eo'), 77 + ]) 78 break 79 } 80 case AppLanguage.es: { 81 + ;[mod, {default: dateLocale}] = await Promise.all([ 82 + import(`./locales/es/messages`), 83 + import('date-fns/locale/es'), 84 + ]) 85 break 86 } 87 case AppLanguage.eu: { 88 + ;[mod, {default: dateLocale}] = await Promise.all([ 89 + import(`./locales/eu/messages`), 90 + import('date-fns/locale/eu'), 91 + ]) 92 break 93 } 94 case AppLanguage.fi: { 95 + ;[mod, {default: dateLocale}] = await Promise.all([ 96 + import(`./locales/fi/messages`), 97 + import('date-fns/locale/fi'), 98 + ]) 99 break 100 } 101 case AppLanguage.fr: { 102 + ;[mod, {default: dateLocale}] = await Promise.all([ 103 + import(`./locales/fr/messages`), 104 + import('date-fns/locale/fr'), 105 + ]) 106 break 107 } 108 case AppLanguage.fy: { 109 + ;[mod, {default: dateLocale}] = await Promise.all([ 110 + import(`./locales/fy/messages`), 111 + import('date-fns/locale/fy'), 112 + ]) 113 break 114 } 115 case AppLanguage.ga: { ··· 117 break 118 } 119 case AppLanguage.gd: { 120 + ;[mod, {default: dateLocale}] = await Promise.all([ 121 + import(`./locales/gd/messages`), 122 + import('date-fns/locale/gd'), 123 + ]) 124 break 125 } 126 case AppLanguage.gl: { 127 + ;[mod, {default: dateLocale}] = await Promise.all([ 128 + import(`./locales/gl/messages`), 129 + import('date-fns/locale/gl'), 130 + ]) 131 break 132 } 133 case AppLanguage.hi: { 134 + ;[mod, {default: dateLocale}] = await Promise.all([ 135 + import(`./locales/hi/messages`), 136 + import('date-fns/locale/hi'), 137 + ]) 138 break 139 } 140 case AppLanguage.hu: { 141 + ;[mod, {default: dateLocale}] = await Promise.all([ 142 + import(`./locales/hu/messages`), 143 + import('date-fns/locale/hu'), 144 + ]) 145 break 146 } 147 case AppLanguage.ia: { ··· 149 break 150 } 151 case AppLanguage.id: { 152 + ;[mod, {default: dateLocale}] = await Promise.all([ 153 + import(`./locales/id/messages`), 154 + import('date-fns/locale/id'), 155 + ]) 156 break 157 } 158 case AppLanguage.it: { 159 + ;[mod, {default: dateLocale}] = await Promise.all([ 160 + import(`./locales/it/messages`), 161 + import('date-fns/locale/it'), 162 + ]) 163 break 164 } 165 case AppLanguage.ja: { 166 + ;[mod, {default: dateLocale}] = await Promise.all([ 167 + import(`./locales/ja/messages`), 168 + import('date-fns/locale/ja'), 169 + ]) 170 break 171 } 172 case AppLanguage.km: { 173 + ;[mod, {default: dateLocale}] = await Promise.all([ 174 + import(`./locales/km/messages`), 175 + import('date-fns/locale/km'), 176 + ]) 177 break 178 } 179 case AppLanguage.ko: { 180 + ;[mod, {default: dateLocale}] = await Promise.all([ 181 + import(`./locales/ko/messages`), 182 + import('date-fns/locale/ko'), 183 + ]) 184 break 185 } 186 case AppLanguage.ne: { ··· 188 break 189 } 190 case AppLanguage.nl: { 191 + ;[mod, {default: dateLocale}] = await Promise.all([ 192 + import(`./locales/nl/messages`), 193 + import('date-fns/locale/nl'), 194 + ]) 195 break 196 } 197 case AppLanguage.pl: { 198 + ;[mod, {default: dateLocale}] = await Promise.all([ 199 + import(`./locales/pl/messages`), 200 + import('date-fns/locale/pl'), 201 + ]) 202 break 203 } 204 case AppLanguage.pt_BR: { 205 + ;[mod, {default: dateLocale}] = await Promise.all([ 206 + import(`./locales/pt-BR/messages`), 207 + import('date-fns/locale/pt-BR'), 208 + ]) 209 break 210 } 211 case AppLanguage.pt_PT: { 212 + ;[mod, {default: dateLocale}] = await Promise.all([ 213 + import(`./locales/pt-PT/messages`), 214 + import('date-fns/locale/pt'), 215 + ]) 216 break 217 } 218 case AppLanguage.ro: { 219 + ;[mod, {default: dateLocale}] = await Promise.all([ 220 + import(`./locales/ro/messages`), 221 + import('date-fns/locale/ro'), 222 + ]) 223 break 224 } 225 case AppLanguage.ru: { 226 + ;[mod, {default: dateLocale}] = await Promise.all([ 227 + import(`./locales/ru/messages`), 228 + import('date-fns/locale/ru'), 229 + ]) 230 break 231 } 232 case AppLanguage.sv: { 233 + ;[mod, {default: dateLocale}] = await Promise.all([ 234 + import(`./locales/sv/messages`), 235 + import('date-fns/locale/sv'), 236 + ]) 237 break 238 } 239 case AppLanguage.th: { 240 + ;[mod, {default: dateLocale}] = await Promise.all([ 241 + import(`./locales/th/messages`), 242 + import('date-fns/locale/th'), 243 + ]) 244 break 245 } 246 case AppLanguage.tr: { 247 + ;[mod, {default: dateLocale}] = await Promise.all([ 248 + import(`./locales/tr/messages`), 249 + import('date-fns/locale/tr'), 250 + ]) 251 break 252 } 253 case AppLanguage.uk: { 254 + ;[mod, {default: dateLocale}] = await Promise.all([ 255 + import(`./locales/uk/messages`), 256 + import('date-fns/locale/uk'), 257 + ]) 258 break 259 } 260 case AppLanguage.vi: { 261 + ;[mod, {default: dateLocale}] = await Promise.all([ 262 + import(`./locales/vi/messages`), 263 + import('date-fns/locale/vi'), 264 + ]) 265 break 266 } 267 case AppLanguage.zh_CN: { 268 + ;[mod, {default: dateLocale}] = await Promise.all([ 269 + import(`./locales/zh-CN/messages`), 270 + import('date-fns/locale/zh-CN'), 271 + ]) 272 break 273 } 274 case AppLanguage.zh_HK: { 275 + ;[mod, {default: dateLocale}] = await Promise.all([ 276 + import(`./locales/zh-HK/messages`), 277 + import('date-fns/locale/zh-HK'), 278 + ]) 279 break 280 } 281 case AppLanguage.zh_TW: { 282 + ;[mod, {default: dateLocale}] = await Promise.all([ 283 + import(`./locales/zh-TW/messages`), 284 + import('date-fns/locale/zh-TW'), 285 + ]) 286 break 287 } 288 default: { ··· 293 294 i18n.load(locale, mod.messages) 295 i18n.activate(locale) 296 + 297 + return dateLocale 298 } 299 300 export function useLocaleLanguage() { 301 const {appLanguage} = useLanguagePrefs() 302 + const [dateLocale, setDateLocale] = useState(defaultLocale) 303 + 304 useEffect(() => { 305 const sanitizedLanguage = sanitizeAppLanguageSetting(appLanguage) 306 307 document.documentElement.lang = sanitizedLanguage 308 + dynamicActivate(sanitizedLanguage).then(locale => { 309 + setDateLocale(locale) 310 + }) 311 }, [appLanguage]) 312 + 313 + return dateLocale 314 }
+24 -2
src/locale/i18nProvider.tsx
··· 1 import {i18n} from '@lingui/core' 2 import {I18nProvider as DefaultI18nProvider} from '@lingui/react' 3 import type React from 'react' 4 5 import {useLocaleLanguage} from './i18n' 6 7 export default function I18nProvider({children}: {children: React.ReactNode}) { 8 - useLocaleLanguage() 9 - return <DefaultI18nProvider i18n={i18n}>{children}</DefaultI18nProvider> 10 }
··· 1 + import {createContext, useContext} from 'react' 2 import {i18n} from '@lingui/core' 3 import {I18nProvider as DefaultI18nProvider} from '@lingui/react' 4 + import {type Locale} from 'date-fns' 5 import type React from 'react' 6 7 import {useLocaleLanguage} from './i18n' 8 9 + const DateLocaleContext = createContext<Locale | undefined>(undefined) 10 + DateLocaleContext.displayName = 'DateLocaleContext' 11 + 12 export default function I18nProvider({children}: {children: React.ReactNode}) { 13 + const dateLocale = useLocaleLanguage() 14 + return ( 15 + <DateLocaleContext value={dateLocale}> 16 + <DefaultI18nProvider i18n={i18n}>{children}</DefaultI18nProvider> 17 + </DateLocaleContext> 18 + ) 19 + } 20 + 21 + /** 22 + * Returns a `date-fns` locale corresponding to the current app language 23 + */ 24 + export function useDateLocale() { 25 + const ctx = useContext(DateLocaleContext) 26 + 27 + if (!ctx) { 28 + throw new Error('useDateLocale must be used within an I18nProvider') 29 + } 30 + 31 + return ctx 32 }