[Bugfix] Webapp allows to assign single song to card (MiczFlor#2143)

* [Bugfix][Dockerfile] Mount jukebox code as volume to support restart without build

* Fix typo

* [get_song_by_url] Search for relative paths in MPD database only

docker/docker-compose.yml

@@ -40,6 +40,7 @@ services:
     restart: unless-stopped
     tty: true
     volumes:
+      - ../src/jukebox:/root/RPi-Jukebox-RFID/src/jukebox
       - ../shared:/root/RPi-Jukebox-RFID/shared
       - ./config/docker.pulse.mpd.conf:/root/.config/mpd/mpd.conf
     command: python run_jukebox.py

src/jukebox/components/playermpd/__init__.py

@@ -80,6 +80,7 @@
 # Toggle (und 2nd Swipe generell) ist immer vom Status des Zielsystems abhängig und kann damit nur vom Zielsystem geändert
 # werden. Bei Wifi also braucht man 3 Funktionen: on / off / toggle. Toggle ist dann first swipe / second swipe
 
+import os
 import mpd
 import threading
 import logging
@@ -574,6 +575,11 @@ def list_song_by_artist_and_album(self, albumartist, album):
 
     @plugs.tag
     def get_song_by_url(self, song_url):
+        # MPD can play absolute paths but can find songs in its database only by relative path
+        # In certain situations, `song_url` can be an absolute path. Then, it will be trimed to be relative
+        _music_library_path_absolute = os.path.expanduser(components.player.get_music_library_path())
+        song_url = song_url.replace(f'{_music_library_path_absolute}/', '')
+
         with self.mpd_lock:
             song = self.mpd_retry_with_mutex(self.mpd_client.find, 'file', song_url)
 

src/webapp/src/components/Library/lists/index.js

@@ -28,7 +28,7 @@ const LibraryLists = () => {
   const [cardId] = useState(searchParams.get('cardId'));
   const [musicFilter, setMusicFilter] = useState('');
 
-  const handleMusicFilder = (event) => {
+  const handleMusicFolder = (event) => {
     setMusicFilter(event.target.value);
   };
 
@@ -49,7 +49,7 @@ const LibraryLists = () => {
       {isSelecting && <SelectorHeader />}
       <Grid container sx={{ padding: '10px' }}>
         <LibraryHeader
-          handleMusicFilder={handleMusicFilder}
+          handleMusicFolder={handleMusicFolder}
           musicFilter={musicFilter}
         />
         <Grid