- Prevent scroll bug on search term, bump version to 0.2.5

- Getting rid of UNSAFE_ stuff
- Minor style fixes

README.md

@@ -32,7 +32,7 @@ Find the latest .AppImage on the [release page](https://github.com/pascalopitz/u
 You can right click it on Ubuntu, then under "Permissions" mark is as executable. ALternatively run:
 
 ```bash
-chmod +x sonos-controller-unofficial-amd64-0.2.4.AppImage
+chmod +x sonos-controller-unofficial-amd64-0.2.5.AppImage
 ```
 
 After that it can be launched by double click or via invoking it through the terminal.
@@ -48,7 +48,7 @@ Type=Application
 Categories=Audio;
 Name=sonos-controller-unofficial
 Icon=appimagekit-sonos-controller-unofficial
-Exec="/home/username/Downloads/sonos-controller-unofficial-0.2.4.AppImage" %U
+Exec="/home/username/Downloads/sonos-controller-unofficial-0.2.5.AppImage" %U
 ```
 
 ## Install via .deb file
@@ -57,7 +57,7 @@ Find the latest .deb on the [release page](https://github.com/pascalopitz/unoffi
 On Ubuntu, you can double click the downloaded file to install it via the Software Center. Alternatively run
 
 ```bash
-sudo dpkg -i sonos-controller-unofficial-amd64-0.2.4.AppImage
+sudo dpkg -i sonos-controller-unofficial-amd64-0.2.5.AppImage
 ```
 
 ##  and Run locally

app/css/main.css

@@ -204,7 +204,7 @@ h4 {
 #search input {
     width: 100px;
     height: 16px;
-    padding: 2px 8px;
+    padding: 2px 28px 2px 8px;
     border: none;
     border-radius: 8px;
 }
@@ -574,6 +574,8 @@ input[type="range"]:focus {
 #player-volumes > div {
     padding: 10px;
     border-top: 1px solid #333;
+    display: flex;
+    flex-wrap: wrap;
 }
 
 #player-volumes > div:first-child {
@@ -587,14 +589,11 @@ input[type="range"]:focus {
     text-shadow: none;
     margin-bottom: 5px;
     font-size: 12px;
+    width: 100%;
 }
 
 #player-volumes .mute-button {
     margin-right: 10px;
-}
-
-#player-volumes .volume-bar,
-#player-volumes .mute-button {
     display: inline-block;
     vertical-align: middle;
 }

app/package.json

@@ -1,7 +1,7 @@
 {
   "name": "sonos-controller-unofficial",
   "description": "Unoffical sonos controller for linux.",
-  "version": "0.2.4",
+  "version": "0.2.5",
   "author": "Pascal Opitz <contact@pascalopitz.com>",
   "main": "main.js",
   "dependencies": {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "sonos-controller-unofficial",
-  "version": "0.2.4",
+  "version": "0.2.5",
   "description": "Unoffical sonos controller for linux",
   "main": "app/main.js",
   "homepage": "http://pascalopitz.github.io/unoffical-sonos-controller-for-linux/",

snap/snapcraft.yaml

@@ -1,6 +1,6 @@
 name: sonos-controller-unofficial # you probably want to 'snapcraft register <name>'
 base: core18 # the base snap is the execution environment for this snap
-version: '0.2.4' # just for humans, typically '1.2+git' or '1.3.2'
+version: '0.2.5' # just for humans, typically '1.2+git' or '1.3.2'
 summary: Unofficial Sonos Controller for Linux # 79 char long summary
 description: |
   An Electron based app to control Sonos systems on Linux desktops.

src/ui/components/AlbumArt.jsx

@@ -42,6 +42,14 @@ export const AlbumArt = (props) => {
     const [loaded, setLoaded] = useState(false);
     const [loading, setLoading] = useState(false);
 
+    const catchError = useCallback(() => {
+        if (targetRef.current) {
+            setFailed(true);
+            setLoaded(false);
+            setLoading(false);
+        }
+    }, [targetRef]);
+
     const loadError = useCallback(() => {
         if (!visible) {
             return;
@@ -85,9 +93,7 @@ export const AlbumArt = (props) => {
                     setSrc(newSrc);
                 }
             } catch (e) {
-                setFailed(true);
-                setLoaded(false);
-                setLoading(false);
+                catchError();
             }
         })();
     }, [