حفظ اختيار لغة المستخدم

// i18n.config.ts

export const locales = ['en', 'es', 'fr'];
export const defaultLocale = 'en';
export const localeCookieName = 'NEXT_LOCALE';

npm install accept-language-parser

// middleware.ts
import { NextResponse } from 'next/server';
import type { NextRequest } from 'next/server';
import parser from 'accept-language-parser';
import {
  locales,
  defaultLocale,
  localeCookieName,
} from './i18n.config';

function getPreferredLocale(request: NextRequest) {
  // 1. التحقق من ملف تعريف الارتباط
  const cookie = request.cookies.get(localeCookieName);
  if (cookie) {
    const locale = cookie.value;
    if (locales.includes(locale)) {
      return locale;
    }
  }

  // 2. التحقق من رأس Accept-Language
  const acceptLang = request.headers.get('Accept-Language');
  if (acceptLang) {
    const bestMatch = parser.pick(locales, acceptLang, {
      loose: true,
    });
    if (bestMatch) {
      return bestMatch;
    }
  }

  // 3. إرجاع اللغة الافتراضية
  return defaultLocale;
}

export function middleware(request: NextRequest) {
  const { pathname } = request.nextUrl;

  // 1. التحقق مما إذا كان الطلب للمسار الجذر
  if (pathname === '/') {
    // الحصول على اللغة المفضلة للمستخدم (من ملف تعريف الارتباط أو الرأس)
    const bestLocale = getPreferredLocale(request);

    // إعادة التوجيه إلى مسار اللغة الأفضل تطابقًا
    request.nextUrl.pathname = `/${bestLocale}`;
    return NextResponse.redirect(request.nextUrl);
  }

  // 2. بالنسبة لجميع المسارات الأخرى، استمر كالمعتاد
  return NextResponse.next();
}

export const config = {
  matcher: [
    // نريد تشغيل هذا على المسار الجذر فقط في الوقت الحالي
    '/',
    // نحتاج أيضًا إلى مطابقة المسارات غير الجذرية للسماح لها بالمرور
    '/((?!api|_next/static|_next/image|favicon.ico).*)',
  ],
};