From bf3a111e55bb04a26c6776b4a05f0a8d2d007518 Mon Sep 17 00:00:00 2001
From: williamhliu <137068196+williamhliu@users.noreply.github.com>
Date: Fri, 10 Nov 2023 09:36:50 +0800
Subject: [PATCH] (feature)(webapp) modify QL to SQL (#354)

---
 webapp/packages/chat-sdk/src/common/type.ts   |  6 ++---
 .../src/components/ChatItem/ParseTip.tsx      | 10 ++++----
 .../src/components/ChatItem/SqlItem.tsx       | 24 +++++++++----------
 .../components/ChatMsg/MetricCard/index.tsx   |  2 +-
 .../chat-sdk/src/components/ChatMsg/index.tsx |  4 ++--
 .../src/pages/Agent/ToolModal.tsx             |  4 ++--
 .../supersonic-fe/src/pages/Agent/type.ts     |  4 ++--
 .../src/pages/ChatPlugin/DetailModal.tsx      |  4 ++--
 .../src/pages/ChatPlugin/constants.ts         |  2 +-
 .../src/pages/ChatPlugin/type.ts              |  2 +-
 10 files changed, 31 insertions(+), 31 deletions(-)

diff --git a/webapp/packages/chat-sdk/src/common/type.ts b/webapp/packages/chat-sdk/src/common/type.ts
index 55a5a877e..b513f1f68 100644
--- a/webapp/packages/chat-sdk/src/common/type.ts
+++ b/webapp/packages/chat-sdk/src/common/type.ts
@@ -71,9 +71,9 @@ export type EntityDimensionType = {
 }
 
 export type SqlInfoType = {
-  s2QL: string;
-  logicSql: string;
-  querySql: string;
+  s2SQL: string;
+  correctS2SQL: string;
+  querySQL: string;
 }
 
 export type ChatContextType = {
diff --git a/webapp/packages/chat-sdk/src/components/ChatItem/ParseTip.tsx b/webapp/packages/chat-sdk/src/components/ChatItem/ParseTip.tsx
index 21e4bcdac..17077f7fc 100644
--- a/webapp/packages/chat-sdk/src/components/ChatItem/ParseTip.tsx
+++ b/webapp/packages/chat-sdk/src/components/ChatItem/ParseTip.tsx
@@ -130,14 +130,14 @@ const ParseTip: React.FC<Props> = ({
 
     return (
       <div className={`${prefixCls}-tip-content`}>
-        {!!agentType && queryMode !== 'LLM_S2QL' ? (
+        {!!agentType && queryMode !== 'LLM_S2SQL' ? (
           <div className={`${prefixCls}-tip-item`}>
             将由{agentType === 'plugin' ? '插件' : '内置'}工具
             <span className={itemValueClass}>{agentName}</span>来解答
           </div>
         ) : (
           <>
-            {(queryMode?.includes('ENTITY') || queryMode === 'LLM_S2QL') &&
+            {(queryMode?.includes('ENTITY') || queryMode === 'LLM_S2SQL') &&
             typeof entityId === 'string' &&
             !!entityAlias &&
             !!entityName ? (
@@ -162,14 +162,14 @@ const ParseTip: React.FC<Props> = ({
                   </div>
                 </div>
               )}
-            {['METRIC_GROUPBY', 'METRIC_ORDERBY', 'ENTITY_DETAIL', 'LLM_S2QL'].includes(
+            {['METRIC_GROUPBY', 'METRIC_ORDERBY', 'ENTITY_DETAIL', 'LLM_S2SQL'].includes(
               queryMode!
             ) &&
               fields &&
               fields.length > 0 && (
                 <div className={`${prefixCls}-tip-item`}>
                   <div className={`${prefixCls}-tip-item-name`}>
-                    {queryMode === 'LLM_S2QL'
+                    {queryMode === 'LLM_S2SQL'
                       ? nativeQuery
                         ? '查询字段'
                         : '下钻维度'
@@ -275,7 +275,7 @@ const ParseTip: React.FC<Props> = ({
   const tipNode = (
     <div className={`${prefixCls}-tip`}>
       {getTipNode()}
-      {!(!!agentType && queryMode !== 'LLM_S2QL') && getFiltersNode()}
+      {!(!!agentType && queryMode !== 'LLM_S2SQL') && getFiltersNode()}
     </div>
   );
 
diff --git a/webapp/packages/chat-sdk/src/components/ChatItem/SqlItem.tsx b/webapp/packages/chat-sdk/src/components/ChatItem/SqlItem.tsx
index 9696e4d95..b47cd9d85 100644
--- a/webapp/packages/chat-sdk/src/components/ChatItem/SqlItem.tsx
+++ b/webapp/packages/chat-sdk/src/components/ChatItem/SqlItem.tsx
@@ -28,7 +28,7 @@ const SqlItem: React.FC<Props> = ({ integrateSystem, sqlInfo, sqlTimeCost }) =>
     setSqlType('');
   };
 
-  if (!sqlInfo.s2QL && !sqlInfo.logicSql && !sqlInfo.querySql) {
+  if (!sqlInfo.s2SQL && !sqlInfo.correctS2SQL && !sqlInfo.querySQL) {
     return null;
   }
 
@@ -49,37 +49,37 @@ const SqlItem: React.FC<Props> = ({ integrateSystem, sqlInfo, sqlTimeCost }) =>
           )}
         </div>
         <div className={`${tipPrefixCls}-content-options`}>
-          {sqlInfo.s2QL && (
+          {sqlInfo.s2SQL && (
             <div
               className={`${tipPrefixCls}-content-option ${
-                sqlType === 's2QL' ? `${tipPrefixCls}-content-option-active` : ''
+                sqlType === 's2SQL' ? `${tipPrefixCls}-content-option-active` : ''
               }`}
               onClick={() => {
-                setSqlType(sqlType === 's2QL' ? '' : 's2QL');
+                setSqlType(sqlType === 's2SQL' ? '' : 's2SQL');
               }}
             >
-              解析S2QL
+              解析S2SQL
             </div>
           )}
-          {sqlInfo.logicSql && (
+          {sqlInfo.correctS2SQL && (
             <div
               className={`${tipPrefixCls}-content-option ${
-                sqlType === 'logicSql' ? `${tipPrefixCls}-content-option-active` : ''
+                sqlType === 'correctS2SQL' ? `${tipPrefixCls}-content-option-active` : ''
               }`}
               onClick={() => {
-                setSqlType(sqlType === 'logicSql' ? '' : 'logicSql');
+                setSqlType(sqlType === 'correctS2SQL' ? '' : 'correctS2SQL');
               }}
             >
-              修正S2QL
+              修正S2SQL
             </div>
           )}
-          {sqlInfo.querySql && (
+          {sqlInfo.querySQL && (
             <div
               className={`${tipPrefixCls}-content-option ${
-                sqlType === 'querySql' ? `${tipPrefixCls}-content-option-active` : ''
+                sqlType === 'querySQL' ? `${tipPrefixCls}-content-option-active` : ''
               }`}
               onClick={() => {
-                setSqlType(sqlType === 'querySql' ? '' : 'querySql');
+                setSqlType(sqlType === 'querySQL' ? '' : 'querySQL');
               }}
             >
               执行SQL
diff --git a/webapp/packages/chat-sdk/src/components/ChatMsg/MetricCard/index.tsx b/webapp/packages/chat-sdk/src/components/ChatMsg/MetricCard/index.tsx
index 4c206a57b..f00da255c 100644
--- a/webapp/packages/chat-sdk/src/components/ChatMsg/MetricCard/index.tsx
+++ b/webapp/packages/chat-sdk/src/components/ChatMsg/MetricCard/index.tsx
@@ -28,7 +28,7 @@ const MetricCard: React.FC<Props> = ({ data, loading, onApplyAuth }) => {
   const prefixCls = `${PREFIX_CLS}-metric-card`;
 
   const matricCardClass = classNames(prefixCls, {
-    [`${PREFIX_CLS}-metric-card-dsl`]: queryMode === 'LLM_S2QL',
+    [`${PREFIX_CLS}-metric-card-dsl`]: queryMode === 'LLM_S2SQL',
   });
 
   const [isNumber, setIsNumber] = useState(false);
diff --git a/webapp/packages/chat-sdk/src/components/ChatMsg/index.tsx b/webapp/packages/chat-sdk/src/components/ChatMsg/index.tsx
index 1a048fe58..5e42b1445 100644
--- a/webapp/packages/chat-sdk/src/components/ChatMsg/index.tsx
+++ b/webapp/packages/chat-sdk/src/components/ChatMsg/index.tsx
@@ -60,7 +60,7 @@ const ChatMsg: React.FC<Props> = ({ queryId, data, chartIndex, triggerResize })
   const metricFields = columns.filter(item => item.showType === 'NUMBER');
 
   const isDslMetricCard =
-    queryMode === 'LLM_S2QL' && singleData && metricFields.length === 1 && columns.length === 1;
+    queryMode === 'LLM_S2SQL' && singleData && metricFields.length === 1 && columns.length === 1;
 
   const isMetricCard = (queryMode.includes('METRIC') || isDslMetricCard) && singleData;
 
@@ -210,7 +210,7 @@ const ChatMsg: React.FC<Props> = ({ queryId, data, chartIndex, triggerResize })
   );
 
   const isMultipleMetric =
-    (queryMode.includes('METRIC') || queryMode === 'LLM_S2QL') &&
+    (queryMode.includes('METRIC') || queryMode === 'LLM_S2SQL') &&
     recommendMetrics?.length > 0 &&
     queryColumns?.filter(column => column.showType === 'NUMBER').length === 1;
 
diff --git a/webapp/packages/supersonic-fe/src/pages/Agent/ToolModal.tsx b/webapp/packages/supersonic-fe/src/pages/Agent/ToolModal.tsx
index 2fef089bb..9872713c3 100644
--- a/webapp/packages/supersonic-fe/src/pages/Agent/ToolModal.tsx
+++ b/webapp/packages/supersonic-fe/src/pages/Agent/ToolModal.tsx
@@ -113,7 +113,7 @@ const ToolModal: React.FC<Props> = ({ editTool, onSaveTool, onCancel }) => {
         <FormItem name="name" label="名称">
           <Input placeholder="请输入工具名称" />
         </FormItem>
-        {(toolType === AgentToolTypeEnum.RULE || toolType === AgentToolTypeEnum.LLM_S2QL) && (
+        {(toolType === AgentToolTypeEnum.RULE || toolType === AgentToolTypeEnum.LLM_S2SQL) && (
           <FormItem name="modelIds" label="主题域">
             <Select
               options={modelList.map((model) => ({ label: model.name, value: model.id }))}
@@ -122,7 +122,7 @@ const ToolModal: React.FC<Props> = ({ editTool, onSaveTool, onCancel }) => {
             />
           </FormItem>
         )}
-        {toolType === AgentToolTypeEnum.LLM_S2QL && (
+        {toolType === AgentToolTypeEnum.LLM_S2SQL && (
           <FormItem name="exampleQuestions" label="示例问题">
             <div className={styles.paramsSection}>
               {examples.map((example) => {
diff --git a/webapp/packages/supersonic-fe/src/pages/Agent/type.ts b/webapp/packages/supersonic-fe/src/pages/Agent/type.ts
index 250c16779..7da10cd56 100644
--- a/webapp/packages/supersonic-fe/src/pages/Agent/type.ts
+++ b/webapp/packages/supersonic-fe/src/pages/Agent/type.ts
@@ -6,7 +6,7 @@ export type MetricOptionType = {
 
 export enum AgentToolTypeEnum {
   RULE = 'RULE',
-  LLM_S2QL = 'LLM_S2QL',
+  LLM_S2SQL = 'LLM_S2SQL',
   PLUGIN = 'PLUGIN',
   INTERPRET = 'INTERPRET'
 }
@@ -29,7 +29,7 @@ export const AGENT_TOOL_TYPE_LIST = [
   },
   {
     label: '大模型语义解析',
-    value: AgentToolTypeEnum.LLM_S2QL
+    value: AgentToolTypeEnum.LLM_S2SQL
   },
   {
     label: '大模型指标解读',
diff --git a/webapp/packages/supersonic-fe/src/pages/ChatPlugin/DetailModal.tsx b/webapp/packages/supersonic-fe/src/pages/ChatPlugin/DetailModal.tsx
index b0788526e..70fc54736 100644
--- a/webapp/packages/supersonic-fe/src/pages/ChatPlugin/DetailModal.tsx
+++ b/webapp/packages/supersonic-fe/src/pages/ChatPlugin/DetailModal.tsx
@@ -216,7 +216,7 @@ const DetailModal: React.FC<Props> = ({ detail, onSubmit, onCancel }) => {
             }))}
             onChange={(value) => {
               setPluginType(value);
-              if (value === PluginTypeEnum.LLM_S2QL) {
+              if (value === PluginTypeEnum.LLM_S2SQL) {
                 form.setFieldsValue({ parseMode: ParseModeEnum.FUNCTION_CALL });
                 setFunctionParams([
                   {
@@ -243,7 +243,7 @@ const DetailModal: React.FC<Props> = ({ detail, onSubmit, onCancel }) => {
         <FormItem name="pattern" label="函数描述">
           <TextArea placeholder="请输入函数描述，多个描述换行分隔" allowClear />
         </FormItem>
-        {/* <FormItem name="params" label="函数参数" hidden={pluginType === PluginTypeEnum.LLM_S2QL}>
+        {/* <FormItem name="params" label="函数参数" hidden={pluginType === PluginTypeEnum.LLM_S2SQL}>
           <div className={styles.paramsSection}>
             {functionParams.map((functionParam: FunctionParamFormItemType) => {
               const { id, name, type, description } = functionParam;
diff --git a/webapp/packages/supersonic-fe/src/pages/ChatPlugin/constants.ts b/webapp/packages/supersonic-fe/src/pages/ChatPlugin/constants.ts
index a39f11df7..db835dd25 100644
--- a/webapp/packages/supersonic-fe/src/pages/ChatPlugin/constants.ts
+++ b/webapp/packages/supersonic-fe/src/pages/ChatPlugin/constants.ts
@@ -1,7 +1,7 @@
 export const PLUGIN_TYPE_MAP = {
   WEB_PAGE: 'Web页面',
   WEB_SERVICE: 'Web服务',
-  // LLM_S2QL: 'LLM语义解析',
+  // LLM_S2SQL: 'LLM语义解析',
   // CONTENT_INTERPRET: '内容解读',
 }
 
diff --git a/webapp/packages/supersonic-fe/src/pages/ChatPlugin/type.ts b/webapp/packages/supersonic-fe/src/pages/ChatPlugin/type.ts
index 659b5fb2e..937acfcda 100644
--- a/webapp/packages/supersonic-fe/src/pages/ChatPlugin/type.ts
+++ b/webapp/packages/supersonic-fe/src/pages/ChatPlugin/type.ts
@@ -9,7 +9,7 @@ export type PluginConfigType = {
 export enum PluginTypeEnum {
   WEB_PAGE = 'WEB_PAGE',
   WEB_SERVICE = 'WEB_SERVICE',
-  LLM_S2QL = 'LLM_S2QL'
+  LLM_S2SQL = 'LLM_S2SQL'
 }
 
 export enum ParseModeEnum {