From 3624c152f55c0b342066282dd1eaa16f942c38c8 Mon Sep 17 00:00:00 2001
From: Marcin Macierzanka <mmacierzanka@grzana.dev>
Date: Fri, 21 Aug 2026 16:59:11 +0200
Subject: [PATCH] fix: sync volume after external changes

---
 frontend/src/components/PlayerPanel.vue | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/frontend/src/components/PlayerPanel.vue b/frontend/src/components/PlayerPanel.vue
index f63cb5f..910668f 100644
--- a/frontend/src/components/PlayerPanel.vue
+++ b/frontend/src/components/PlayerPanel.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { computed, ref, toRef } from 'vue'
+import { computed, ref, toRef, watch } from 'vue'
 import {
   ExternalLink,
   Music4,
@@ -32,6 +32,13 @@ const loopMode = computed(() => loopModeOf(props.status))
 const draggedVolume = ref<number | null>(null)
 const volume = computed(() => draggedVolume.value ?? props.status?.volume ?? 100)
 
+watch(
+  () => props.status?.volume,
+  (next, previous) => {
+    if (next !== undefined && next !== previous) draggedVolume.value = null
+  },
+)
+
 const volumeIcon = computed(() => {
   if (volume.value === 0) return VolumeX
   if (volume.value < 35) return Volume