- Replace Vite + React Router with Next.js 15 App Router - Implement i18n with next-intl (URL-based: /de, /en, /sr) - Add SSR/SSG for all pages (48 static pages generated) - Setup Supabase SSR client for auth - Migrate all pages: Home, About, Portfolio, Blog, Contact, Login, Dashboard, Imprint, Privacy, Terms - Add Docker support with standalone output - Replace i18next with next-intl JSON translations - Use next/image for optimized images Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
33 lines
874 B
TypeScript
33 lines
874 B
TypeScript
// components/NavLink.tsx
|
|
import { Link, useLocation } from 'react-router-dom'
|
|
import React from 'react'
|
|
|
|
interface NavLinkProps {
|
|
to: string
|
|
icon: React.ReactNode
|
|
label: string
|
|
onClick?: () => void
|
|
className?: string
|
|
}
|
|
|
|
export function NavLink({ to, icon, label, onClick, className }: NavLinkProps) {
|
|
const location = useLocation()
|
|
const isActive = location.pathname === to
|
|
|
|
return (
|
|
<Link
|
|
to={to}
|
|
onClick={onClick}
|
|
className={`
|
|
relative flex items-center gap-2 rounded-full py-2 px-4
|
|
transition-all duration-200 ease-in-out
|
|
${isActive ? 'text-white bg-zinc-700/60' : 'text-zinc-400 hover:text-white hover:bg-zinc-800/30'}
|
|
${className}
|
|
`}
|
|
>
|
|
{icon}
|
|
<span className="text-sm tracking-wide">{label}</span>
|
|
</Link>
|
|
)
|
|
}
|