import { getDictionary } from "@/lib/dictionaries"
import { PortfolioTabs } from "@/components/portfolio-tabs"

export default async function PortfolioPage({
  params,
}: {
  params: Promise<{ lang: "en" | "sq" }>
}) {
  const { lang } = await params
  const dict = await getDictionary(lang)

  return (
    <div className="min-h-screen bg-gray-50 dark:bg-gray-900">
      {/* Hero Section */}
      <section className="bg-gray-50 dark:bg-gray-900 text-gray-900 dark:text-white py-12">
        <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
          <div className="text-center animate-fade-in">
            <h1 className="text-3xl sm:text-4xl font-bold mb-3">{dict.portfolio.hero.title}</h1>
            <p className="text-lg text-gray-600 dark:text-gray-300 max-w-2xl mx-auto">{dict.portfolio.hero.subtitle}</p>
          </div>
        </div>
      </section>

      {/* Portfolio Content */}
      <section className="py-16 bg-gray-50 dark:bg-gray-900">
        <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
          <PortfolioTabs dict={dict} />
        </div>
      </section>
    </div>
  )
}