update Next.js 15.1, React 19 stable, stop to use __filename

package.json

@@ -4,7 +4,7 @@
   "author": "ELSOUL LABO B.V.",
   "license": "Apache-2.0",
   "scripts": {
-    "dev": "npx next dev -p 4242",
+    "dev": "npx next dev -p 4242 --turbopack",
     "build": "npx next build",
     "postbuild": "npx next-sitemap",
     "lint": "npx next lint",
@@ -33,11 +33,11 @@
     "jotai": "2.10.1",
     "lodash.throttle": "4.1.1",
     "mdast-util-to-string": "4.0.0",
-    "next": "15.0.3",
+    "next": "15.1.3",
     "next-intl": "3.25.0",
     "next-themes": "0.3.0",
-    "react": "19.0.0-rc-66855b96-20241106",
-    "react-dom": "19.0.0-rc-66855b96-20241106",
+    "react": "19.0.0",
+    "react-dom": "19.0.0",
     "react-markdown": "9.0.1",
     "react-syntax-highlighter": "15.6.1",
     "remark": "15.0.1",
@@ -50,13 +50,13 @@
     "@tailwindcss/typography": "0.5.14",
     "@types/lodash.throttle": "4.1.9",
     "@types/node": "20.13.0",
-    "@types/react": "npm:types-react@19.0.0-rc.1",
-    "@types/react-dom": "npm:types-react-dom@19.0.0-rc.1",
+    "@types/react": "19.0.2",
+    "@types/react-dom": "19.0.2",
     "@types/react-syntax-highlighter": "15.5.13",
     "autoprefixer": "10.4.19",
-    "babel-plugin-react-compiler": "19.0.0-beta-63b359f-20241101",
+    "babel-plugin-react-compiler": "19.0.0-beta-b2e8e9c-20241220",
     "eslint": "9.14.0",
-    "eslint-config-next": "15.0.3",
+    "eslint-config-next": "15.1.3",
     "eslint-config-prettier": "9.1.0",
     "glob": "10.4.3",
     "gray-matter": "4.0.3",
@@ -71,9 +71,5 @@
     "typescript": "5.6.3",
     "unified": "11.0.5",
     "wrangler": "3.86.0"
-  },
-  "peerDependencies": {
-    "react": "^16.8 || ^17.0 || ^18.0 || ^19.0",
-    "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0"
   }
 }

src/app/[locale]/(default)/(home)/page.tsx

@@ -1,12 +1,13 @@
 import { setRequestLocale } from 'next-intl/server'
-import { getDataForPageByFilename, PageProps } from '@/lib/pages'
+import { getDataForPageByGroupDir, PageProps } from '@/lib/pages'
 import { getArticleForIndex } from '@/lib/articles'
 import ArticleIndex from '@/components/articles/ArticleIndex'
 import HomeHeroRow from './HomeHeroRow'
 import CTARow from '@/components/rows/CTARow'
 import ProductsSlideRow from '@/components/rows/ProductsSlideRow'
 
