diff --git a/docs/src/app/[locale]/(doc-session)/layout.tsx b/docs/src/app/[locale]/(doc-session)/layout.tsx
index 5cc5939..a9e92ba 100644
--- a/docs/src/app/[locale]/(doc-session)/layout.tsx
+++ b/docs/src/app/[locale]/(doc-session)/layout.tsx
@@ -3,6 +3,7 @@ import "react-modern-drawer/dist/index.css";
 import type { Metadata } from "next";
 import { setStaticParamsLocale } from "next-international/server";
 
+import { I18nProviderClient } from "@/locales/client";
 import { getScopedI18n } from "@/locales/server";
 
 import { LocaleParams } from "../types/locale";
@@ -30,6 +31,7 @@ type DocumentationLayoutProps = Readonly<{
 
 export default function DocumentationLayout({
 	children,
+	params: { locale },
 }: DocumentationLayoutProps) {
-	return <>{children}</>;
+	return <I18nProviderClient locale={locale}>{children}</I18nProviderClient>;
 }
diff --git a/docs/src/app/page.tsx b/docs/src/app/page.tsx
index 321dd13..e065502 100644
--- a/docs/src/app/page.tsx
+++ b/docs/src/app/page.tsx
@@ -1,7 +1,7 @@
 import Image from "next/image";
 import Link from "next/link";
 
-import Intercepter from "@/components/Intercepter";
+import Intercepter from "@/components/Interceptor";
 import translation from "@/components/Internationalization";
 import MainBg from "@/components/MainBg";
 import { merriweather, oswald, playfair, roboto100, sofiaPro } from "@/fonts";
diff --git a/docs/src/components/Footer/index.tsx b/docs/src/components/Footer/index.tsx
index 058ce50..ac7f269 100644
--- a/docs/src/components/Footer/index.tsx
+++ b/docs/src/components/Footer/index.tsx
@@ -7,12 +7,12 @@ import { FaYoutube, FaInstagram, FaGithub, FaLinkedin } from "react-icons/fa";
 
 import { playfair, sofiaPro } from "@/fonts";
 
-import translation, { getBrowserLang } from "../Internationalization";
+import translation, { Langs, getBrowserLang } from "../Internationalization";
 
 export default function Footer() {
 	const [isClient, setIsClient] = useState(false);
 
-	const browserLang = getBrowserLang();
+	const browserLang = getBrowserLang() as unknown as (Langs | undefined)[];
 
 	const t = (text: string) =>
 		translation({ text, subject: "Footer", language: browserLang });
diff --git a/docs/src/components/Header/index.tsx b/docs/src/components/Header/index.tsx
index c7d6d30..f553ea4 100644
--- a/docs/src/components/Header/index.tsx
+++ b/docs/src/components/Header/index.tsx
@@ -8,12 +8,12 @@ import { FaCaretDown } from "react-icons/fa";
 
 import { roboto700 } from "@/fonts";
 
-import translation, { getBrowserLang } from "../Internationalization";
+import translation, { Langs, getBrowserLang } from "../Internationalization";
 
 export default function Header() {
 	const [isClient, setIsClient] = useState(false);
 
-	const browserLang = getBrowserLang();
+	const browserLang = getBrowserLang() as unknown as (Langs | undefined)[];
 
 	const t = (text: string) =>
 		translation({ text, subject: "Header", language: browserLang });
diff --git a/docs/src/components/Intercepter/index.tsx b/docs/src/components/Intercepter/index.tsx
deleted file mode 100644
index ab72d00..0000000
--- a/docs/src/components/Intercepter/index.tsx
+++ /dev/null
@@ -1,24 +0,0 @@
-"use client";
-
-import { redirect } from "next/navigation";
-import { useEffect } from "react";
-
-import { getBrowserLang } from "../Internationalization";
-
-export default function Intercepter() {
-	const browserLang = getBrowserLang();
-
-	useEffect(() => {
-		const verify =
-			(browserLang &&
-				(browserLang[0] === "pt" || browserLang[0] === "pt-BR")) ||
-			(browserLang && (browserLang[1] === "pt" || browserLang[1] === "pt-BR"));
-		if (verify) {
-			document.documentElement.lang = "pt";
-
-			redirect("/pt");
-		}
-	}, []);
-
-	return null;
-}
diff --git a/docs/src/components/Interceptor/index.tsx b/docs/src/components/Interceptor/index.tsx
new file mode 100644
index 0000000..93fa75d
--- /dev/null
+++ b/docs/src/components/Interceptor/index.tsx
@@ -0,0 +1,36 @@
+"use client";
+
+import { useRouter } from "next/navigation";
+import { useEffect, useState } from "react";
+
+import { getBrowserLang } from "../Internationalization";
+import MainBg from "../MainBg";
+
+export default function Intercepter() {
+	const [isLoading, setIsLoading] = useState(false);
+	const router = useRouter();
+
+	useEffect(() => {
+		const browserLang = getBrowserLang();
+
+		const verify = (browserLang &&
+			(browserLang[0] === "pt" || browserLang[0] === "pt-BR")) as boolean;
+
+		if (verify) {
+			document.documentElement.lang = "pt";
+			setIsLoading(true);
+			router.push("/pt");
+			setIsLoading(false);
+		}
+	}, []);
+
+	if (isLoading) {
+		return (
+			<MainBg>
+				<></>
+			</MainBg>
+		);
+	}
+
+	return null;
+}
diff --git a/docs/src/components/Internationalization/index.ts b/docs/src/components/Internationalization/index.ts
index c45b511..af5aaad 100644
--- a/docs/src/components/Internationalization/index.ts
+++ b/docs/src/components/Internationalization/index.ts
@@ -1,12 +1,12 @@
 import enJson from "@/locales/en/en.json";
 import ptJson from "@/locales/pt/pt.json";
 
-export type Langs = "en" | "pt" | "";
+export type Langs = "en" | "pt";
 
 interface TranslationProps {
 	text: string;
 	subject?: keyof typeof enJson | "";
-	language?: Langs;
+	language?: (Langs | undefined)[];
 }
 
 interface Locale {
@@ -15,15 +15,15 @@ interface Locale {
 
 function translation({
 	text,
-	language = "",
+	language = [],
 	subject = "",
 }: TranslationProps): string {
 	if (language) {
 		for (const lang of language) {
-			if (lang.includes("pt")) {
+			if (lang?.includes("pt")) {
 				return portugueseTreatment({ text, subject });
 			}
-			if (lang.includes("en")) {
+			if (lang?.includes("en")) {
 				return englishTreatment({ text, subject });
 			}
 		}
diff --git a/docs/src/components/SidebarWrapper/js/index.tsx b/docs/src/components/SidebarWrapper/js/index.tsx
index 62bb026..1d0c563 100644
--- a/docs/src/components/SidebarWrapper/js/index.tsx
+++ b/docs/src/components/SidebarWrapper/js/index.tsx
@@ -5,7 +5,7 @@ import translation, { Langs } from "@/components/Internationalization";
 
 export default function SidebarWrapper({ locale }: { locale?: Langs }) {
 	const t = (text: string) =>
-		translation({ text, subject: "SidebarWrapperJs", language: locale });
+		translation({ text, subject: "SidebarWrapperJs", language: [locale] });
 
 	const route = locale === "pt" ? "/pt/" : "/";