feat: update topic

src/util/ideaBridge.ts

@@ -1,5 +1,14 @@
 const JStoIdea = {
-  sendMessage: (message: string, context: string = "", parent: string = "") => {
+  sendMessage: (message: string, context: any = [], parent: string = "") => {
+    const paramsContext: any = [];
+    if (Array.isArray(context) && context.length > 0) {
+      context.forEach((item) => {
+        paramsContext.push({
+          type: "code",
+          ...item.context,
+        });
+      });
+    }
     const params = {
       action: "sendMessage/request",
       metadata: {
@@ -7,11 +16,11 @@ const JStoIdea = {
         parent: parent,
       },
       payload: {
-        contexts: [],
+        contexts: paramsContext,
         message: message,
       },
     };
-
+    console.log("ready to call java send message", JSON.stringify(params));
     window.JSJavaBridge.callJava(JSON.stringify(params));
   },
   getModel: () => {
@@ -20,8 +29,8 @@ const JStoIdea = {
       metadata: {
         callback: "IdeaToJSMessage",
       },
+      payload: {},
     };
-
     window.JSJavaBridge.callJava(JSON.stringify(params));
   },
   getContextList: () => {
@@ -30,6 +39,7 @@ const JStoIdea = {
       metadata: {
         callback: "IdeaToJSMessage",
       },
+      payload: {},
     };
 
     window.JSJavaBridge.callJava(JSON.stringify(params));
@@ -40,8 +50,9 @@ const JStoIdea = {
       metadata: {
         callback: "IdeaToJSMessage",
       },
+      payload: {},
     };
-
+    console.log("reday to call java command list", JSON.stringify(params));
     window.JSJavaBridge.callJava(JSON.stringify(params));
   },
   insertCode: (code) => {
@@ -80,7 +91,7 @@ const JStoIdea = {
         content: code,
       },
     };
-    console.log("request viewDiff: ", params);
+
     window.JSJavaBridge.callJava(JSON.stringify(params));
   },
   getUserAccessKey: () => {
@@ -89,6 +100,7 @@ const JStoIdea = {
       metadata: {
         callback: "IdeaToJSMessage",
       },
+      payload: {},
     };
     window.JSJavaBridge.callJava(JSON.stringify(params));
   },
@@ -112,6 +124,18 @@ const JStoIdea = {
         break;
     }
   },
+  getTopicList: () => {
+    // 获取 topic 列表
+    const params = {
+      action: "listTopics/request",
+      metadata: {
+        callback: "IdeaToJSMessage",
+      },
+      payload: {},
+    };
+
+    window.JSJavaBridge.callJava(JSON.stringify(params));
+  },
   updateSetting: (value: string) => {
     // 因为现在只有更换模型，所以直接取 value
     const params = {
@@ -139,6 +163,18 @@ const JStoIdea = {
     };
     window.JSJavaBridge.callJava(JSON.stringify(params));
   },
+  getTopicDetail: (topicHash: string) => {
+    const params = {
+      action: "listConversations/request",
+      metadata: {
+        callback: "IdeaToJSMessage",
+        topicHash: topicHash,
+      },
+      payload: {},
+    };
+    console.log("ready to call java getTopicDetail", params);
+    window.JSJavaBridge.callJava(JSON.stringify(params));
+  },
 };
 
 class IdeaBridge {
@@ -174,14 +210,36 @@ class IdeaBridge {
         case "getSetting/response":
           this.resviceSettings(res);
           break;
+        case "listTopics/response":
+          this.resviceTopicList(res);
+          break;
+        case "listConversations/response":
+          this.resviceTopicDetail(res);
+          break;
         default:
           break;
       }
     };
   }
 
