(feature)(chat-sdk) update antd version to 5 (#409)

webapp/packages/chat-sdk/package.json

@@ -9,9 +9,10 @@
     "@ant-design/icons": "^4.7.0",
     "@uiw/react-watermark": "^0.0.5",
     "ahooks": "^3.7.8",
-    "antd": "^4.23.5",
+    "antd": "^5.11.2",
     "axios": "^0.21.1",
     "classnames": "^2.3.2",
+    "dayjs": "^1.11.10",
     "echarts": "^5.4.2",
     "lodash": "^4.17.11",
     "moment": "^2.29.4",

webapp/packages/chat-sdk/src/components/ChatItem/FilterItem.tsx

@@ -5,7 +5,7 @@ import { useEffect, useMemo, useRef, useState } from 'react';
 import { queryDimensionValues } from '../../service';
 import { debounce, isArray } from 'lodash';
 import SwicthEntity from './SwitchEntity';
-import moment from 'moment';
+import dayjs from 'dayjs';
 
 type Props = {
   modelId: number;
@@ -164,8 +164,8 @@ const FilterItem: React.FC<Props> = ({
           value={filter.value}
           onChange={onChange}
         />
-      ) : typeof filter.value === 'string' && moment(filter.value, 'YYYY-MM-DD').isValid() ? (
+      ) : typeof filter.value === 'string' && dayjs(filter.value, 'YYYY-MM-DD').isValid() ? (
-        <DatePicker value={moment(filter.value)} onChange={onDateChange} allowClear={false} />
+        <DatePicker value={dayjs(filter.value)} onChange={onDateChange} allowClear={false} />
       ) : (typeof filter.value === 'string' || isArray(filter.value)) &&
         !filter.bizName?.includes('_id') ? (
         <Select

webapp/packages/chat-sdk/src/components/ChatItem/ParseTip.tsx

@@ -5,9 +5,9 @@ import { Button, DatePicker } from 'antd';
 import { CheckCircleFilled, ReloadOutlined } from '@ant-design/icons';
 import Loading from './Loading';
 import FilterItem from './FilterItem';
-import moment from 'moment';
 import classNames from 'classnames';
 import { isMobile } from '../../utils/utils';
+import dayjs from 'dayjs';
 
 const { RangePicker } = DatePicker;
 
@@ -52,7 +52,7 @@ const ParseTip: React.FC<Props> = ({
 }) => {
   const prefixCls = `${PREFIX_CLS}-item`;
 
-  const getNode = (tipTitle: ReactNode, tipNode?: ReactNode, parseSucceed?: boolean) => {
+  const getNode = (tipTitle: ReactNode, tipNode?: ReactNode) => {
     return (
       <div className={`${prefixCls}-parse-tip`}>
         <div className={`${prefixCls}-title-bar`}>
@@ -227,7 +227,7 @@ const ParseTip: React.FC<Props> = ({
             </span>
           ) : (
             <RangePicker
-              value={[moment(startDate), moment(endDate)]}
+              value={[dayjs(startDate), dayjs(endDate)]}
               onChange={onDateInfoChange}
               getPopupContainer={trigger => trigger.parentNode as HTMLElement}
               allowClear={false}
@@ -306,8 +306,7 @@ const ParseTip: React.FC<Props> = ({
         </div>
       )}
     </div>,
-    tipNode,
+    tipNode
-    true
   );
 };
 

webapp/packages/chat-sdk/src/components/ChatItem/index.tsx

@@ -60,43 +60,51 @@ const ChatItem: React.FC<Props> = ({
   onUpdateMessageScroll,
   onSendMsg,
 }) => {
-  const [data, setData] = useState<MsgDataType>();
   const [parseLoading, setParseLoading] = useState(false);
   const [parseTimeCost, setParseTimeCost] = useState<ParseTimeCostType>();
   const [parseInfo, setParseInfo] = useState<ChatContextType>();
   const [parseInfoOptions, setParseInfoOptions] = useState<ChatContextType[]>([]);
   const [parseTip, setParseTip] = useState('');
+  const [executeMode, setExecuteMode] = useState(false);
   const [executeLoading, setExecuteLoading] = useState(false);
   const [executeTip, setExecuteTip] = useState('');
-  const [executeMode, setExecuteMode] = useState(false);
+  const [data, setData] = useState<MsgDataType>();
   const [entitySwitchLoading, setEntitySwitchLoading] = useState(false);
   const [dimensionFilters, setDimensionFilters] = useState<FilterItemType[]>([]);
   const [dateInfo, setDateInfo] = useState<DateInfoType>({} as DateInfoType);
   const [entityInfo, setEntityInfo] = useState<EntityInfoType>({} as EntityInfoType);
+  const [dataCache, setDataCache] = useState<Record<number, { tip: string; data?: MsgDataType }>>(
+    {}
+  );
 
   const prefixCls = `${PREFIX_CLS}-item`;
 
   const updateData = (res: Result<MsgDataType>) => {
+    let tip: string = '';
+    let data: MsgDataType | undefined = undefined;
     if (res.code === 401 || res.code === 412) {
-      setExecuteTip(res.msg);
+      tip = res.msg;
-      return false;
     }
     if (res.code !== 200) {
-      setExecuteTip(SEARCH_EXCEPTION_TIP);
+      tip = SEARCH_EXCEPTION_TIP;
-      return false;
     }
-    const { queryColumns, queryResults, queryState, queryMode, response } = res.data || {};
+    const { queryColumns, queryResults, queryState, queryMode, response, chatContext } =
+      res.data || {};
     if (queryState !== 'SUCCESS') {
-      setExecuteTip(response && typeof response === 'string' ? response : SEARCH_EXCEPTION_TIP);
+      tip = response && typeof response === 'string' ? response : SEARCH_EXCEPTION_TIP;
-      return false;
     }
     if ((queryColumns && queryColumns.length > 0 && queryResults) || queryMode === 'WEB_PAGE') {
-      setData(res.data);
+      data = res.data;
+      tip = '';
+    }
+    setDataCache({ ...dataCache, [chatContext!.id!]: { tip, data } });
+    if (data) {
+      setData(data);
       setExecuteTip('');
       return true;
     }
-    setExecuteTip(SEARCH_EXCEPTION_TIP);
+    setExecuteTip(tip || SEARCH_EXCEPTION_TIP);
-    return true;
+    return false;
   };
 
   const onExecute = async (
@@ -122,7 +130,9 @@ const ChatItem: React.FC<Props> = ({
         valid
       );
     } catch (e) {
+      const tip = SEARCH_EXCEPTION_TIP;
       setExecuteTip(SEARCH_EXCEPTION_TIP);
+      setDataCache({ ...dataCache, [parseInfoValue!.id!]: { tip } });
     }
     if (isSwitchParseInfo) {
       setEntitySwitchLoading(false);
@@ -203,12 +213,13 @@ const ChatItem: React.FC<Props> = ({
     const res = await switchEntity(entityId, data?.chatContext?.modelId, conversationId || 0);
     setEntitySwitchLoading(false);
     setData(res.data);
-    const { chatContext, entityInfo } = res.data;
+    const { chatContext, entityInfo } = res.data || {};
     const chatContextValue = { ...(chatContext || {}), queryId: parseInfo?.queryId };
     setParseInfo(chatContextValue);
     setEntityInfo(entityInfo);
     updateDimensionFitlers(chatContextValue?.dimensionFilters || []);
     setDateInfo(chatContextValue?.dateInfo);
+    setDataCache({ ...dataCache, [chatContextValue.id!]: { tip: '', data: res.data } });
   };
 
   const onFiltersChange = (dimensionFilters: FilterItemType[]) => {
@@ -250,6 +261,7 @@ const ChatItem: React.FC<Props> = ({
       onMsgDataLoaded?.(dataValue, true, true);
       setData(dataValue);
       setParseInfo(contextValue);
+      setDataCache({ ...dataCache, [id!]: { tip: '', data: dataValue } });
     }
   };
 
@@ -267,7 +279,22 @@ const ChatItem: React.FC<Props> = ({
     } else {
       getEntityInfo(parseInfoValue);
     }
-    onExecute(parseInfoValue, parseInfoOptions, true);
+    if (dataCache[parseInfoValue.id!]) {
+      const { tip, data } = dataCache[parseInfoValue.id!];
+      setExecuteTip(tip);
+      setData(data);
+      onMsgDataLoaded?.(
+        {
+          ...(data as any),
+          parseInfos,
+          queryId: parseInfoValue.queryId,
+        },
+        true,
+        true
+      );
+    } else {
+      onExecute(parseInfoValue, parseInfoOptions, true);
+    }
   };
 
   const onSelectQuestion = (question: SimilarQuestionType) => {

webapp/packages/chat-sdk/src/components/ChatMsg/style.less

@@ -13,11 +13,11 @@
     align-items: center;
     column-gap: 20px;
     font-size: 14px;
-    margin-top: 6px;
+    margin-top: 12px;
     margin-bottom: 2px;
   }
 
   &-metric-card-tools {
-    margin-top: 0;
+    margin-top: 2px;
   }
 }

webapp/packages/chat-sdk/src/components/IconFont/index.tsx

@@ -1,7 +1,7 @@
 import { createFromIconfontCN } from '@ant-design/icons';
 
 const IconFont = createFromIconfontCN({
-  scriptUrl: '//at.alicdn.com/t/c/font_4120566_x6akuij1kod.js',
+  scriptUrl: '//at.alicdn.com/t/c/font_4120566_8i352njvpoi.js',
 });
 
 export default IconFont;

webapp/packages/chat-sdk/src/styles/global.less

@@ -1,4 +1,4 @@
-@import '~antd/dist/antd.css';
+// @import '~antd/dist/antd.css';
 
 @import './index.less';
 

webapp/packages/chat-sdk/src/utils/utils.ts

@@ -172,6 +172,10 @@ export function getChartLightenColor(col) {
 
 export const isMobile = window.navigator.userAgent.match(/(iPhone|iPod|Android|ios)/i);
 
+export const isIOS = window.navigator.userAgent.match(/(iPhone|iPod|ios)/i);
+
+export const isAndroid = window.navigator.userAgent.match(/(Android)/i);
+
 
 export function isProd() {
   return process.env.NODE_ENV === 'production';

webapp/packages/supersonic-fe/src/app.tsx

@@ -133,7 +133,7 @@ export const layout: RunTimeLayoutConfig = (params) => {
         >
           {dom}
           {history.location.pathname !== '/chat' && !isMobile && (
-            <Copilot token={getAuthToken() || ''} isDeveloper />
+            <Copilot token={getToken() || ''} isDeveloper />
           )}
         </div>
       );