From 9fd0bf46d6d9e9f59a0fe94019ed7a710ff93021 Mon Sep 17 00:00:00 2001 From: XShine555 Date: Sun, 20 Sep 2026 23:05:53 +0200 Subject: [PATCH] =?UTF-8?q?web-player:=20P6=20=E2=80=94=20men=C3=BA=20cont?= =?UTF-8?q?extual=20=C3=BAnico=20(ContextMenu)=20+=20AccountMenu?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Crea src/lib/components/ui/ContextMenu.svelte, que sustituye TrackContextMenu y AlbumContextMenu (109 y 119 líneas, 90% idénticas): misma función de posicionamiento (contextMenuPosition, exportada del módulo, usando MENU_WIDTH/SUBMENU_WIDTH movidas a config.ts), mismo backdrop, mismo Escape, mismo submenú "Añadir a playlist" genérico vía {items, playlistAction, playlists}. Usa MenuItem para las acciones (antes reimplementaban sus clases a mano) y Artwork size="xs" para las miniaturas de playlist. menus.svelte.ts (createTrackMenu) se adapta a la nueva contextMenuPosition; se migran Inicio, Explorar (menú de pista y de álbum) y Mezcla. AccountMenu: panelClass (clases Tailwind libres) pasa a prop width: 'sm'|'md'; añade cierre con Escape (mejora de accesibilidad, antes no cerraba); TopBar y MobileHeader dejan de envolverlo en un div.relative duplicado (su propio root ya lo es). z-index del panel pasa a z-(--z-menu), al mismo nivel que ContextMenu (antes z-20 en TopBar / sin z explícito en MobileHeader). Verificado con npm run check/build; sin QA visual autenticada (Docker no disponible en esta sesión). --- web-player/docs/frontend-refactor-plan.md | 2 +- .../lib/components/AlbumContextMenu.svelte | 118 ------------------ .../src/lib/components/MobileHeader.svelte | 52 ++++---- web-player/src/lib/components/TopBar.svelte | 8 +- .../src/lib/components/ui/AccountMenu.svelte | 20 +-- .../ContextMenu.svelte} | 66 +++++----- .../src/lib/components/ui/MenuItem.svelte | 4 +- web-player/src/lib/config.ts | 2 + web-player/src/lib/menus.svelte.ts | 11 +- .../src/routes/(app)/explore/+page.svelte | 48 ++++--- .../src/routes/(app)/mixes/[id]/+page.svelte | 20 ++- web-player/src/routes/+page.svelte | 20 ++- 12 files changed, 144 insertions(+), 227 deletions(-) delete mode 100644 web-player/src/lib/components/AlbumContextMenu.svelte rename web-player/src/lib/components/{TrackContextMenu.svelte => ui/ContextMenu.svelte} (51%) diff --git a/web-player/docs/frontend-refactor-plan.md b/web-player/docs/frontend-refactor-plan.md index 1943501..0b52aab 100644 --- a/web-player/docs/frontend-refactor-plan.md +++ b/web-player/docs/frontend-refactor-plan.md @@ -778,7 +778,7 @@ Tareas: | P3 | ✅ | (pendiente) | Se quitó el nombre bajo el avatar de perfil (decisión tomada: redundante con el título de CollectionHeader). Se añadió `size="fill"` a Artwork (no está en la spec) para las tarjetas de grid fluidas (AlbumCard/PlaylistCard/MixTile), ya que P9 (MediaCard) aún no existe. SearchResultRow perdió su prop `kind`/radio-por-tipo (ahora el radio lo decide Artwork/Avatar). Sin QA visual autenticada (Docker no disponible) | | P4 | ✅ | (pendiente) | Decisión tomada sin bloquear: se elimina el botón "adelante" decorativo (TopBar) y el icono `AlignJustify` decorativo (PlayerExtras) por ser código muerto visual. `TransportControls` (shuffle/prev/next/repeat) se deja sin migrar a IconButton a propósito: son iconos sin chrome (sin fondo/hit-box), migrarlos habría añadido una píldora de hover no presente hoy — riesgo visual no verificable sin Docker | | P5 | 🟡 | (pendiente) | Hecho: pressable/clickOutside, toggle.svelte.ts, plural() (+minúsculas, Δ visible), helpers de player.svelte.ts (toQueueItem/isQueueCurrent/playAllOrToggle/playShuffled, addToQueue→playNextItem), navigation.svelte.ts (searchHref/appNavLinks — appNavLinks creado pero su migración a Sidebar/TabsBar se deja para P12 tal como indica esa parte), menus.svelte.ts (createTrackMenu, migrado en Inicio/Explorar/Mezcla). **Pendiente a propósito**: la tarea 5 (eliminar el envoltorio `TrackTarget` de tracks.ts y sus 8 accesores) se difiere — es el cambio de mayor riesgo del plan (toca tipos en Inicio/Explorar/Mezcla/menús de forma transversal) y no se pudo verificar visualmente sin Docker; abordarlo junto con P13 cuando se reescriban esas páginas | -| P6 | ⬜ | | | +| P6 | ✅ | (pendiente) | z-index de AccountMenu unificado a z-(--z-menu) (antes z-20, ahora al mismo nivel que ContextMenu — Δ menor, mejora consistencia); sin QA visual autenticada (Docker no disponible) | | P7 | ⬜ | | | | P8 | ⬜ | | | | P9 | ⬜ | | | diff --git a/web-player/src/lib/components/AlbumContextMenu.svelte b/web-player/src/lib/components/AlbumContextMenu.svelte deleted file mode 100644 index d0a8bd1..0000000 --- a/web-player/src/lib/components/AlbumContextMenu.svelte +++ /dev/null @@ -1,118 +0,0 @@ - - - - - - - - - - - {#if playlists.length > 0} -
-
- Añadir álbum a una playlist - -
- -
- {:else} -

Todavía no tienes playlists.

- {/if} - diff --git a/web-player/src/lib/components/MobileHeader.svelte b/web-player/src/lib/components/MobileHeader.svelte index d232195..d6757bd 100644 --- a/web-player/src/lib/components/MobileHeader.svelte +++ b/web-player/src/lib/components/MobileHeader.svelte @@ -27,33 +27,27 @@ Musify -
- {#if user} - - {#snippet trigger({ toggle, open })} - - {/snippet} - {#snippet extraItems({ close })} - - - {/snippet} - - {:else} - - - - {/if} -
+ {#if user} + + {#snippet trigger({ toggle, open })} + + {/snippet} + {#snippet extraItems({ close })} + + + {/snippet} + + {:else} + + + + {/if} diff --git a/web-player/src/lib/components/TopBar.svelte b/web-player/src/lib/components/TopBar.svelte index fcc7777..cc1cffc 100644 --- a/web-player/src/lib/components/TopBar.svelte +++ b/web-player/src/lib/components/TopBar.svelte @@ -93,13 +93,9 @@
-
+
{#if user} - + {#snippet trigger({ toggle, open })}