refactor(components): 重构历史记录组件和 playground 布局- 更新 History 组件样式和动画效果

- 调整 Playground 布局结构
-优化 Sidebar 聊天记录样式

src/components/Option/Playground/Playground.tsx

@@ -1,4 +1,4 @@
-import React from "react"
+import React, { useContext } from "react"
 
 import { Card } from "antd"
 
@@ -23,6 +23,7 @@ import { PlaygroundTeam } from "@/components/Common/Playground/Team.tsx"
 import { PlaygroundTokenStatistics } from "@/components/Common/Playground/TokenStatistics.tsx"
 import { PlaygroundHistory } from "@/components/Common/Playground/History.tsx"
 import { PlaygroundIodRelevant } from "@/components/Common/Playground/IodRelevant.tsx"
+import { HistoryContext } from "@/components/Layouts/Layout.tsx"
 
 
 export const Playground = () => {
@@ -140,13 +141,15 @@ export const Playground = () => {
     setRecentMessagesOnLoad()
   }, [])
 
+  const { show } = useContext(HistoryContext)
+
   return (
     <div
       ref={drop}
       className={`relative flex gap-3 h-full items-center ${
         dropState === "dragging" ? "bg-gray-100 dark:bg-gray-800" : ""
       } bg-white dark:bg-[#171717]`}>
-        <PlaygroundHistory />
+      <PlaygroundHistory />
       <div className="relative h-full flex-1 prose-lg flex justify-center [&>*]:max-w-[848px]">
         <div
           ref={containerRef}
@@ -166,8 +169,10 @@ export const Playground = () => {
           <PlaygroundForm dropedFile={dropedFile} />
         </div>
       </div>
-      {messages.length &&  (
-        <div className="w-1/4 h-full grid grid-rows-[auto_530px_165px] pt-16 pr-5 pb-0 border-l border-gray-200" style={{"paddingTop": "4rem"}}>
+      {messages.length && (
+        <div
+          className="w-1/4 h-full grid grid-rows-[auto_530px_165px] pt-16 pr-5 pb-0 border-l border-gray-200"
+          style={{ paddingTop: "4rem" }}>
           <div className="w-full  overflow-y-auto border-gray-200 border-b p-3">
             <PlaygroundIodRelevant />
           </div>