Remove getDirFromLang, in favour of doing this in the I18nLanguageHan… (#8425)

* Remove getDirFromLang, in favour of doing this in the I18nLanguageHandler exclusively

* Small tweak
pull/8394/head^2
Alex van Andel 2023-04-21 02:45:22 +02:00 committed by GitHub
parent 49cbdda4cf
commit dcbf695217
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 10 additions and 14 deletions

View File

@ -1,7 +1,7 @@
import { isEmpty } from "lodash";
import { useTranslation } from "next-i18next";
import { useEffect } from "react";
import { getDirFromLang } from "@calcom/lib/i18n";
import { trpc } from "@calcom/trpc/react";
export function useViewerI18n() {
@ -22,16 +22,18 @@ export function useViewerI18n() {
*/
const I18nLanguageHandler = (): null => {
const { i18n } = useTranslation("common");
const locale = useViewerI18n().data?.locale || "en";
const locale = useViewerI18n().data?.locale || i18n.language;
useEffect(() => {
if (locale && i18n.language && i18n.language !== locale) {
if (typeof i18n.changeLanguage === "function") i18n.changeLanguage(locale);
// bail early when i18n = {}
if (isEmpty(i18n)) return;
// if locale is ready and the i18n.language does != locale - changeLanguage
if (locale && i18n.language !== locale) {
i18n.changeLanguage(locale);
}
const dir = getDirFromLang(locale);
// set dir="rtl|ltr"
document.dir = i18n.dir();
document.documentElement.setAttribute("lang", locale);
document.documentElement.setAttribute("dir", dir);
}, [locale, i18n]);
return null;

View File

@ -3,8 +3,6 @@ import type { DocumentContext, DocumentProps } from "next/document";
import Document, { Head, Html, Main, NextScript } from "next/document";
import { z } from "zod";
import { getDirFromLang } from "@calcom/lib/i18n";
import { csp } from "@lib/csp";
type Props = Record<string, unknown> & DocumentProps;
@ -38,9 +36,8 @@ class MyDocument extends Document<Props> {
const { isEmbed } = this.props;
const nonceParsed = z.string().safeParse(this.props.nonce);
const nonce = nonceParsed.success ? nonceParsed.data : "";
const dir = getDirFromLang(locale);
return (
<Html lang={locale} dir={dir}>
<Html lang={locale}>
<Head nonce={nonce}>
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />

View File

@ -13,6 +13,3 @@ export function getLocaleFromHeaders(req: IncomingMessage): string {
}
return preferredLocale ?? i18n.defaultLocale;
}
export const getDirFromLang = (locale: string | undefined) =>
locale === "ar" || locale === "he" ? "rtl" : "ltr";