Add Bandcamp search and Listening Room page
Implement Bandcamp search service with autocomplete API and HTML scraping fallback. Add /api/bandcamp/search and /api/bandcamp/embed endpoints. Create Listening Room page with search, embedded player, and queue management. Add navigation entry and Bandcamp link on recommendation cards.
This commit is contained in:
@@ -1,12 +1,13 @@
|
||||
import { useState } from 'react'
|
||||
import { Link, useLocation, useNavigate } from 'react-router-dom'
|
||||
import { Disc3, LayoutDashboard, ListMusic, Compass, Heart, Crown, Menu, X, LogOut, User } from 'lucide-react'
|
||||
import { Disc3, LayoutDashboard, ListMusic, Compass, Heart, Crown, Headphones, Menu, X, LogOut, User } from 'lucide-react'
|
||||
import { useAuth } from '../lib/auth'
|
||||
|
||||
const navItems = [
|
||||
{ path: '/dashboard', label: 'Dashboard', icon: LayoutDashboard },
|
||||
{ path: '/playlists', label: 'Playlists', icon: ListMusic },
|
||||
{ path: '/discover', label: 'Discover', icon: Compass },
|
||||
{ path: '/listen', label: 'Listen', icon: Headphones },
|
||||
{ path: '/saved', label: 'Saved', icon: Heart },
|
||||
{ path: '/billing', label: 'Pro', icon: Crown },
|
||||
]
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
import { Heart, ExternalLink, Music } from 'lucide-react'
|
||||
import { Heart, ExternalLink, Music, Headphones } from 'lucide-react'
|
||||
import { Link } from 'react-router-dom'
|
||||
import type { RecommendationItem } from '../lib/api'
|
||||
|
||||
interface Props {
|
||||
@@ -71,6 +72,14 @@ export default function RecommendationCard({ recommendation, onToggleSave, savin
|
||||
<ExternalLink className="w-4 h-4" />
|
||||
</a>
|
||||
)}
|
||||
|
||||
<Link
|
||||
to={`/listen?q=${encodeURIComponent(`${recommendation.artist} ${recommendation.title}`)}`}
|
||||
className="p-2 rounded-full bg-purple-50 text-purple-400 hover:bg-purple-100 hover:text-purple transition-colors"
|
||||
title="Find on Bandcamp"
|
||||
>
|
||||
<Headphones className="w-4 h-4" />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user