refactor(layout): 重构布局组件并添加新功能

- 更新 Header 组件，增加项目标题和历史记录切换按钮
- 新增 DataNavigation 组件用于数据导航
- 添加 Playground 相关新组件，包括数据、场景、团队等信息展示
- 重构 Layout 组件，使用 Context 管理历史记录状态
- 更新 zh/option.json 文件，添加新的项目标题和对话相关翻译

src/hooks/useMessageOption.tsx

@@ -60,6 +60,7 @@ export const useMessageOption = () => {
     setHistory,
     meteringEntries,
     setMeteringEntries,
+    setCurrentMeteringEntry,
     setStreaming,
     streaming,
     setIsFirstMessage,
@@ -200,6 +201,11 @@ export const useMessageOption = () => {
       date: new Date().getTime()
     } as MeteringEntry
 
+    setCurrentMeteringEntry({
+      loading: true,
+      data: meter
+    })
+
     if (!isRegenerate) {
       newMessage = [
         ...messages,
@@ -500,7 +506,7 @@ export const useMessageOption = () => {
 
       // Save metering entry
       const { cot, content } = responseResolver(fullText)
-      const _meteringEntries = [{
+      const currentMeteringEntry = {
         ...meter,
         modelInputTokenCount: prompt.length,
         modelOutputTokenCount: fullText.length,
@@ -511,9 +517,15 @@ export const useMessageOption = () => {
         cot,
         responseContent: content,
         modelResponseContent: fullText,
-      },
+      }
+      const _meteringEntries = [
+        currentMeteringEntry,
         ...meteringEntries,
       ]
+      setCurrentMeteringEntry({
+        loading: false,
+        data: currentMeteringEntry,
+      })
       setMeteringEntries(_meteringEntries)
       localStorage.setItem("meteringEntries", JSON.stringify(_meteringEntries))
     } catch (e) {
@@ -633,6 +645,16 @@ export const useMessageOption = () => {
 
     let newMessage: Message[] = []
     let generateMessageId = generateID()
+    const meter: MeteringEntry = {
+      id: generateMessageId,
+      queryContent: message,
+      date: new Date().getTime()
+    } as MeteringEntry
+
+    setCurrentMeteringEntry({
+      loading: true,
+      data: meter,
+    })
 
     if (!isRegenerate) {
       newMessage = [
@@ -759,6 +781,7 @@ export const useMessageOption = () => {
       let reasoningStartTime: Date | null = null
       let reasoningEndTime: Date | null = null
       let apiReasoning: boolean = false
+      const chatStartTime = new Date()
 
       for await (const chunk of chunks) {
         if (chunk?.additional_kwargs?.reasoning_content) {
@@ -859,6 +882,31 @@ export const useMessageOption = () => {
       setStreaming(false)
       setIsProcessing(false)
       setStreaming(false)
+
+
+      // Save metering entry
+      const { cot, content } = responseResolver(fullText)
+      const currentMeteringEntry = {
+        ...meter,
+        modelInputTokenCount: prompt.length,
+        modelOutputTokenCount: fullText.length,
+        model: ollama.modelName ?? ollama.model,
+        relatedDataCount:  0,
+        timeTaken: new Date().getTime() - chatStartTime.getTime(),
+        date: chatStartTime.getTime(),
+        cot,
+        responseContent: content,
+        modelResponseContent: fullText,
+      }
+      const _meteringEntries = [
+        currentMeteringEntry,
+        ...meteringEntries,
+      ]
+      setCurrentMeteringEntry({
+        loading: false,
+        data: currentMeteringEntry,
+      })
+      setMeteringEntries(_meteringEntries)
     } catch (e) {
       const errorSave = await saveMessageOnError({
         e,