mirror of
https://github.com/zoriya/Kyoo.git
synced 2025-05-31 04:04:21 -04:00
Persit selected language
This commit is contained in:
parent
261c97f97b
commit
ad80fd3bde
@ -74,7 +74,7 @@ i18next.use(initReactI18next).init({
|
|||||||
},
|
},
|
||||||
returnEmptyString: false,
|
returnEmptyString: false,
|
||||||
fallbackLng: "en",
|
fallbackLng: "en",
|
||||||
lng: getLocales()[0].languageCode ?? "en",
|
lng: storage.getString("language") ?? getLocales()[0].languageCode ?? "en",
|
||||||
resources,
|
resources,
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@ -23,6 +23,7 @@ import type { AppContext, AppInitialProps, AppProps } from "next/app";
|
|||||||
import { type ComponentType, useState } from "react";
|
import { type ComponentType, useState } from "react";
|
||||||
import { I18nextProvider } from "react-i18next";
|
import { I18nextProvider } from "react-i18next";
|
||||||
import resources from "../../../translations";
|
import resources from "../../../translations";
|
||||||
|
import { readCookie } from "@kyoo/models/src/account-internal";
|
||||||
|
|
||||||
export const withTranslations = (
|
export const withTranslations = (
|
||||||
AppToTranslate: ComponentType<AppProps> & {
|
AppToTranslate: ComponentType<AppProps> & {
|
||||||
@ -57,7 +58,11 @@ export const withTranslations = (
|
|||||||
};
|
};
|
||||||
AppWithTranslations.getInitialProps = async (ctx: AppContext) => {
|
AppWithTranslations.getInitialProps = async (ctx: AppContext) => {
|
||||||
const props: AppInitialProps = await AppToTranslate.getInitialProps(ctx);
|
const props: AppInitialProps = await AppToTranslate.getInitialProps(ctx);
|
||||||
const lng = ctx.router.locale || ctx.router.defaultLocale || "en";
|
const lng =
|
||||||
|
readCookie(ctx.ctx.req?.headers.cookie, "language") ||
|
||||||
|
ctx.router.locale ||
|
||||||
|
ctx.router.defaultLocale ||
|
||||||
|
"en";
|
||||||
await i18n.init({
|
await i18n.init({
|
||||||
...commonOptions,
|
...commonOptions,
|
||||||
lng,
|
lng,
|
||||||
|
@ -29,7 +29,16 @@ export const useUserTheme = (ssrTheme?: "light" | "dark" | "auto") => {
|
|||||||
return value as "light" | "dark" | "auto";
|
return value as "light" | "dark" | "auto";
|
||||||
};
|
};
|
||||||
|
|
||||||
export const setUserTheme = (theme: "light" | "dark" | "auto") => {
|
export const storeData = (key: string, value: string | number | boolean) => {
|
||||||
storage.set("theme", theme);
|
storage.set(key, value);
|
||||||
if (Platform.OS === "web") setCookie("theme", theme);
|
if (Platform.OS === "web") setCookie(key, value);
|
||||||
|
};
|
||||||
|
|
||||||
|
export const deleteData = (key: string) => {
|
||||||
|
storage.delete(key);
|
||||||
|
if (Platform.OS === "web") setCookie(key, undefined);
|
||||||
|
};
|
||||||
|
|
||||||
|
export const setUserTheme = (theme: "light" | "dark" | "auto") => {
|
||||||
|
storeData("theme", theme);
|
||||||
};
|
};
|
||||||
|
@ -18,7 +18,7 @@
|
|||||||
* along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
|
* along with Kyoo. If not, see <https://www.gnu.org/licenses/>.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import { setUserTheme, useUserTheme } from "@kyoo/models";
|
import { setUserTheme, storeData, useUserTheme } from "@kyoo/models";
|
||||||
import { Link, Select } from "@kyoo/primitives";
|
import { Link, Select } from "@kyoo/primitives";
|
||||||
import { useTranslation } from "react-i18next";
|
import { useTranslation } from "react-i18next";
|
||||||
import { Preference, SettingsContainer } from "./base";
|
import { Preference, SettingsContainer } from "./base";
|
||||||
@ -35,6 +35,15 @@ export const GeneralSettings = () => {
|
|||||||
const theme = useUserTheme("auto");
|
const theme = useUserTheme("auto");
|
||||||
const getLanguageName = useLanguageName();
|
const getLanguageName = useLanguageName();
|
||||||
|
|
||||||
|
const changeLanguage = (lang: string) => {
|
||||||
|
if (lang === "system") {
|
||||||
|
i18n.changeLanguage(i18n.options.lng as string);
|
||||||
|
return
|
||||||
|
}
|
||||||
|
storeData("language", lang);
|
||||||
|
i18n.changeLanguage(lang);
|
||||||
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<SettingsContainer title={t("settings.general.label")}>
|
<SettingsContainer title={t("settings.general.label")}>
|
||||||
<Preference
|
<Preference
|
||||||
@ -58,9 +67,7 @@ export const GeneralSettings = () => {
|
|||||||
<Select
|
<Select
|
||||||
label={t("settings.general.language.label")}
|
label={t("settings.general.language.label")}
|
||||||
value={i18n.resolvedLanguage!}
|
value={i18n.resolvedLanguage!}
|
||||||
onValueChange={(value) =>
|
onValueChange={(value) => changeLanguage(value)}
|
||||||
i18n.changeLanguage(value !== "system" ? value : (i18n.options.lng as string))
|
|
||||||
}
|
|
||||||
values={["system", ...Object.keys(i18n.options.resources!)]}
|
values={["system", ...Object.keys(i18n.options.resources!)]}
|
||||||
getLabel={(key) =>
|
getLabel={(key) =>
|
||||||
key === "system" ? t("settings.general.language.system") : getLanguageName(key) ?? key
|
key === "system" ? t("settings.general.language.system") : getLanguageName(key) ?? key
|
||||||
|
Loading…
x
Reference in New Issue
Block a user