Simplify VFilterTab by using $tc filter

Author: AetherUnbound

frontend/src/components/VHeader/VHeaderMobile/VFilterTab.vue

@@ -1,18 +1,19 @@
 <template>
-  <VTab id="filters" size="medium" class="gap-x-2" :aria-label="ariaLabel">
+  <VTab
+    id="filters"
+    size="medium"
+    class="gap-x-2"
+    :aria-label="$tc('header.filterButton.withCount', appliedFilterCount)"
+  >
     <VFilterIconOrCounter :applied-filter-count="appliedFilterCount" />
     <h2 class="label-regular">{{ $t("filters.title") }}</h2>
   </VTab>
 </template>
 <script lang="ts">
-import { computed, defineComponent } from "vue"
-
-import { useI18n } from "~/composables/use-i18n"
-
 import VFilterIconOrCounter from "~/components/VHeader/VFilterIconOrCounter.vue"
 import VTab from "~/components/VTabs/VTab.vue"
 
-export default defineComponent({
+export default {
   name: "VFilterTab",
   components: { VFilterIconOrCounter, VTab },
   props: {
@@ -21,12 +22,5 @@ export default defineComponent({
       default: 0,
     },
   },
-  setup(props) {
-    const i18n = useI18n()
-    const ariaLabel = computed(() =>
-      i18n.tc("header.filterButton.withCount", props.appliedFilterCount)
-    )
-    return { ariaLabel }
-  },
-})
+}
 </script>