From e9b35cf51f55806963c34d697e707aed791430dd Mon Sep 17 00:00:00 2001
From: "Mr.Hope" <mister-hope@outlook.com>
Date: Mon, 27 Feb 2023 20:16:49 +0800
Subject: [PATCH] refactor(plugin-docsearch): introduce vueuse package (#1271)

---
 ecosystem/plugin-docsearch/package.json              |  1 +
 .../client/composables/useDocsearchHotkeyListener.ts | 10 ++++------
 pnpm-lock.yaml                                       | 12 +++++++++++-
 3 files changed, 16 insertions(+), 7 deletions(-)

diff --git a/ecosystem/plugin-docsearch/package.json b/ecosystem/plugin-docsearch/package.json
index c1c13f62ae..1e9dfe70f6 100644
--- a/ecosystem/plugin-docsearch/package.json
+++ b/ecosystem/plugin-docsearch/package.json
@@ -44,6 +44,7 @@
     "@vuepress/core": "workspace:*",
     "@vuepress/shared": "workspace:*",
     "@vuepress/utils": "workspace:*",
+    "@vueuse/core": "^9.13.0",
     "ts-debounce": "^4.0.0",
     "vue": "^3.2.47",
     "vue-router": "^4.1.6"
diff --git a/ecosystem/plugin-docsearch/src/client/composables/useDocsearchHotkeyListener.ts b/ecosystem/plugin-docsearch/src/client/composables/useDocsearchHotkeyListener.ts
index dcc1cfad52..e31f8cce49 100644
--- a/ecosystem/plugin-docsearch/src/client/composables/useDocsearchHotkeyListener.ts
+++ b/ecosystem/plugin-docsearch/src/client/composables/useDocsearchHotkeyListener.ts
@@ -1,16 +1,14 @@
-import { onMounted, onUnmounted } from 'vue'
+import { useEventListener } from '@vueuse/core'
 
 /**
  * Add hotkey listener, remove it after triggered
  */
 export const useDocsearchHotkeyListener = (callback: () => void): void => {
-  const hotkeyListener = (event: KeyboardEvent): void => {
+  const remove = useEventListener('keydown', (event) => {
     if (event.key === 'k' && (event.ctrlKey || event.metaKey)) {
       event.preventDefault()
-      window.removeEventListener('keydown', hotkeyListener)
       callback()
+      remove()
     }
-  }
-  onMounted(() => window.addEventListener('keydown', hotkeyListener))
-  onUnmounted(() => window.removeEventListener('keydown', hotkeyListener))
+  })
 }
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index ed8be93996..16fc9aa5b3 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -139,6 +139,7 @@ importers:
       '@vuepress/core': workspace:*
       '@vuepress/shared': workspace:*
       '@vuepress/utils': workspace:*
+      '@vueuse/core': ^9.13.0
       ts-debounce: ^4.0.0
       vue: ^3.2.47
       vue-router: ^4.1.6
@@ -150,6 +151,7 @@ importers:
       '@vuepress/core': link:../../packages/core
       '@vuepress/shared': link:../../packages/shared
       '@vuepress/utils': link:../../packages/utils
+      '@vueuse/core': 9.13.0_vue@3.2.47
       ts-debounce: 4.0.0
       vue: 3.2.47
       vue-router: 4.1.6_vue@3.2.47
@@ -7550,7 +7552,7 @@ packages:
     dependencies:
       hosted-git-info: 4.1.0
       is-core-module: 2.10.0
-      semver: 7.3.8
+      semver: 7.3.7
       validate-npm-package-license: 3.0.4
     dev: true
 
@@ -8569,6 +8571,14 @@ packages:
     hasBin: true
     dev: false
 
+  /semver/7.3.7:
+    resolution: {integrity: sha512-QlYTucUYOews+WeEujDoEGziz4K6c47V/Bd+LjSSYcA94p+DmINdf7ncaUinThfvZyu13lN9OY1XDxt8C0Tw0g==}
+    engines: {node: '>=10'}
+    hasBin: true
+    dependencies:
+      lru-cache: 6.0.0
+    dev: true
+
   /semver/7.3.8:
     resolution: {integrity: sha512-NB1ctGL5rlHrPJtFDVIVzTyQylMLu9N9VICA6HSFJo8MCGVTMW6gfpicwKmmK/dAjTOrqu5l63JJOpDSrAis3A==}
     engines: {node: '>=10'}