From b47d1a3df361bbd4536dd3a3be5373ddc5d779f8 Mon Sep 17 00:00:00 2001
From: Adam French <adam.a.french@outlook.com>
Date: Tue, 10 Mar 2026 22:40:15 +0000
Subject: [PATCH] Fix checkStream function and useTemplateRef instead of
 implicit

---
 nginx/vue/src/components/util/Radio.vue | 18 ++++++++++--------
 1 file changed, 10 insertions(+), 8 deletions(-)

diff --git a/nginx/vue/src/components/util/Radio.vue b/nginx/vue/src/components/util/Radio.vue
index 6ccedef..8fa0d95 100644
--- a/nginx/vue/src/components/util/Radio.vue
+++ b/nginx/vue/src/components/util/Radio.vue
@@ -17,22 +17,24 @@
 <script setup>
 import Button from "@/components/input/Button.vue";
 import Header from "@/components/text/Header.vue";
-import { ref, onMounted } from "vue";
+import { ref, useTemplateRef, onMounted, nextTick } from "vue";
 import axios from "axios";
 
 const streamUrl = ref("");
 const streamLive = ref(false);
-const audio = ref(null);
+const audio = useTemplateRef("audio");
 
 async function checkStream() {
     try {
         await axios.head("/radio/stream");
-        streamLive.value = true;
-        streamUrl.value = "/radio/stream";
-
-        if (audio.value) {
-            audio.value.load();
-            audio.value.volume = 0.2;
+        if (!streamLive.value) {
+            streamLive.value = true;
+            streamUrl.value = "/radio/stream";
+            await nextTick();
+            if (audio.value) {
+                audio.value.load();
+                audio.value.volume = 0.2;
+            }
         }
     } catch (err) {
         streamLive.value = false;