fix: fix useContext error + update example (#1182)

aralroca · Jan 22, 2024 · d34c1a9 · d34c1a9
1 parent 8c77ecd
commit d34c1a9
Show file tree

Hide file tree

Showing 6 changed files with 46 additions and 25 deletions.
diff --git a/examples/basic/package.json b/examples/basic/package.json
@@ -8,12 +8,12 @@
     "build": "next build"
   },
   "dependencies": {
-    "next": "13.4.7",
+    "next": "14.1.0",
     "next-translate": "link:../../",
     "react": "link:../../node_modules/react",
     "react-dom": "link:../../node_modules/react-dom"
   },
   "devDependencies": {
-    "next-translate-plugin": "2.4.4"
+    "next-translate-plugin": "2.6.2"
   }
 }
diff --git a/examples/complex/package.json b/examples/complex/package.json
@@ -9,20 +9,20 @@
     "analyze": "ANALYZE=true yarn build"
   },
   "dependencies": {
-    "@mdx-js/loader": "2.3.0",
-    "@mdx-js/react": "2.3.0",
-    "@next/mdx": "13.4.7",
-    "next": "13.4.7",
+    "@mdx-js/loader": "3.0.0",
+    "@mdx-js/react": "3.0.0",
+    "@next/mdx": "14.1.0",
+    "next": "14.1.0",
     "next-translate": "link:../../",
     "react": "link:../../node_modules/react",
     "react-dom": "link:../../node_modules/react-dom"
   },
   "devDependencies": {
-    "@next/bundle-analyzer": "13.4.7",
-    "@types/node": "20.3.1",
-    "@types/react": "18.2.13",
-    "next-translate-plugin": "2.4.4",
-    "typescript": "5.1.3"
+    "@next/bundle-analyzer": "14.1.0",
+    "@types/node": "20.11.5",
+    "@types/react": "18.2.48",
+    "next-translate-plugin": "2.6.2",
+    "typescript": "5.3.3"
   },
   "resolutions": {
     "webpack": "5.11.1"

diff --git a/examples/with-app-directory/package.json b/examples/with-app-directory/package.json
@@ -10,20 +10,20 @@
     "analyze": "ANALYZE=true yarn build"
   },
   "dependencies": {
-    "@mdx-js/loader": "2.3.0",
-    "@mdx-js/react": "2.3.0",
-    "@next/mdx": "13.4.7",
-    "next": "13.4.7",
+    "@mdx-js/loader": "3.0.0",
+    "@mdx-js/react": "3.0.0",
+    "@next/mdx": "14.1.0",
+    "next": "14.1.0",
     "next-translate": "link:../../",
     "react": "link:../../node_modules/react",
     "react-dom": "link:../../node_modules/react-dom"
   },
   "devDependencies": {
-    "@next/bundle-analyzer": "13.4.6",
-    "@types/node": "20.3.1",
-    "@types/react": "18.2.12",
-    "next-translate-plugin": "2.4.4",
-    "typescript": "5.1.3"
+    "@next/bundle-analyzer": "14.1.0",
+    "@types/node": "20.11.5",
+    "@types/react": "18.2.48",
+    "next-translate-plugin": "2.6.2",
+    "typescript": "5.3.3"
   },
   "resolutions": {
     "webpack": "5.11.1"

diff --git a/examples/with-app-directory/src/app/layout.tsx b/examples/with-app-directory/src/app/layout.tsx
@@ -0,0 +1,21 @@
+import useTranslation from 'next-translate/useTranslation'
+import i18n from '../../i18n'
+import { redirect } from 'next/navigation'
+
+export default function RootLayout({
+  children,
+}: {
+  children: React.ReactNode
+}) {
+  const { lang } = useTranslation('common')
+
+  // Redirect to default locale if lang is not supported. /second-page -> /en/second-page
+  if (!i18n.locales.includes(lang)) redirect(`/${i18n.defaultLocale}/${lang}`)
+
+  return (
+    <html lang={lang}>
+      <head />
+      <body>{children}</body>
+    </html>
+  )
+}
diff --git a/examples/without-loader/package.json b/examples/without-loader/package.json
@@ -8,12 +8,12 @@
     "build": "next build"
   },
   "dependencies": {
-    "next": "13.4.7",
+    "next": "14.1.0",
     "next-translate": "link:../../",
     "react": "link:../../node_modules/react",
     "react-dom": "link:../../node_modules/react-dom"
   },
   "devDependencies": {
-    "next-translate-plugin": "2.4.0"
+    "next-translate-plugin": "2.6.2"
   }
 }
diff --git a/src/context.tsx b/src/context.tsx
@@ -1,13 +1,13 @@
-import { createContext } from 'react'
 import { I18n } from '.'
+import React from 'react'
 
 let context
 
 // For serverComponents (app-dir), the context cannot be used and
 // this makes that all the imports to here don't break the build.
 // The use of this context is inside each util, depending pages-dir or app-dir.
-if (typeof createContext === 'function') {
-  context = createContext<I18n>({
+if (typeof React.createContext === 'function') {
+  context = React.createContext<I18n>({
     t: (k) => (Array.isArray(k) ? k[0] : k),
     lang: '',
   })