From ef417f3ccf5334b24a6fea8188f9309debd0473c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=B8=89=E5=92=B2=E6=99=BA=E5=AD=90?= <sxzz@sxzz.moe>
Date: Tue, 3 Jan 2023 19:58:08 +0800
Subject: [PATCH] refactor: tidy injections of dropdown

---
 components/common/dropdown/Dropdown.vue     | 5 +++--
 components/common/dropdown/DropdownItem.vue | 4 +---
 components/common/dropdown/ctx.ts           | 5 -----
 composables/injections.ts                   | 6 +++++-
 constants/symbols.ts                        | 6 +++++-
 5 files changed, 14 insertions(+), 12 deletions(-)
 delete mode 100644 components/common/dropdown/ctx.ts

diff --git a/components/common/dropdown/Dropdown.vue b/components/common/dropdown/Dropdown.vue
index 3b122a36..313369bd 100644
--- a/components/common/dropdown/Dropdown.vue
+++ b/components/common/dropdown/Dropdown.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
-import { dropdownContextKey } from './ctx'
+import { InjectionKeyDropdownContext } from '~/constants/symbols'
+
 defineProps<{
   placement?: string
 }>()
@@ -8,7 +9,7 @@ const dropdown = $ref<any>()
 const colorMode = useColorMode()
 
 const hide = () => dropdown.hide()
-provide(dropdownContextKey, {
+provide(InjectionKeyDropdownContext, {
   hide,
 })
 
diff --git a/components/common/dropdown/DropdownItem.vue b/components/common/dropdown/DropdownItem.vue
index 703e59be..c83b10e3 100644
--- a/components/common/dropdown/DropdownItem.vue
+++ b/components/common/dropdown/DropdownItem.vue
@@ -1,6 +1,4 @@
 <script setup lang="ts">
-import { dropdownContextKey } from './ctx'
-
 const props = defineProps<{
   text?: string
   description?: string
@@ -10,7 +8,7 @@ const props = defineProps<{
 }>()
 const emit = defineEmits(['click'])
 
-const { hide } = inject(dropdownContextKey, undefined) || {}
+const { hide } = useDropdownContext() || {}
 
 const el = ref<HTMLDivElement>()
 
diff --git a/components/common/dropdown/ctx.ts b/components/common/dropdown/ctx.ts
deleted file mode 100644
index 0d2ff469..00000000
--- a/components/common/dropdown/ctx.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-import type { InjectionKey } from 'vue'
-
-export const dropdownContextKey: InjectionKey<{
-  hide: () => void
-}> = Symbol('dropdownContextKey')
diff --git a/composables/injections.ts b/composables/injections.ts
index 8e334395..c43e910f 100644
--- a/composables/injections.ts
+++ b/composables/injections.ts
@@ -1,5 +1,9 @@
-import { InjectionKeyFontSize } from '~/constants/symbols'
+import { InjectionKeyDropdownContext, InjectionKeyFontSize } from '~/constants/symbols'
 
 export function useFontSizeRef() {
   return inject(InjectionKeyFontSize)!
 }
+
+export function useDropdownContext() {
+  return inject(InjectionKeyDropdownContext, undefined)
+}
diff --git a/constants/symbols.ts b/constants/symbols.ts
index ea552124..bf8a9291 100644
--- a/constants/symbols.ts
+++ b/constants/symbols.ts
@@ -1,4 +1,8 @@
 import type { InjectionKey, Ref } from 'vue'
 import type { FontSize } from '~/types'
 
-export const InjectionKeyFontSize = Symbol('font-size') as InjectionKey<Ref<FontSize>>
+export const InjectionKeyFontSize: InjectionKey<Ref<FontSize>> = Symbol('font-size')
+
+export const InjectionKeyDropdownContext: InjectionKey<{
+  hide: () => void
+}> = Symbol('dropdown-context')