A way to automatically detect locales in browser?

[patrik-cihal]

How could i detect a locale and set it during the first server request?

Would be nice if this was a feature also... This is how I do it now

    let mut il8n = use_init_i18n(|| {
        I18nConfig::new(langid!("cs-CZ"))
            .with_locale((
                langid!("en-US"),
                include_str!("./locales/en-US.ftl")
            ))
            .with_locale((
                langid!("cs-CZ"),
                include_str!("./locales/cs-CZ.ftl")
            ))
    });

    // Use effect to update language after client-side hydration
    use_effect(move || {
        #[cfg(feature = "web")] {
            let browser_locale = get_browser_locale();
            il8n.set_language(browser_locale);
        }
    });

[VassilisM]

Hi. This is what I am using.

	let mut i18n = use_context::<I18n>();
	let _initialize_locale = use_future(move || async move {
		let mut stored_locale = document::eval(&format!(r#"
			const fallback = navigator.language?.substring(0, 2)?.toLowerCase() || "en"
			const locale = localStorage.getItem("locale")
			console.info(`locale initialized: ${{locale}}`)
			dioxus.send(locale || fallback)
		"#));

		let selected_stored_locale: String = stored_locale.recv().await.unwrap();

		match selected_stored_locale.parse() {
			Ok(language_identifier) => i18n.set_language(language_identifier),
			Err(_) => i18n.set_language(langid!("en")),
		};
	});

[patrik-cihal]

Thanks, but this still happens only after the initial page load, so I think it's pretty much the same thing I have.

[nigeleke]

@patrik-cihal (cc @VassilisM)

I do this - it's a bit lengthy - which picks out and persists the language. If the user changes to some other preference (allowed in my app) that is persisted (rather than being overridden by the next browser usage)

    let document_language = use_resource(move || async move {
        let mut eval = document::eval("dioxus.send(navigator.language)");
        let lang = Language::try_from(eval.recv::<String>().await.unwrap()).unwrap();
        info!("use_resource::lang: {:?}", lang);
        lang
    });

    #[allow(clippy::redundant_closure)]
    let mut preferred_language =
        use_storage::<LocalStorage, _>("lang".into(), || document_language());
    let preferred_language_is_defined = use_signal(|| (*preferred_language.read()).is_some());

    use_effect(move || {
        if !*preferred_language_is_defined.read() {
            preferred_language.set(document_language());
        }
    });

    provide_context(preferred_language);

    let mut i18n = use_init_i18n(|| i18n::config(langid!("en-GB")));
    use_effect(move || {
        if let Some(preferred_language) = preferred_language.read().as_ref() {
            dioxus::logger::tracing::info!("Setting preferred language {:?}", preferred_language);
            i18n.set_language(preferred_language.identifier());
        }
    });

Full project @ https://github.com/nigeleke/scopa