Accessible dir prop based on language in the <html>

Maakaf · Jun 6, 2024 · e90baf2 · e90baf2
1 parent e27c7ea
commit e90baf2
Showing 1 changed file with 7 additions and 2 deletions.
diff --git a/app/[locale]/layout.tsx b/app/[locale]/layout.tsx
@@ -8,6 +8,7 @@ import Footer from '@/components/Footer/Footer';
 import { HOST } from '@/config/consts';
 import { unstable_setRequestLocale } from 'next-intl/server';
 import { NextIntlClientProvider, useMessages } from 'next-intl';
+import { Locale } from '../i18n';
 
 const birzia = Birzia({
   src: [
@@ -60,13 +61,17 @@ export default function RootLayout({
   params: { locale },
 }: {
   children: React.ReactNode;
-  params: { locale: string };
+  params: { locale: Locale };
 }) {
   unstable_setRequestLocale(locale);
   const messages = useMessages();
 
+  let dir = 'ltr';
+  if (locale === 'he') {
+    dir = 'rtl';
+  }
   return (
-    <html lang={locale} dir="rtl" suppressHydrationWarning={true}>
+    <html lang={locale} dir={dir} suppressHydrationWarning={true}>
       <meta charSet="ISO-8859-1" />
 
       <body