fix(filters): change code structure and data flow in filter type 1

src/components/Button.vue

@@ -6,10 +6,6 @@ const props = defineProps({
     type: String as () => 'button' | 'submit' | 'reset',
     default: 'button'
   },
-  onClick: {
-    type: Function as unknown as () => (payload: MouseEvent) => void,
-    default: () => {}
-  },
   label: {
     type: String,
     default: ''
@@ -47,12 +43,14 @@ const buttonStyle = computed(() => {
       return 'bg-none text-primary-500 border border-transparent hover:border-primary-500 rounded-lg disabled:border-primary-300 disabled:text-primary-300'
   }
 })
+
+const emit = defineEmits(['on:click'])
 </script>
 
 <template>
   <button
     :type="type"
-    @click="onClick"
+    @click="emit('on:click')"
     :disabled="isLoading ? true : disabled"
     :class="['px-3 py-2 text-sm font-semibold', buttonStyle, className]"
   >