diff --git a/src/components/common/EmojiPicker.tsx b/src/components/common/EmojiPicker.tsx
index 9975f708..9f94ce24 100644
--- a/src/components/common/EmojiPicker.tsx
+++ b/src/components/common/EmojiPicker.tsx
@@ -1,12 +1,12 @@
 import { useEffect, useRef } from "react"
 import { useTranslation } from "react-i18next"
-import { useMediaStore } from "~/hooks/useDarkMode"
+import { useIsDark } from "~/hooks/useDarkMode"
 
 export const EmojiPicker: React.FC<{
   onEmojiSelect: (e: any) => void
 }> = ({ onEmojiSelect }) => {
   const ref = useRef<any>()
-  const isDark = useMediaStore((state) => state.isDark)
+  const isDark = useIsDark()
 
   useEffect(() => {
     import("emoji-mart").then(async (EmojiMart) => {