feat(frontend): implement All Bands view as default when no vertical selected

frontend/app/page.tsx

@@ -56,7 +56,7 @@ export default async function HomePage() {
             <Link href="/onboarding">Get Started</Link>
           </Button>
           <Button asChild variant="outline" size="lg">
-            <Link href="/billy-strings">Explore Shows</Link>
+            <Link href="/shows">Explore Shows</Link>
           </Button>
         </div>
       </section>

frontend/components/layout/band-selector.tsx

@@ -43,16 +43,26 @@ export function BandSelector() {
                             variant="ghost"
                             className="flex items-center gap-2 font-bold text-lg"
                         >
-                            <span>{current.name}</span>
+                            <span>{current ? current.name : "All Bands"}</span>
                             <ChevronDown className="h-4 w-4 opacity-50" />
                         </Button>
                     </DropdownMenuTrigger>
                     <DropdownMenuContent align="start" className="w-56">
+                        <DropdownMenuItem
+                            onClick={() => {
+                                setCurrent(null)
+                                router.push("/")
+                                setSheetOpen(false)
+                            }}
+                            className={`cursor-pointer ${current === null ? "font-bold" : ""}`}
+                        >
+                            All Bands
+                        </DropdownMenuItem>
                         {VERTICALS.map((vertical) => (
                             <DropdownMenuItem
                                 key={vertical.slug}
                                 onClick={() => handleSelect(vertical.slug)}
-                                className={`cursor-pointer ${vertical.slug === current.slug ? "font-bold" : ""}`}
+                                className={`cursor-pointer ${current?.slug === vertical.slug ? "font-bold" : ""}`}
                             >
                                 {vertical.name}
                             </DropdownMenuItem>
@@ -70,7 +80,7 @@ export function BandSelector() {
                             size="lg"
                             className="flex items-center gap-2 font-bold text-lg px-3"
                         >
-                            <span>{current.name}</span>
+                            <span>{current ? current.name : "All Bands"}</span>
                             <ChevronDown className="h-4 w-4 opacity-50" />
                         </Button>
                     </SheetTrigger>
@@ -82,10 +92,22 @@ export function BandSelector() {
                             </SheetTitle>
                         </SheetHeader>
                         <div className="grid gap-2 py-4">
+                            <Button
+                                variant={current === null ? "default" : "outline"}
+                                size="lg"
+                                className="w-full justify-start text-lg h-14"
+                                onClick={() => {
+                                    setCurrent(null)
+                                    router.push("/")
+                                    setSheetOpen(false)
+                                }}
+                            >
+                                All Bands
+                            </Button>
                             {VERTICALS.map((vertical) => (
                                 <Button
                                     key={vertical.slug}
-                                    variant={vertical.slug === current.slug ? "default" : "outline"}
+                                    variant={current?.slug === vertical.slug ? "default" : "outline"}
                                     size="lg"
                                     className="w-full justify-start text-lg h-14"
                                     onClick={() => handleSelect(vertical.slug)}

frontend/components/layout/navbar.tsx

@@ -32,7 +32,7 @@ export function Navbar() {
     const [mobileMenuOpen, setMobileMenuOpen] = useState(false)
 
     // Build vertical-aware links
-    const getVerticalLink = (path: string) => `/${current.slug}${path}`
+    const getVerticalLink = (path: string) => current ? `/${current.slug}${path}` : path
 
     return (
         <header className="sticky top-0 z-50 w-full border-b bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60">

frontend/contexts/vertical-context.tsx

@@ -5,8 +5,8 @@ import { usePathname } from "next/navigation"
 import { VERTICALS, Vertical, VerticalSlug } from "@/config/verticals"
 
 interface VerticalContextType {
-    current: Vertical
+    current: Vertical | null
-    setCurrent: (slug: VerticalSlug) => void
+    setCurrent: (slug: VerticalSlug | null) => void
     all: readonly Vertical[]
 }
 
@@ -16,21 +16,29 @@ export function VerticalProvider({ children }: { children: ReactNode }) {
     const pathname = usePathname()
 
     // Detect vertical from URL path
-    const getVerticalFromPath = (): Vertical => {
+    const getVerticalFromPath = (): Vertical | null => {
         const segments = pathname.split("/").filter(Boolean)
         const firstSegment = segments[0]
         const found = VERTICALS.find(v => v.slug === firstSegment)
-        return found || VERTICALS[0] // Default to Goose
+        return found || null
     }
 
-    const [current, setCurrentState] = useState<Vertical>(getVerticalFromPath)
+    const [current, setCurrentState] = useState<Vertical | null>(getVerticalFromPath)
 
     // Update current when path changes
     useEffect(() => {
         setCurrentState(getVerticalFromPath())
     }, [pathname])
 
-    const setCurrent = (slug: VerticalSlug) => {
+    const setCurrent = (slug: VerticalSlug | null) => {
+        if (slug === null) {
+            setCurrentState(null)
+            if (typeof window !== "undefined") {
+                localStorage.removeItem("preferred-vertical")
+            }
+            return
+        }
+
         const found = VERTICALS.find(v => v.slug === slug)
         if (found) {
             setCurrentState(found)
@@ -81,6 +89,12 @@ export function useVerticalPath() {
         if (VERTICALS.some(v => v.slug === segments[0])) {
             return path
         }
+
+        // If no vertical selected, return path as-is
+        if (!current) {
+            return path.startsWith("/") ? path : `/${path}`
+        }
+
         // Prepend current vertical
         return `/${current.slug}${path.startsWith("/") ? path : `/${path}`}`
     }