From ef4e7ed76f274ccaa28455227a812a1ae66772a6 Mon Sep 17 00:00:00 2001
From: Josh Hawkins <32435876+hawkeye217@users.noreply.github.com>
Date: Tue, 22 Apr 2025 22:44:09 -0500
Subject: [PATCH] move smart capitalization logic into language provider

---
 web/src/App.tsx                       | 10 +---------
 web/src/context/language-provider.tsx |  3 +++
 2 files changed, 4 insertions(+), 9 deletions(-)

diff --git a/web/src/App.tsx b/web/src/App.tsx
index 83a3b03047..a0062549fa 100644
--- a/web/src/App.tsx
+++ b/web/src/App.tsx
@@ -6,13 +6,12 @@ import Sidebar from "@/components/navigation/Sidebar";
 import { isDesktop, isMobile } from "react-device-detect";
 import Statusbar from "./components/Statusbar";
 import Bottombar from "./components/navigation/Bottombar";
-import React, { Suspense, lazy } from "react";
+import { Suspense, lazy } from "react";
 import { Redirect } from "./components/navigation/Redirect";
 import { cn } from "./lib/utils";
 import { isPWA } from "./utils/isPWA";
 import ProtectedRoute from "@/components/auth/ProtectedRoute";
 import { AuthProvider } from "@/context/auth-context";
-import { useTranslation } from "react-i18next";
 
 const Live = lazy(() => import("@/pages/Live"));
 const Events = lazy(() => import("@/pages/Events"));
@@ -27,13 +26,6 @@ const Logs = lazy(() => import("@/pages/Logs"));
 const AccessDenied = lazy(() => import("@/pages/AccessDenied"));
 
 function App() {
-  const { i18n } = useTranslation();
-
-  // Set the lang attribute on the html element when language changes
-  React.useEffect(() => {
-    document.documentElement.lang = i18n.language;
-  }, [i18n.language]);
-
   return (
     <Providers>
       <AuthProvider>
diff --git a/web/src/context/language-provider.tsx b/web/src/context/language-provider.tsx
index e0c965494b..4d935da978 100644
--- a/web/src/context/language-provider.tsx
+++ b/web/src/context/language-provider.tsx
@@ -45,6 +45,9 @@ export function LanguageProvider({
   }, []);
 
   useEffect(() => {
+    // set document lang for smart capitalization
+    document.documentElement.lang = language;
+
     if (language === systemLanguage) return;
     i18next.changeLanguage(language);
   }, [language, systemLanguage]);