collection search added

src/views/CollectionView/CollectionToolbar.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { ref } from 'vue'
+import { ref, watch } from 'vue'
 import router from '@/router/index.js'
 
 
@@ -12,6 +12,28 @@ const options = [
 const addMerch = () => {
   router.push({ name: 'addMerch' })
 }
+
+const props = defineProps({
+  modelValue: {
+    type: String,
+    default: '',
+  },
+})
+
+const emit = defineEmits(['update:modelValue'])
+
+const localValue = ref(props.modelValue)
+
+watch(
+  () => props.modelValue,
+  (newVal) => {
+    localValue.value = newVal
+  }
+)
+
+watch(localValue, (newVal) => {
+  emit('update:modelValue', newVal)
+})
 </script>
 
 <template>
@@ -19,7 +41,7 @@ const addMerch = () => {
     <n-button type="primary" class="toolbar-item" @click="addMerch"> Add merch </n-button>
 
     <div class="search-wrapper toolbar-item">
-      <n-input placeholder="Search..." clearable />
+      <n-input v-model:value="localValue" placeholder="Search..." clearable />
     </div>
 
     <div class="selector toolbar-item">