feat(components): 新增图标组件并优化历史记录功能

- 新增 Bell、Collect 和 NotCollect 图标组件
- 优化 History 组件，添加隐藏 logo 功能
- 调整 Message 组件样式，移除不必要的代码
- 更新 Scene 组件 Header 颜色
- 注释掉 tailwind.css 中的 arimo 字体权重

src/components/Option/Playground/PlaygroundIod.tsx

@@ -1,4 +1,4 @@
-import React, { createContext, useContext, useState } from "react"
+import React, { createContext, useContext, useMemo, useState } from "react"
 
 import { AnimatePresence, motion } from "framer-motion"
 
@@ -8,6 +8,8 @@ import { PlaygroundScene } from "@/components/Common/Playground/Scene.tsx"
 import { PlaygroundTeam } from "@/components/Common/Playground/Team.tsx"
 import { Card } from "antd"
 import { CloseOutlined } from "@ant-design/icons"
+import { useMessageOption } from "@/hooks/useMessageOption.tsx"
+import { Message } from "@/types/message.ts"
 
 // 定义 Context 类型
 interface IodPlaygroundContextType {
@@ -17,6 +19,7 @@ interface IodPlaygroundContextType {
   setDetailHeader: React.Dispatch<React.SetStateAction<React.ReactNode>>
   detailMain: React.ReactNode
   setDetailMain: React.Dispatch<React.SetStateAction<React.ReactNode>>
+  currentMessage: Message | null
 }
 
 // 创建 Context
@@ -36,13 +39,41 @@ export const useIodPlaygroundContext = () => {
 }
 
 export const PlaygroundIod = () => {
+  const { messages, iodLoading, currentMessageId, iodSearch } =
+    useMessageOption()
+
   const [showPlayground, setShowPlayground] = useState<boolean>(true)
   const [detailHeader, setDetailHeader] = useState(<></>)
   const [detailMain, setDetailMain] = useState(<></>)
 
+  const currentMessage = useMemo<Message | null>(() => {
+    if (iodLoading) {
+      return null
+    }
+
+    if (messages.length && iodSearch) {
+      // 如果不存在currentMessageId默认返回最后一个message
+      if (!currentMessageId) {
+        return messages.at(-1)
+      }
+
+      const currentMessage = messages?.find(
+        (message) => message.id === currentMessageId
+      )
+      if (currentMessage) {
+        return currentMessage
+      }
+      // 如果当前message不存在最后一个message
+      return messages.at(-1)
+    }
+
+    return null
+  }, [currentMessageId, messages, iodLoading, iodSearch])
+
   return (
     <PlaygroundContext.Provider
       value={{
+        currentMessage,
         showPlayground,
         setShowPlayground,
         detailMain,
@@ -65,7 +96,6 @@ const PlaygroundContent = () => {
   const { showPlayground, detailMain, detailHeader, setShowPlayground } =
     useIodPlaygroundContext()
 
-
   return (
     <AnimatePresence mode="popLayout">
       {showPlayground ? (
@@ -80,7 +110,9 @@ const PlaygroundContent = () => {
           }}
           className="h-full grid grid-rows-12 gap-3">
           <div className="w-full row-span-5">
-            <PlaygroundIodRelevant className={classNames.replace('!bg-[rgba(240,245,255,0.3)]', '')} />
+            <PlaygroundIodRelevant
+              className={classNames.replace("!bg-[rgba(240,245,255,0.3)]", "")}
+            />
           </div>
           <div className="w-full row-span-4 grid grid-cols-2 gap-3 custom-scrollbar">
             <PlaygroundData className={classNames} />