1 files changed, 12 insertions, 10 deletions

diff --git a/src/App.vue b/src/App.vue
index 664867f..4120fe5 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -49,10 +49,10 @@
         <SearchInput
           class="navbar-item is-inline-block-mobile"
           :hotkey="searchHotkey()"
-          @input="filterServices"
+          @input="filterServices($event.target?.value)"
           @search-focus="showMenu = true"
-          @search-open="navigateToFirstService"
-          @search-cancel="filterServices"
+          @search-open="navigateToFirstService($event?.target?.value)"
+          @search-cancel="filterServices()"
         />
       </Navbar>
     </div>
@@ -140,8 +140,8 @@
 </template>
 
 <script>
-const jsyaml = require("js-yaml");
-const merge = require("lodash.merge");
+import jsyaml from "js-yaml";
+import merge from "lodash.merge";
 
 import Navbar from "./components/Navbar.vue";
 import GetStarted from "./components/GetStarted.vue";
@@ -153,7 +153,7 @@ import SettingToggle from "./components/SettingToggle.vue";
 import DarkMode from "./components/DarkMode.vue";
 import DynamicTheme from "./components/DynamicTheme.vue";
 
-import defaultConfig from "./assets/defaults.yml";
+import defaultConfig from "./assets/defaults.yml?raw";
 
 export default {
   name: "App",
@@ -255,11 +255,12 @@ export default {
       });
     },
     matchesFilter: function (item) {
+      const needle = this.filter?.toLowerCase();
       return (
-        item.name.toLowerCase().includes(this.filter) ||
-        (item.subtitle && item.subtitle.toLowerCase().includes(this.filter)) ||
-        (item.tag && item.tag.toLowerCase().includes(this.filter)) ||
-        (item.keywords && item.keywords.toLowerCase().includes(this.filter))
+        item.name.toLowerCase().includes(needle) ||
+        (item.subtitle && item.subtitle.toLowerCase().includes(needle)) ||
+        (item.tag && item.tag.toLowerCase().includes(needle)) ||
+        (item.keywords && item.keywords.toLowerCase().includes(needle))
       );
     },
     navigateToFirstService: function (target) {
@@ -271,6 +272,7 @@ export default {
       }
     },
     filterServices: function (filter) {
+      console.log(filter);
       this.filter = filter;
 
       if (!filter) {