diff --git a/src/app/content/components/DanmakuMessage.tsx b/src/app/content/components/DanmakuMessage.tsx
index 6b0a623..dde5bad 100644
--- a/src/app/content/components/DanmakuMessage.tsx
+++ b/src/app/content/components/DanmakuMessage.tsx
@@ -1,9 +1,5 @@
 import { Avatar, AvatarFallback } from '@/components/ui/Avatar'
 import { Button } from '@/components/ui/Button'
-import { APP_STATUS_STORAGE_KEY } from '@/constants/config'
-import { EVENT } from '@/constants/event'
-import { AppStatus } from '@/domain/AppStatus'
-import { LocalStorageImpl } from '@/domain/impls/Storage'
 import { TextMessage } from '@/domain/Room'
 import { cn } from '@/utils'
 import { AvatarImage } from '@radix-ui/react-avatar'
@@ -12,22 +8,17 @@ import { FC, MouseEvent } from 'react'
 export interface PromptItemProps {
   data: TextMessage
   className?: string
+  onClick?: (e: MouseEvent<HTMLButtonElement>) => void
   onMouseEnter?: (e: MouseEvent<HTMLButtonElement>) => void
   onMouseLeave?: (e: MouseEvent<HTMLButtonElement>) => void
 }
 
-const DanmakuMessage: FC<PromptItemProps> = ({ data, className, onMouseEnter, onMouseLeave }) => {
-  const handleOpenApp = async () => {
-    const appStatus = await LocalStorageImpl.value.get<AppStatus>(APP_STATUS_STORAGE_KEY)
-    LocalStorageImpl.value.set<AppStatus>(APP_STATUS_STORAGE_KEY, { ...appStatus!, open: true, unread: 0 })
-    dispatchEvent(new CustomEvent(EVENT.APP_OPEN))
-  }
-
+const DanmakuMessage: FC<PromptItemProps> = ({ data, className, onClick, onMouseEnter, onMouseLeave }) => {
   return (
     <Button
       onMouseEnter={onMouseEnter}
       onMouseLeave={onMouseLeave}
-      onClick={handleOpenApp}
+      onClick={onClick}
       className={cn(
         'flex justify-center pointer-events-auto visible gap-x-2 border px-2.5 py-0.5  rounded-full bg-primary/30 text-base font-medium text-white backdrop-blur-md',
         className
diff --git a/src/domain/impls/Danmaku.ts b/src/domain/impls/Danmaku.ts
index 2cfe3a4..300dba2 100644
--- a/src/domain/impls/Danmaku.ts
+++ b/src/domain/impls/Danmaku.ts
@@ -5,6 +5,10 @@ import { createElement } from 'react'
 import DanmakuMessage from '@/app/content/components/DanmakuMessage'
 import { createRoot } from 'react-dom/client'
 import { create, Manager } from 'danmu'
+import { LocalStorageImpl } from './Storage'
+import { AppStatus } from '../AppStatus'
+import { APP_STATUS_STORAGE_KEY } from '@/constants/config'
+import { EVENT } from '@/constants/event'
 
 export class Danmaku {
   private container?: Element
@@ -18,6 +22,11 @@ export class Danmaku {
           createRoot(manager.node).render(
             createElement(DanmakuMessage, {
               data: manager.data,
+              onClick: async () => {
+                const appStatus = await LocalStorageImpl.value.get<AppStatus>(APP_STATUS_STORAGE_KEY)
+                LocalStorageImpl.value.set<AppStatus>(APP_STATUS_STORAGE_KEY, { ...appStatus!, open: true, unread: 0 })
+                dispatchEvent(new CustomEvent(EVENT.APP_OPEN))
+              },
               onMouseEnter: () => manager.pause(),
               onMouseLeave: () => manager.resume()
             })