diff --git a/lib/i18n.js b/lib/i18n.js
index 244aae71903..b0ed43514a4 100644
--- a/lib/i18n.js
+++ b/lib/i18n.js
@@ -26,12 +26,44 @@ var config = {
   namespaces: nextI18nextStaticSiteConfig.i18n.namespaces,
   defaultNamespace: nextI18nextStaticSiteConfig.i18n.defaultNamespace
 };
+
+/**
+ * An array containing the supported language codes.
+ * @type {string[]}
+ */
 var languages = config.languages;
+/**
+ * The default language code used for translation when no language is specified or available.
+ * @type {string}
+ */
 var defaultLanguage = config.defaultLanguage;
+/**
+ * An array containing the supported namespaces for translation.
+ * @type {string[]}
+ */
 var namespaces = config.namespaces;
+/**
+ * The default namespace used for translation when no namespace is specified or available.
+ * @type {string}
+ */
 var defaultNamespace = config.defaultNamespace;
+/**
+ * A duplicate of the default namespace used for translation when no namespace is specified or available.
+ * @type {string}
+ */
 var defaultNamespace2 = config.defaultNamespace;
+/**
+ * The name of the cookie used to store the user's preferred language.
+ * @type {string}
+ */
 var cookieName = config.cookieName;
+
+/**
+ * Creates an i18next instance with the provided locales and language.
+ * @param {Object} locales - The locales object containing translations for different languages and namespaces.
+ * @param {string} language - The language code representing the desired language.
+ * @returns {Object} - The initialized i18next instance.
+ */
 var createI18nextInstance = (locales, language) => {
   const plugins = [
     initReactI18next
@@ -56,7 +88,21 @@ var createI18nextInstance = (locales, language) => {
   });
   return i18nInstance;
 };
+
+/**
+ * A global i18next instance used for translation.
+ * @type {?Object}
+ */
 var globalI18nextInstance = null;
+
+
+/**
+ * Returns a singleton instance of the i18next object with the specified language and locales.
+ * If the instance doesn't exist, it creates a new one; otherwise, it changes the language of the existing instance.
+ * @param {string} language - The language code representing the desired language.
+ * @param {Object} locales - The locales object containing translations for different languages and namespaces.
+ * @returns {Object} - The i18next instance.
+ */
 var i18nextInstance = (language, locales) => {
   if (!globalI18nextInstance) {
     globalI18nextInstance = createI18nextInstance(locales, language);
@@ -66,7 +112,19 @@ var i18nextInstance = (language, locales) => {
     return globalI18nextInstance;
   }
 };
+
+/**
+ * A flag indicating whether the locales have been loaded.
+ * @type {boolean}
+ */
 var loaded = false;
+
+
+/**
+ * A React component that provides i18n functionality to the child components.
+ * @param {Object} props - The props object containing the i18n options and child components.
+ * @returns {JSX.Element|null} - The child components wrapped in the i18n provider, or null if hydration is not allowed.
+ */
 var I18nProvider = (props) => {
   var _a;
   const [hydration, setHydration] = useState(false);
@@ -103,14 +161,31 @@ var I18nProvider = (props) => {
   }, [options.allowHydration]);
   return hydration ? props.children : null;
 };
+
+/**
+ * Retrieves all language slugs for use in Next.js dynamic routing.
+ * @returns {Object[]} - An array of objects, each containing the "params" property with the "lang" parameter for each language.
+ */
 function getAllLanguageSlugs() {
   return config.languages.map((lang) => {
     return { params: { lang } };
   });
 }
+
+/**
+ * Retrieves the valid language code based on the provided language.
+ * If the provided language is not valid, returns the default language.
+ * @param {string} lang - The language code to check for validity.
+ * @returns {string} - The valid language code.
+ */
 function getLanguage(lang) {
   return config.languages.includes(lang) ? lang : config.defaultLanguage;
 }
+
+/**
+ * Detects the user's preferred language based on cookies and browser settings.
+ * If a preferred language is found, redirects the user to the corresponding language page.
+ */
 var languageDetection = () => {
   const router = useRouter();
   useEffect(() => {