fix(front): watch channel widget data, so the user doesnt need to refresh by hand

front/src/components/audio/ChannelsWidget.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import type { BackendError, BackendResponse, Channel } from '~/types'
 
-import { ref, reactive } from 'vue'
+import { ref, onMounted, watch, reactive } from 'vue'
 import { clone } from 'lodash-es'
 import { useI18n } from 'vue-i18n'
 
@@ -35,6 +35,7 @@ const nextPage = ref()
 const count = ref(0)
 
 const isLoading = ref(false)
+
 const fetchData = async (url = 'channels/') => {
   isLoading.value = true
 
@@ -57,7 +58,13 @@ const fetchData = async (url = 'channels/') => {
   isLoading.value = false
 }
 
-fetchData()
+onMounted(() => {
+  fetchData()
+})
+
+watch(() => props.filters, () => {
+  fetchData()
+}, { deep: true })
 </script>
 
 <template>