From dc63f4ef14a25d40eccfd95d19fd6271233b3b10 Mon Sep 17 00:00:00 2001
From: williamhliu <137068196+williamhliu@users.noreply.github.com>
Date: Sun, 30 Jun 2024 15:06:07 +0800
Subject: [PATCH] (feature)(supersonic-fe) memory manage add search button
 (#1294)

---
 .../src/pages/Agent/MemorySection.tsx         | 29 ++++++++-----------
 .../supersonic-fe/src/pages/Agent/style.less  | 13 +++++++--
 2 files changed, 22 insertions(+), 20 deletions(-)

diff --git a/webapp/packages/supersonic-fe/src/pages/Agent/MemorySection.tsx b/webapp/packages/supersonic-fe/src/pages/Agent/MemorySection.tsx
index d35b31e2c..fd6f92e89 100644
--- a/webapp/packages/supersonic-fe/src/pages/Agent/MemorySection.tsx
+++ b/webapp/packages/supersonic-fe/src/pages/Agent/MemorySection.tsx
@@ -3,10 +3,10 @@ import { EditableProTable } from '@ant-design/pro-components';
 import React, { useState } from 'react';
 import { MemoryType, ReviewEnum, StatusEnum } from './type';
 import { getMemeoryList, saveMemory } from './service';
-import { Popover, Input, Badge, Radio, Select } from 'antd';
+import { Popover, Input, Badge, Radio, Select, Button } from 'antd';
 import styles from './style.less';
 
-const { TextArea, Search } = Input;
+const { TextArea } = Input;
 const RadioGroup = Radio.Group;
 
 type Props = {
@@ -189,23 +189,18 @@ const MemorySection = ({ agentId }: Props) => {
     await saveMemory(data);
   };
 
-  const onSearch = () => {
-    loadMemoryList();
-  };
-
   return (
     <div className={styles.memorySection}>
       <div className={styles.filterSection}>
         <div className={styles.filterItem}>
           <div className={styles.filterItemTitle}>用户问题</div>
-          <Search
+          <Input
             className={styles.filterItemControl}
             placeholder="请输入用户问题"
             value={question}
             onChange={(e) => {
               setFilters({ ...filters, question: e.target.value });
             }}
-            onSearch={onSearch}
           />
         </div>
         <div className={styles.filterItem}>
@@ -220,9 +215,7 @@ const MemorySection = ({ agentId }: Props) => {
             value={llmReviewRet}
             allowClear
             onChange={(value: ReviewEnum) => {
-              const filtersValue = { ...filters, llmReviewRet: value };
-              setFilters(filtersValue);
-              loadMemoryList({ filtersValue });
+              setFilters({ ...filters, llmReviewRet: value });
             }}
           />
         </div>
@@ -238,9 +231,7 @@ const MemorySection = ({ agentId }: Props) => {
             value={humanReviewRet}
             allowClear
             onChange={(value: ReviewEnum) => {
-              const filtersValue = { ...filters, humanReviewRet: value };
-              setFilters(filtersValue);
-              loadMemoryList({ filtersValue });
+              setFilters({ ...filters, humanReviewRet: value });
             }}
           />
         </div>
@@ -257,13 +248,17 @@ const MemorySection = ({ agentId }: Props) => {
             value={status}
             allowClear
             onChange={(value: ReviewEnum) => {
-              const filtersValue = { ...filters, status: value };
-              setFilters(filtersValue);
-              loadMemoryList({ filtersValue });
+              setFilters({ ...filters, status: value });
             }}
           />
         </div>
       </div>
+      <div className={styles.search}>
+        <Button onClick={() => setFilters({})}>重置</Button>
+        <Button type="primary" onClick={() => loadMemoryList()}>
+          查询
+        </Button>
+      </div>
       <EditableProTable<MemoryType>
         rowKey="id"
         recordCreatorProps={false}
diff --git a/webapp/packages/supersonic-fe/src/pages/Agent/style.less b/webapp/packages/supersonic-fe/src/pages/Agent/style.less
index c84401d2b..3a4f835ca 100644
--- a/webapp/packages/supersonic-fe/src/pages/Agent/style.less
+++ b/webapp/packages/supersonic-fe/src/pages/Agent/style.less
@@ -333,9 +333,8 @@
 
   .filterSection {
     display: flex;
-    flex-wrap: wrap;
-    row-gap: 12px;
-    column-gap: 20px;
+    justify-content: space-between;
+    // column-gap: 20px;
     margin-bottom: 20px;
 
     .filterItem {
@@ -367,3 +366,11 @@
 .commentPopover {
   width: 400px;
 }
+
+.search {
+  display: flex;
+  align-items: center;
+  justify-content: end;
+  gap: 10px;
+  margin-bottom: 20px;
+}