import * as React from "react"
import { cn } from "@/lib/utils"
import Link from "next/link"

interface HeaderProps {
  className?: string
}

export function Header({ className }: HeaderProps) {
  return (
    <header
      className={cn(
        "flex items-center justify-between p-4 border-b border-border",
        className
      )}
    >
      <div className="flex items-center gap-4">
        <img
          src="/logo.svg"
          alt="Logo"
          className="h-8 w-8"
        />
        <nav className="flex items-center gap-6">
          <Link
            href="/login"
            className="text-sm font-medium text-foreground hover:underline"
          >
            Login
          </Link>
          <Link
            href="/pricing"
            className="text-sm font-medium text-foreground hover:underline"
          >
            Pricing
          </Link>
          <Link
            href="/about"
            className="text-sm font-medium text-foreground hover:underline"
          >
            About
          </Link>
        </nav>
      </div>
    </header>
  )
}