diff --git a/lib/components/search/SearchFilter.vue b/lib/components/search/SearchFilter.vue
index 6f39c81cb..ac4a7643e 100644
--- a/lib/components/search/SearchFilter.vue
+++ b/lib/components/search/SearchFilter.vue
@@ -16,7 +16,7 @@
 </template>
 
 <script setup>
-import { ref, defineProps, defineEmits, watchEffect } from 'vue'
+import { defineProps, defineEmits, computed } from 'vue'
 import { Checkbox } from '@'
 
 const props = defineProps({
@@ -40,13 +40,9 @@ const props = defineProps({
   },
 })
 
-const isActive = ref(props.activeFilters.value.includes(props.facetName))
+const isActive = computed(() => props.activeFilters.includes(props.facetName))
 const emit = defineEmits(['toggle'])
 
-watchEffect(() => {
-  isActive.value = props.activeFilters.value.includes(props.facetName)
-})
-
 const toggle = () => {
   emit('toggle', props.facetName)
 }