+  resviceTopicDetail(res) {
+    // 接收到这里需要触发 loadHistoryMessages
+    const list = res.payload.conversations.map((item) => ({
+      ...item,
+      response: item.responses.join("\n"),
+    }));
+    this.handle.loadHistoryMessages({
+      entries: list,
+    });
+  }
+
+  resviceTopicList(res) {
+    console.log("resviceTopicList res: ", res);
+    const list = res.payload.topics;
+    this.handle.listTopics(list);
+  }
+
   resviesContext(res) {
-    console.log("resviesContextres: ", res);
     const params = {
       file: res.payload.path,
       result: "",
@@ -277,11 +335,13 @@ class IdeaBridge {
   }
 
   sendMessage(message: any) {
+    console.log("sendMessage message: ", message);
     // 根据 command 分发到不同的方法·
     switch (message.command) {
       // 发送消息
       case "sendMessage":
-        JStoIdea.sendMessage(message.text, message.context, message.parent);
+        console.log("message: ", message);
+        JStoIdea.sendMessage(message.text, message.contextInfo, message.parent);
         break;
       // 重新生成消息，用于发送失败时再次发送
       case "regeneration":
@@ -318,6 +378,12 @@ class IdeaBridge {
       case "doCommit":
         JStoIdea.commit(message.content);
         break;
+      case "listTopics":
+        JStoIdea.getTopicList();
+        break;
+      case "getTopicDetail":
+        JStoIdea.getTopicDetail(message.topicHash);
+        break;
       default:
         break;
     }

src/views/App.css

@@ -0,0 +1,12 @@
+::-webkit-scrollbar {
+  background-color: transparent;
+  width: 6px;
+  height: 6px;
+}
+::-webkit-scrollbar-track {
+  background-color: transparent;
+}
+::-webkit-scrollbar-thumb {
+  background-color: grey;
+  border-radius: 6px;
+}

src/views/App.tsx

@@ -5,6 +5,7 @@ import {
 } from '@mantine/core';
 import ChatPanel from '@/views/pages/ChatPanel';
 import Head from '@/views/components/Header';
+import './App.css';
 
 export default function App() {
     const theme = useMantineTheme();

src/views/components/InputMessage/Topic.tsx

@@ -0,0 +1,95 @@
+import React, { useEffect, useState } from "react";
+import { ActionIcon, Drawer, Text, Box, Flex, Divider } from "@mantine/core";
+import { IconClock, IconChevronDown } from "@tabler/icons-react";
+import { useDisclosure } from "@mantine/hooks";
+import messageUtil from "@/util/MessageUtil";
+import dayjs from "dayjs";
+
+export default function Topic({ styleName }) {
+  const [topicList, setTopicList] = useState([]);
+  useEffect(() => {
+    messageUtil.sendMessage({
+      command: "listTopics",
+    });
+    messageUtil.registerHandler("listTopics", (data) => {
+      console.log("listTopics data: ", data);
+      setTopicList(data);
+    });
+  }, []);
+  const [drawerOpened, { open: openDrawer, close: closeDrawer }] =
+    useDisclosure(false);
+
+  const showTopic = (root_prompt: any) => {
+    console.log("root_prompt: ", root_prompt);
+    closeDrawer();
+    messageUtil.sendMessage({
+      command: "getTopicDetail",
+      topicHash: root_prompt.hash,
+    });
+  };
+
+  return (
+    <>
+      <Drawer
+        opened={drawerOpened}
+        position="bottom"
+        title="Devchat Topic"
+        onClose={closeDrawer}
+        overlayProps={{ opacity: 0.5, blur: 4 }}
+        closeButtonProps={{ children: <IconChevronDown size="1rem" /> }}
+        styles={{
+          content: {
+            background: "var(--vscode-sideBar-background)",
+            color: "var(--vscode-editor-foreground)",
+            overflowY: "auto",
+          },
+          header: {
+            background: "var(--vscode-sideBar-background)",
+            color: "var(--vscode-editor-foreground)",
+          },
+        }}
+      >
+        {topicList.map((item: any, index) => (
+          <Box
+            sx={{
+              cursor: "pointer",
+            }}
+            onClick={() => showTopic(item?.root_prompt)}
+          >
+            <Flex justify="space-between">
+              <Text fz="sm" fw={700}>
+                {item?.root_prompt.request}
+              </Text>
+              <Text fz="sm" c="dimmed">
+                {dayjs(item?.latest_time * 1000).format("YYYY-MM-DD HH:mm:ss")}
+              </Text>
+            </Flex>
+
+            <Text
+              c="dimmed"
+              fz="sm"
+              sx={{
+                whiteSpace: "nowrap",
+                overflow: "hidden",
+                textOverflow: "ellipsis",
+              }}
+            >
+              {item?.root_prompt.responses?.[0]}
+            </Text>
+            {index !== topicList.length - 1 && (
+              <Divider variant="solid" my={6} opacity="0.5" />
+            )}
+          </Box>
+        ))}
+      </Drawer>
+      <ActionIcon
+        className={styleName}
+        radius="xl"
+        variant="default"
+        onClick={openDrawer}
+      >
+        <IconClock size="1rem" />
+      </ActionIcon>
+    </>
+  );
+}

src/views/components/InputMessage/index.tsx

@@ -5,6 +5,7 @@ import React, { useState, useEffect } from "react";
 import { IconGitBranchChecked, IconShellCommand } from "@/views/components/ChatIcons";
 import messageUtil from '@/util/MessageUtil';
 import InputContexts from './InputContexts';
+import Topic from './Topic';
 import { observer } from "mobx-react-lite";
 import { useMst } from "@/views/stores/RootStore";
 import { ChatContext } from "@/views/stores/InputStore";
@@ -36,6 +37,7 @@ const InputMessage = observer((props: any) => {
     const { input, chat } = useMst();
     const { contexts, menuOpend, menuType, currentMenuIndex, contextMenus, commandMenus,modelMenus } = input;
     const { generating } = chat;
+    const showTopic = process.env.platform === 'idea';
 
     const [drawerOpened, { open: openDrawer, close: closeDrawer }] = useDisclosure(false);
 
@@ -388,6 +390,9 @@ const InputMessage = observer((props: any) => {
                          })}
                     </Menu.Dropdown>
                 </Menu>
+                {
+                    showTopic && <Topic styleName={classes.actionIcon}/>
+                }
             </Group>
             {contexts && contexts.length > 0 &&
                 <Drawer

yarn.lock

@@ -3514,6 +3514,11 @@ data-uri-to-buffer@^4.0.0:
   resolved "https://registry.yarnpkg.com/data-uri-to-buffer/-/data-uri-to-buffer-4.0.1.tgz#d8feb2b2881e6a4f58c2e08acfd0e2834e26222e"
   integrity sha512-0R9ikRb668HB7QDxT1vkpuUBtqc53YyAwMwGeUFKRojY/NWKvdZ+9UYtRfGmhqNbRkTSVpMbmyhXipFFv2cb/A==
 
+dayjs@^1.11.10:
+  version "1.11.10"
+  resolved "https://registry.yarnpkg.com/dayjs/-/dayjs-1.11.10.tgz#68acea85317a6e164457d6d6947564029a6a16a0"
+  integrity sha512-vjAczensTgRcqDERK0SR2XMwsF/tSvnvlv6VcF2GIhg6Sx4yOIt/irsr1RDJsKiIyBzJDpCoXiWWq28MqH2cnQ==
+
 debug@2.6.9:
   version "2.6.9"
   resolved "https://registry.yarnpkg.com/debug/-/debug-2.6.9.tgz#5d128515df134ff327e90a4c93f4e077a536341f"