fix: playlist menus and link previews (#509)

- fix stopPropagation blocking link clicks in AddToMenu and TrackActionsMenu
- add /playlist/ to hasPageMetadata so layout default OG tags don't override
- replace LikeButton with AddToMenu on track detail page for playlist access

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-authored-by: Claude <[e-mail]>

frontend/src/lib/components/AddToMenu.svelte

···
 
 	{#if menuOpen}
 		<!-- svelte-ignore a11y_click_events_have_key_events a11y_no_static_element_interactions -->
-		<div class="menu-dropdown" role="menu" tabindex="-1" onclick={(e) => e.stopPropagation()}>
+		<div class="menu-dropdown" role="menu" tabindex="-1" onclick={(e) => {
+			// don't stop propagation for links - let SvelteKit handle navigation
+			if (e.target instanceof HTMLAnchorElement || (e.target as HTMLElement).closest('a')) {
+				return;
+			}
+			e.stopPropagation();
+		}}>
 			{#if !showPlaylistPicker}
 				<button class="menu-item" onclick={handleLike} disabled={loading}>
 					<svg width="18" height="18" viewBox="0 0 24 24" fill={liked ? 'currentColor' : 'none'} stroke="currentColor" stroke-width="2">

frontend/src/lib/components/TrackActionsMenu.svelte

···
 		<!-- svelte-ignore a11y_click_events_have_key_events a11y_no_static_element_interactions -->
 		<div class="menu-backdrop" role="presentation" onclick={closeMenu}></div>
 		<!-- svelte-ignore a11y_click_events_have_key_events a11y_no_static_element_interactions -->
-		<div class="menu-panel" role="menu" tabindex="-1" onclick={(e) => e.stopPropagation()}>
+		<div class="menu-panel" role="menu" tabindex="-1" onclick={(e) => {
+			// don't stop propagation for links - let SvelteKit handle navigation
+			if (e.target instanceof HTMLAnchorElement || (e.target as HTMLElement).closest('a')) {
+				return;
+			}
+			e.stopPropagation();
+		}}>
 			{#if !showPlaylistPicker}
 				{#if isAuthenticated}
 					<button class="menu-item" onclick={handleLike} disabled={loading || likeDisabled} class:disabled={likeDisabled}>

frontend/src/routes/+layout.svelte

···
 	let hasPageMetadata = $derived(
 		$page.url.pathname === '/' || // homepage
 		$page.url.pathname.startsWith('/track/') || // track detail
+		$page.url.pathname.startsWith('/playlist/') || // playlist detail
 		$page.url.pathname === '/liked' || // liked tracks
 		$page.url.pathname.match(/^\/u\/[^/]+$/) || // artist detail
 		$page.url.pathname.match(/^\/u\/[^/]+\/album\/[^/]+/) // album detail

frontend/src/routes/track/[id]/+page.svelte

···
 	import { APP_NAME, APP_CANONICAL_URL } from '$lib/branding';
 	import { API_URL } from '$lib/config';
 	import Header from '$lib/components/Header.svelte';
-	import LikeButton from '$lib/components/LikeButton.svelte';
+	import AddToMenu from '$lib/components/AddToMenu.svelte';
 	import ShareButton from '$lib/components/ShareButton.svelte';
 	import TagEffects from '$lib/components/TagEffects.svelte';
 	import SensitiveImage from '$lib/components/SensitiveImage.svelte';
···
 			<div class="track-info-wrapper">
 				<div class="side-button-left">
 					{#if auth.isAuthenticated}
-						<LikeButton trackId={track.id} trackTitle={track.title} initialLiked={track.is_liked || false} />
+						<AddToMenu
+							trackId={track.id}
+							trackTitle={track.title}
+							trackUri={track.atproto_record_uri}
+							trackCid={track.atproto_record_cid}
+							initialLiked={track.is_liked || false}
+						/>
 					{/if}
 				</div>
 
···
 
 					<div class="mobile-side-buttons">
 						{#if auth.isAuthenticated}
-							<LikeButton trackId={track.id} trackTitle={track.title} initialLiked={track.is_liked || false} />
+							<AddToMenu
+								trackId={track.id}
+								trackTitle={track.title}
+								trackUri={track.atproto_record_uri}
+								trackCid={track.atproto_record_cid}
+								initialLiked={track.is_liked || false}
+							/>
 						{/if}
 						<ShareButton url={shareUrl} title="share track" />
 					</div>