arian/navidrome
1
0
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

fix(ui): add button is covered when adding to a playlist (#4156)

Browse Source 
* refactor: fix SelectPlaylistInput layout and improve readability - Replace dropdown with fixed list to prevent button overlay - Break down into smaller focused components - Add comprehensive test coverage - Reduce spacing for compact layout

* refactor: update playlist input translations

Signed-off-by: Deluan <deluan@navidrome.org>

* fix: format code with prettier - Fix formatting issues in AddToPlaylistDialog.test.jsx

---------

Signed-off-by: Deluan <deluan@navidrome.org>
This commit is contained in:
Deluan Quintão
2025-05-30 23:15:02 -04:00
committed by GitHub
parent 7bb1fcdd4b
commit 8e32eeae93
5 changed files with 840 additions and 190 deletions
Download Patch File Download Diff File Expand all files Collapse all files
ui/src/dialogs/AddToPlaylistDialog.test.jsx
+16 -10
View File
@@ -88,12 +88,18 @@ describe('AddToPlaylistDialog', () => {
createTestUtils(mockDataProvider)
// Filter to see sample playlists
let textBox = screen.getByRole('textbox')
fireEvent.change(textBox, { target: { value: 'sample' } })
fireEvent.keyDown(textBox, { key: 'ArrowDown' })
fireEvent.keyDown(textBox, { key: 'Enter' })
fireEvent.keyDown(textBox, { key: 'ArrowDown' })
fireEvent.keyDown(textBox, { key: 'Enter' })
// Click on first playlist
const firstPlaylist = screen.getByText('sample playlist 1')
fireEvent.click(firstPlaylist)
// Click on second playlist
const secondPlaylist = screen.getByText('sample playlist 2')
fireEvent.click(secondPlaylist)
await waitFor(() => {
expect(screen.getByTestId('playlist-add')).not.toBeDisabled()
})
@@ -133,12 +139,11 @@ describe('AddToPlaylistDialog', () => {
createTestUtils(mockDataProvider)
// Type a new playlist name and press Enter to create it
let textBox = screen.getByRole('textbox')
fireEvent.change(textBox, { target: { value: 'sample' } })
fireEvent.keyDown(textBox, { key: 'ArrowDown' })
fireEvent.keyDown(textBox, { key: 'ArrowDown' })
fireEvent.keyDown(textBox, { key: 'ArrowDown' })
fireEvent.keyDown(textBox, { key: 'Enter' })
await waitFor(() => {
expect(screen.getByTestId('playlist-add')).not.toBeDisabled()
})
@@ -171,14 +176,15 @@ describe('AddToPlaylistDialog', () => {
createTestUtils(mockDataProvider)
// Create first playlist
let textBox = screen.getByRole('textbox')
fireEvent.change(textBox, { target: { value: 'sample' } })
fireEvent.keyDown(textBox, { key: 'ArrowDown' })
fireEvent.keyDown(textBox, { key: 'ArrowDown' })
fireEvent.keyDown(textBox, { key: 'ArrowDown' })
fireEvent.keyDown(textBox, { key: 'Enter' })
// Create second playlist
fireEvent.change(textBox, { target: { value: 'new playlist' } })
fireEvent.keyDown(textBox, { key: 'Enter' })
await waitFor(() => {
expect(screen.getByTestId('playlist-add')).not.toBeDisabled()
})