import Negotiator from 'negotiator'
import { type NextRequest, NextResponse } from 'next/server'

const locales = ['en-US', 'pt-PT'] as const

type Locale = (typeof locales)[number]

function getLocale(request: NextRequest): Locale {
  const headers = {
    'accept-language': request.headers.get('accept-language') || ''
  }
  const languages = new Negotiator({ headers }).languages()
  const defaultLocale: Locale = 'pt-PT'

  const matchedLocale = languages.find((lang) =>
    locales.includes(lang as Locale)
  )

  return (matchedLocale as Locale) || defaultLocale
}

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

  const pathnameHasLocale = locales.some(
    (locale) => pathname.startsWith(`/${locale}/`) || pathname === `/${locale}`
  )

  if (pathnameHasLocale) {
    return
  }

  const locale = getLocale(request)
  const newPathname = `/${locale}${pathname}`
  const url = new URL(newPathname, request.url)

  return NextResponse.redirect(url)
}

export const config = {
  matcher: ['/((?!_next|api).*)']
}

import { getDictionary } from '@/app/[lang]/dictionaries'

export default async function NotFound({
  params
}: {
  params: { lang: 'en-US' | 'pt-PT' }
}) {
  const { lang } = params
  const dict = await getDictionary(lang)

  return (
    <div className="flex flex-1 items-center justify-center">
      <span className="text-3xl">{dict.errors[404].message}</span>
    </div>
  )
}