BANNER.TSX.

BANNER.TSX. A COMPLETE HISTORY.

File: src/app/components/Banner.tsx — Created Sep 4, 2025. 15 commits over 7 months. Currently 49 lines. Banner is globally rendered on every page, sitting fixed below the header. It has served as an iOS announcement, a status panel, briefly a music player, and now a route-aware navigation pill linking to /theunpartyunppp.

Full Commit Timeline

#
1
SHA
dd71a18
Date
2025-09-04 14:31
±
+53
Commit
feat: add Banner component and update UnpppsConfig descriptions

Phase 1. Static Gradient Banner

Commit 1 — Sep 4, 14:31 — Duration: ~2.5 hours — 53 lines

First version. No 'use client' directive — pure static HTML with decorative gradient blobs. Announced the iOS app, included a dismiss X button, no state. CTA was a plain <a> tag.

Phase 2. Yellow Brand / Fixed Position

Commits 2–3 — Sep 4, 17:01–17:25 — Duration: ~7 hours

Complete rewrite ~2.5 hours after creation. Became a 'use client' component with useState. Moved to fixed inset-x-0 top-16, introduced #F9C22E yellow brand color and backdrop-blur-md. Added the Smartphone icon. Button text: "GET INVITED" → "REQUEST INVITE". The two-panel layout (left status / right button) established here persisted for the rest of the component's life.

Phase 3. Badge Status Panel

Commits 4–10 — Sep 5 00:35 → Sep 6 21:24 — Duration: ~4 days (8 commits)

The most active iteration period. Six commits on Sep 5, two on Sep 6. The left panel gained the Badge component with status labels (NEW, BETA, SCORE, PARTY). The right panel stabilized around the yellow pill button reading "unppp for iOS".

Phase 4. MusicBanner (brief)

Commits 11–12 — Sep 10, 20:27–21:47 — MusicBanner rendered for ~80 minutes, dead import for 12 days

Commit 11 was the only bot-authored change to this file (copilot-swe-agent[bot]). It replaced the Badge panel with <MusicBanner />. The component actually rendered in the left slot for approximately 80 minutes before commit 12 removed it from JSX while keeping the import. That dead import persisted until commit 13, twelve days later.

Phase 5. Empty Left + Static Pill

Commit 13 → 14 — Sep 22, 2025 → Jan 20, 2026 — LONGEST STABLE PERIOD: 119 days

“119 days without a single change. Sep 22, 2025 to Jan 20, 2026.”

— git log

MusicBanner removed entirely, left panel empty. The right-side pill read "unppp for iOS". This is the version most users saw for the longest continuous stretch in Banner's history.

Phase 6. Button Text "core"

Commit 14 — Jan 20, 2026 — Duration: 98 days (second longest)

Single-line change inside a broader book-preview fix commit. "unppp for iOS" → "core". Everything else unchanged.

Phase 7. Route-Aware Navigation Link (current)

Commit 15 — Apr 28, 2026 — Present state (+20/−5, largest change since Sep 4 rewrite)

Converted <button> to Next.js <Link>, added usePathname() for active-state detection, renamed label to "APP.". Active path (/theunpartyunppp) fills the button yellow with black text.

tsx
'use client'

import { useState } from 'react'
import { usePathname } from 'next/navigation'
import Link from 'next/link'


export default function Banner() {
  const [isVisible] = useState(true)
  const pathname = usePathname()
  const isActive = pathname === '/theunpartyunppp'

  if (!isVisible) return null

  return (
    <Link
      href="/theunpartyunppp"
      className={`inline-flex items-center rounded-full border border-[#F9C22E] ${
        isActive ? 'bg-[#F9C22E] text-black' : 'hover:bg-[#F9C22E]/5'
      }`}
      style={{ backgroundColor: isActive ? '#F9C22E' : 'transparent' }}
    >
      <span>APP.</span>
    </Link>
  )
}

Placement and Usage

Banner is imported in three files. Only one actually renders it.

File
src/app/layout.tsx
Line
71
Status
Renders globally — fixed header container, after <Header />, z-40, top-16

Stability Analysis

Period
Sep 4, 14:31 → Sep 4, 17:01
Duration
~2.5 hours
State
Static gradient, "SECURE YOUR INVITE"

Button Label Lineage

“SECURE YOUR INVITE" → "GET INVITED" → "REQUEST INVITE" → "unppp for iOS" → "core" → "APP.”

— Banner.tsx, Sep 4 2025 → Apr 28 2026

Authors

Author
unparty
Commits
14 of 15
Notes
All phases except the MusicKit integration

Raw investigation notes: src/app/theunpartybuilder/DOC-banner.md