* feature eventType specific language or bookingPage language * chore * fix type checks * chore * chore: remove log * improvement: this updates in DatePicker is not required with context provider method * added e2e tests for InterfaceLanguage feature * corrected prev merge conflict issues * update to align with hooks usage pattern * chore * unrelated auto-formatting changes * unrelated auto-formatting changes * unrelated auto-formatting changes * update to affect interfaceLanguage on success page * undone prettier changes * update test for success page translation * chore * return null from memo * fix typecheck error due to atom imports in useLocale * set default interfaceLanguage as null * updated to use null instead of constant * enhancements * fix latest unit test, use prop instead of useSession hook * fix build issue * chore * fix atom build issue * fix unit test with reqd mock * update to use server i18n rendering * nit * Move import localeOptions to EventSetupTabWebWrapper * make sure we only display interface language option in web app * using customI18nProvider --------- Co-authored-by: amrit <iamamrit27@gmail.com> Co-authored-by: Tushar Bhatt <95581504+TusharBhatt1@users.noreply.github.com> Co-authored-by: Tushar <tusharbhatt0135@gmail.com> Co-authored-by: Anik Dhabal Babu <81948346+anikdhabal@users.noreply.github.com> Co-authored-by: Peer Richelsen <peeroke@gmail.com> Co-authored-by: Ryukemeister <sahalrajiv6900@gmail.com> Co-authored-by: Rajiv Sahal <sahalrajiv-extc@atharvacoe.ac.in> Co-authored-by: Benny Joo <sldisek783@gmail.com>
74 lines
2.1 KiB
TypeScript
74 lines
2.1 KiB
TypeScript
import { createInstance } from "i18next";
|
|
import type { TFunction, i18n } from "i18next";
|
|
import { useContext } from "react";
|
|
import { useTranslation } from "react-i18next";
|
|
|
|
import { useAtomsContext } from "@calcom/atoms/hooks/useAtomsContext";
|
|
import { AppRouterI18nContext } from "@calcom/web/app/AppRouterI18nProvider";
|
|
import { CustomI18nContext } from "@calcom/web/app/CustomI18nProvider";
|
|
|
|
type useLocaleReturnType = {
|
|
i18n: i18n;
|
|
t: TFunction;
|
|
isLocaleReady: boolean;
|
|
};
|
|
|
|
// @internal
|
|
const useClientLocale = (namespace: Parameters<typeof useTranslation>[0] = "common"): useLocaleReturnType => {
|
|
const context = useAtomsContext();
|
|
const { i18n, t } = useTranslation(namespace);
|
|
const isLocaleReady = Object.keys(i18n).length > 0;
|
|
if (context?.clientId) {
|
|
return { i18n: context.i18n, t: context.t, isLocaleReady: true } as unknown as useLocaleReturnType;
|
|
}
|
|
return {
|
|
i18n,
|
|
t,
|
|
isLocaleReady,
|
|
};
|
|
};
|
|
|
|
// @internal
|
|
const serverI18nInstances = new Map();
|
|
|
|
export const useLocale = (): useLocaleReturnType => {
|
|
const appRouterContext = useContext(AppRouterI18nContext);
|
|
const customI18nContext = useContext(CustomI18nContext);
|
|
const clientI18n = useClientLocale();
|
|
|
|
if (appRouterContext) {
|
|
const { translations, locale, ns } = customI18nContext ?? appRouterContext;
|
|
const instanceKey = `${locale}-${ns}`;
|
|
|
|
// Check if we already have an instance for this locale and namespace
|
|
if (!serverI18nInstances.has(instanceKey)) {
|
|
const i18n = createInstance();
|
|
i18n.init({
|
|
lng: locale,
|
|
resources: {
|
|
[locale]: {
|
|
[ns]: translations,
|
|
},
|
|
},
|
|
});
|
|
|
|
serverI18nInstances.set(instanceKey, {
|
|
t: i18n.getFixedT(locale, ns),
|
|
isLocaleReady: true,
|
|
i18n,
|
|
});
|
|
}
|
|
|
|
return serverI18nInstances.get(instanceKey);
|
|
}
|
|
|
|
console.warn(
|
|
"useLocale hook is being used outside of App Router - hence this hook will use a global, client-side i18n which can cause a small flicker"
|
|
);
|
|
return {
|
|
t: clientI18n.t,
|
|
isLocaleReady: clientI18n.isLocaleReady,
|
|
i18n: clientI18n.i18n,
|
|
};
|
|
};
|