-const { generateMetadata } = getDataForPageByFilename(__filename)
+const groupDir = '(home)'
+const { generateMetadata } = getDataForPageByGroupDir(groupDir)
 export { generateMetadata }
 
 export default async function HomePage({ params }: PageProps) {

src/app/[locale]/(default)/doc/[...slug]/page.tsx

@@ -1,9 +1,9 @@
 import { setRequestLocale } from 'next-intl/server'
 import {
   ArticlePageProps,
-  getDataForArticlePageByFilename,
   getArticleBySlug,
-  getAllRoutes
+  getAllRoutes,
+  getDataForArticlePageByGroupDir
 } from '@/lib/articles'
 import ScrollSyncToc from '@/components/articles/ScrollSyncToc'
 import { cn } from '@/lib/utils'
@@ -13,8 +13,9 @@ import { docMenuData } from '../docNavs'
 import { getPagerData } from '@/lib/getPagerData'
 import ArticlePager from '@/components/articles/ArticlePager'
 
-const { groupDir, generateMetadata, generateStaticParams } =
-  getDataForArticlePageByFilename(__filename)
+const groupDir = 'doc'
+const { generateMetadata, generateStaticParams } =
+  getDataForArticlePageByGroupDir(groupDir)
 export { generateMetadata, generateStaticParams }
 
 export default async function DocArticlePage({ params }: ArticlePageProps) {

src/app/[locale]/(default)/legal/[...slug]/page.tsx

@@ -1,15 +1,16 @@
 import { setRequestLocale } from 'next-intl/server'
 import {
   ArticlePageProps,
-  getDataForArticlePageByFilename,
-  getArticleBySlug
+  getArticleBySlug,
+  getDataForArticlePageByGroupDir
 } from '@/lib/articles'
 import ScrollSyncToc from '@/components/articles/ScrollSyncToc'
 import ArticleContents from '@/components/articles/ArticleContents'
 import { cn } from '@/lib/utils'
 
-const { groupDir, generateMetadata, generateStaticParams } =
-  getDataForArticlePageByFilename(__filename)
+const groupDir = 'legal'
+const { generateMetadata, generateStaticParams } =
+  getDataForArticlePageByGroupDir(groupDir)
 export { generateMetadata, generateStaticParams }
 
 export default async function LegalArticlePage({ params }: ArticlePageProps) {

src/app/[locale]/(default)/news/[...slug]/page.tsx

@@ -1,9 +1,9 @@
 import { setRequestLocale } from 'next-intl/server'
 import {
   ArticlePageProps,
-  getDataForArticlePageByFilename,
   getArticleBySlug,
-  getArticleForIndex
+  getArticleForIndex,
+  getDataForArticlePageByGroupDir
 } from '@/lib/articles'
 import NewsMobileHeader from '../NewsMobileHeader'
 import ScrollSyncToc from '@/components/articles/ScrollSyncToc'
@@ -15,8 +15,9 @@ import ArticleIndex from '@/components/articles/ArticleIndex'
 import { getPagerData } from '@/lib/getPagerData'
 import ArticlePager from '@/components/articles/ArticlePager'
 
-const { groupDir, generateMetadata, generateStaticParams, getArticlePaths } =
-  getDataForArticlePageByFilename(__filename)
+const groupDir = 'news'
+const { generateMetadata, generateStaticParams, getArticlePaths } =
+  getDataForArticlePageByGroupDir(groupDir)
 export { generateMetadata, generateStaticParams }
 
 export default async function NewsArticlePage({ params }: ArticlePageProps) {

src/app/[locale]/(default)/news/page.tsx

@@ -1,10 +1,11 @@
 import { setRequestLocale } from 'next-intl/server'
-import { getDataForPageByFilename, PageProps } from '@/lib/pages'
+import { getDataForPageByGroupDir, PageProps } from '@/lib/pages'
 
 import { getArticleForIndex } from '@/lib/articles'
 import ArticleIndex from '@/components/articles/ArticleIndex'
 
-const { groupDir, generateMetadata } = getDataForPageByFilename(__filename)
+const groupDir = 'news'
+const { generateMetadata } = getDataForPageByGroupDir(groupDir)
 export { generateMetadata }
 
 export default async function NewsPage({ params }: PageProps) {

src/components/articles/ArticleContents.tsx

@@ -65,13 +65,15 @@ export default function ArticleContents({ content }: Props) {
             const videoId = getYouTubeVideoId(href)
             if (isYouTube && videoId) {
               return (
-                <AspectRatio ratio={16 / 9}>
-                  <iframe
-                    src={`https://www.youtube.com/embed/${videoId}`}
-                    allowFullScreen
-                    className="h-full w-full rounded-xl object-cover"
-                  />
-                </AspectRatio>
+                <>
+                  <AspectRatio ratio={16 / 9}>
+                    <iframe
+                      src={`https://www.youtube.com/embed/${videoId}`}
+                      allowFullScreen
+                      className="h-full w-full rounded-xl object-cover"
+                    />
+                  </AspectRatio>
+                </>
               )
             }
 

src/lib/articles.ts

@@ -2,7 +2,7 @@ import fs from 'fs'
 import { glob } from 'glob'
 import { join } from 'path'
 import matter from 'gray-matter'
-import { getGroupDir, uniqueArray, truncateContent } from './utils'
+import { uniqueArray, truncateContent } from './utils'
 import { locales } from '@/app/config'
 
 type Items = {
@@ -68,10 +68,8 @@ export type ArticlePageProps = {
   }>
 }
 
-export const getDataForArticlePageByFilename = (filename: string) => {
-  const groupDir = getGroupDir(filename)
+export const getDataForArticlePageByGroupDir = (groupDir: string) => {
   return {
-    groupDir,
     generateMetadata: async ({ params }: ArticlePageProps) => {
       const { locale, slug } = await params
 

src/lib/pages.ts

@@ -1,4 +1,3 @@
-import { getGroupDir } from './utils'
 import { getTranslations } from 'next-intl/server'
 
 export type PageProps = {
@@ -7,10 +6,8 @@ export type PageProps = {
   }>
 }
 
-export const getDataForPageByFilename = (filename: string) => {
-  const groupDir = getGroupDir(filename)
+export const getDataForPageByGroupDir = (groupDir: string) => {
   return {
-    groupDir,
     generateMetadata: async ({ params }: PageProps) => {
       const { locale } = await params
       const t = await getTranslations({ locale, namespace: groupDir })

src/lib/utils.ts

@@ -11,29 +11,15 @@ export const blurDataURL =
 export const sleep = (ms: number) =>
   new Promise((resolve) => setTimeout(resolve, ms))
 
-export const getGroupDir = (fileName: string) => {
-  const parts = fileName.split('/')
-  const lastPart = parts[parts.length - 1]
-  if (lastPart.includes('.')) {
-    parts.pop()
-  }
-  let groupDir = parts.pop() ?? '(default)'
-
-  if (groupDir.startsWith('[') && groupDir.endsWith(']')) {
-    groupDir = parts.pop() ?? '(default)'
-  }
-  return groupDir
-}
-
 export const uniqueArray = <T>(arr: T[]): T[] => {
   return Array.from(new Set(arr.map((item) => JSON.stringify(item)))).map(
-    (item) => JSON.parse(item) as T,
+    (item) => JSON.parse(item) as T
   )
 }
 
 export function truncateContent(
   content: string | string[],
-  maxLength: number,
+  maxLength: number
 ): string {
   let text = ''