import Image from "next/image";
import Link from "next/link";
import { MessageCircleHeart } from "lucide-react";
import PizzaPricingPage from "@/modules/pizza-pricing/page";
import { FeedbackHint } from "@/components/feedback-hint";

const devMode = process.env.NEXT_PUBLIC_LEAPTER_DEV_MODE !== "false";

export default function Home() {
  return (
    <div className="flex flex-col h-screen bg-background">
      <header className="shrink-0 border-b border-border/40 bg-background/80 backdrop-blur-lg">
        <div className="container mx-auto flex h-14 items-center justify-between px-6">
          <div className="flex items-center gap-3">
            <Image
              src="/leapter-logo-full.svg"
              alt="Leapter"
              width={902}
              height={259}
              className="h-auto w-[100px]"
              priority
            />
            <span className="text-xs font-medium text-muted-foreground border-l border-border/60 pl-3">
              Starter
            </span>
          </div>
          <nav className="flex items-center gap-3">
            {devMode && (
              <FeedbackHint>
                <Link
                  href="/feedback"
                  className="inline-flex items-center gap-1.5 rounded-full border border-accent/40 bg-accent/10 px-3 py-1.5 text-xs font-medium text-accent transition-colors hover:bg-accent/20"
                >
                  <MessageCircleHeart className="h-3.5 w-3.5" />
                  Share feedback
                </Link>
              </FeedbackHint>
            )}
            <a
              href="https://leapter.com"
              target="_blank"
              rel="noopener noreferrer"
              className="text-xs text-muted-foreground hover:text-foreground transition-colors"
            >
              leapter.com
            </a>
            <a
              href="https://github.com/leapter/leapter-inspectable-logic-demo"
              target="_blank"
              rel="noopener noreferrer"
              className="inline-flex items-center gap-1.5 rounded-full border border-border px-3 py-1.5 text-xs font-medium text-foreground hover:bg-muted transition-colors"
            >
              <svg
                viewBox="0 0 16 16"
                fill="currentColor"
                className="h-3.5 w-3.5"
              >
                <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z" />
              </svg>
              GitHub
            </a>
          </nav>
        </div>
      </header>
      <main className="flex-1 min-h-0 flex flex-col">
        <PizzaPricingPage />
      </main>
    </div>
  );
}
