From 600b267ce48803437e863a7a3d686483e6ba271b Mon Sep 17 00:00:00 2001
From: geoffrey45 <geoffreymungai45@gmail.com>
Date: Thu, 16 Jun 2022 09:50:07 +0300
Subject: [PATCH] drop in onStartTyping to focus on search bar automatically

---
 src/App.vue                                 | 5 +++++
 src/components/RightSideBar/SearchInput.vue | 3 ++-
 2 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/App.vue b/src/App.vue
index 91ccae81..97012b67 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -36,6 +36,7 @@ import useQStore from "@/stores/queue";
 import useShortcuts from "@/composables/useKeyboard";
 import Logo from "@/components/Logo.vue";
 import { useRouter } from "vue-router";
+import { onStartTyping } from "@vueuse/core";
 
 const context_store = useContextStore();
 const queue = useQStore();
@@ -53,6 +54,10 @@ app_dom.addEventListener("click", (e) => {
 useRouter().afterEach(() => {
   document.getElementById("acontent")?.scrollTo(0, 0);
 });
+
+onStartTyping(() => {
+  document.getElementById("globalsearch").focus();
+});
 </script>
 
 <style lang="scss">
diff --git a/src/components/RightSideBar/SearchInput.vue b/src/components/RightSideBar/SearchInput.vue
index 0a5ccf29..002d3511 100644
--- a/src/components/RightSideBar/SearchInput.vue
+++ b/src/components/RightSideBar/SearchInput.vue
@@ -3,7 +3,7 @@
     <div id="ginner" tabindex="0">
       <div class="icon image"></div>
       <input
-        id="search"
+        id="globalsearch"
         class="rounded"
         v-model="search.query"
         placeholder="Search your library"
@@ -16,6 +16,7 @@
 </template>
 
 <script setup lang="ts">
+import { ref } from "vue";
 import useSearchStore from "../../stores/search";
 
 const search = useSearchStore();