@agentscope-ai/chat 1.1.65 → 1.1.67

package/lib/AgentScopeRuntimeWebUI/core/Chat/hooks/useChatRequest.js

@@ -10,7 +10,7 @@ import { useChatAnywhereOptions } from "../../Context/ChatAnywhereOptionsContext
 import AgentScopeRuntimeResponseBuilder from "../../AgentScopeRuntime/Response/Builder";
 import { AgentScopeRuntimeRunStatus, AgentScopeRuntimeMessageType } from "../../AgentScopeRuntime/types";
 /**
- * 处理 API 请求和流式响应的 Hook
+ * Hook for handling API requests and streaming SSE responses.
  */
 export default function useChatRequest(options) {
   var currentQARef = options.currentQARef,
@@ -21,7 +21,7 @@ export default function useChatRequest(options) {
     return v.api;
   });
 
-  // 使用 ref 保存最新的 apiOptions，避免闭包陷阱
+  // Keep apiOptions in a ref to avoid stale closure issues
   var apiOptionsRef = useRef(apiOptions);
   useEffect(function () {
     apiOptionsRef.current = apiOptions;
@@ -101,9 +101,9 @@ export default function useChatRequest(options) {
     };
   }(), []);
   var processSSEResponse = useCallback( /*#__PURE__*/function () {
-    var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(response) {
+    var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(response, myRequestId, mySessionId) {
       var _currentQARef$current;
-      var currentApiOptions, agentScopeRuntimeResponseBuilder, data, res, abortSignal, _iteratorAbruptCompletion2, _didIteratorError2, _iteratorError2, _iterator2, _step2, chunk, _currentQARef$current2, _res$output, _currentQARef$current3, responseParser, chunkData, _res, _currentQARef$current4;
+      var currentApiOptions, agentScopeRuntimeResponseBuilder, isStillActive, data, res, abortSignal, _iteratorAbruptCompletion2, _didIteratorError2, _iteratorError2, _iterator2, _step2, chunk, _currentQARef$current2, _res$output, _currentQARef$current3, responseParser, chunkData, _res, _currentQARef$current4;
       return _regeneratorRuntime().wrap(function _callee2$(_context2) {
         while (1) switch (_context2.prev = _context2.next) {
           case 0:
@@ -113,14 +113,25 @@ export default function useChatRequest(options) {
               status: AgentScopeRuntimeRunStatus.Created,
               created_at: 0
             });
+            /**
+             * Guard: check whether this SSE stream is still the active request.
+             * If any of the following is true, writing should stop immediately:
+             *   - requestId mismatch: user cancelled / sent new message / switched session
+             *   - sessionId mismatch: session was switched away, prevents cross-session leakage
+             */
+            isStillActive = function isStillActive() {
+              if (currentQARef.current.activeRequestId !== myRequestId) return false;
+              if (mySessionId && currentQARef.current.activeSessionId && currentQARef.current.activeSessionId !== mySessionId) return false;
+              return true;
+            };
             if (response.ok) {
-              _context2.next = 15;
+              _context2.next = 16;
               break;
             }
-            _context2.prev = 3;
-            _context2.next = 6;
+            _context2.prev = 4;
+            _context2.next = 7;
             return response.json();
-          case 6:
+          case 7:
             data = _context2.sent;
             res = agentScopeRuntimeResponseBuilder.handle({
               object: 'message',
@@ -132,63 +143,79 @@ export default function useChatRequest(options) {
               code: String(response.status),
               message: JSON.stringify(data)
             });
-            currentQARef.current.response.cards = [{
-              code: 'AgentScopeRuntimeResponseCard',
-              data: res
-            }];
-            _context2.next = 13;
+            if (isStillActive() && currentQARef.current.response) {
+              currentQARef.current.response.cards = [{
+                code: 'AgentScopeRuntimeResponseCard',
+                data: res
+              }];
+            }
+            _context2.next = 14;
             break;
-          case 11:
-            _context2.prev = 11;
-            _context2.t0 = _context2["catch"](3);
-          case 13:
-            onFinish();
+          case 12:
+            _context2.prev = 12;
+            _context2.t0 = _context2["catch"](4);
+          case 14:
+            if (isStillActive()) onFinish();
             return _context2.abrupt("return");
-          case 15:
+          case 16:
             abortSignal = (_currentQARef$current = currentQARef.current.abortController) === null || _currentQARef$current === void 0 ? void 0 : _currentQARef$current.signal;
-            _context2.prev = 16;
+            _context2.prev = 17;
             _iteratorAbruptCompletion2 = false;
             _didIteratorError2 = false;
-            _context2.prev = 19;
+            _context2.prev = 20;
             _iterator2 = _asyncIterator(Stream({
               readableStream: response.body,
               signal: abortSignal
             }));
-          case 21:
-            _context2.next = 23;
+          case 22:
+            _context2.next = 24;
             return _iterator2.next();
-          case 23:
+          case 24:
             if (!(_iteratorAbruptCompletion2 = !(_step2 = _context2.sent).done)) {
-              _context2.next = 40;
+              _context2.next = 43;
               break;
             }
             chunk = _step2.value;
+            if (isStillActive()) {
+              _context2.next = 28;
+              break;
+            }
+            return _context2.abrupt("break", 43);
+          case 28:
             if (!(((_currentQARef$current2 = currentQARef.current.response) === null || _currentQARef$current2 === void 0 ? void 0 : _currentQARef$current2.msgStatus) === 'interrupted')) {
-              _context2.next = 31;
+              _context2.next = 32;
               break;
             }
             (_currentQARef$current3 = currentQARef.current.abortController) === null || _currentQARef$current3 === void 0 || _currentQARef$current3.abort();
-            if (currentApiOptions.cancel) {
-              currentApiOptions.cancel({
-                session_id: getCurrentSessionId()
-              });
+            // Cancel was already sent by handleCancel; don't repeat it here.
+
+            if (isStillActive() && currentQARef.current.response) {
+              currentQARef.current.response.cards = [{
+                code: 'AgentScopeRuntimeResponseCard',
+                data: agentScopeRuntimeResponseBuilder.cancel()
+              }];
+              updateMessage(currentQARef.current.response);
             }
-            currentQARef.current.response.cards = [{
-              code: 'AgentScopeRuntimeResponseCard',
-              data: agentScopeRuntimeResponseBuilder.cancel()
-            }];
-            updateMessage(currentQARef.current.response);
-            return _context2.abrupt("break", 40);
-          case 31:
+            return _context2.abrupt("break", 43);
+          case 32:
             responseParser = apiOptionsRef.current.responseParser || JSON.parse;
             chunkData = responseParser(chunk.data);
             _res = agentScopeRuntimeResponseBuilder.handle(chunkData);
-            if (!(_res.status !== AgentScopeRuntimeRunStatus.Failed && !((_res$output = _res.output) !== null && _res$output !== void 0 && (_res$output = _res$output[0]) !== null && _res$output !== void 0 && (_res$output = _res$output.content) !== null && _res$output !== void 0 && _res$output.length))) {
-              _context2.next = 36;
+            if (!(_res.status !== AgentScopeRuntimeRunStatus.Failed && !((_res$output = _res.output) !== null && _res$output !== void 0 && _res$output.some(function (msg) {
+              var _msg$content;
+              return (_msg$content = msg.content) === null || _msg$content === void 0 ? void 0 : _msg$content.length;
+            })))) {
+              _context2.next = 37;
+              break;
+            }
+            return _context2.abrupt("continue", 40);
+          case 37:
+            if (isStillActive()) {
+              _context2.next = 39;
               break;
             }
-            return _context2.abrupt("continue", 37);
-          case 36:
+            return _context2.abrupt("break", 43);
+          case 39:
             if (currentQARef.current.response) {
               currentQARef.current.response.cards = [{
                 code: 'AgentScopeRuntimeResponseCard',
@@ -200,95 +227,101 @@ export default function useChatRequest(options) {
                 updateMessage(currentQARef.current.response);
               }
             }
-          case 37:
+          case 40:
             _iteratorAbruptCompletion2 = false;
-            _context2.next = 21;
+            _context2.next = 22;
             break;
-          case 40:
-            _context2.next = 46;
+          case 43:
+            _context2.next = 49;
             break;
-          case 42:
-            _context2.prev = 42;
-            _context2.t1 = _context2["catch"](19);
+          case 45:
+            _context2.prev = 45;
+            _context2.t1 = _context2["catch"](20);
             _didIteratorError2 = true;
             _iteratorError2 = _context2.t1;
-          case 46:
-            _context2.prev = 46;
-            _context2.prev = 47;
+          case 49:
+            _context2.prev = 49;
+            _context2.prev = 50;
             if (!(_iteratorAbruptCompletion2 && _iterator2.return != null)) {
-              _context2.next = 51;
+              _context2.next = 54;
               break;
             }
-            _context2.next = 51;
+            _context2.next = 54;
             return _iterator2.return();
-          case 51:
-            _context2.prev = 51;
+          case 54:
+            _context2.prev = 54;
             if (!_didIteratorError2) {
-              _context2.next = 54;
+              _context2.next = 57;
               break;
             }
             throw _iteratorError2;
-          case 54:
-            return _context2.finish(51);
-          case 55:
-            return _context2.finish(46);
-          case 56:
-            _context2.next = 61;
-            break;
+          case 57:
+            return _context2.finish(54);
           case 58:
-            _context2.prev = 58;
-            _context2.t2 = _context2["catch"](16);
+            return _context2.finish(49);
+          case 59:
+            _context2.next = 66;
+            break;
+          case 61:
+            _context2.prev = 61;
+            _context2.t2 = _context2["catch"](17);
+            if (isStillActive()) {
+              _context2.next = 65;
+              break;
+            }
+            return _context2.abrupt("return");
+          case 65:
             if (((_currentQARef$current4 = currentQARef.current.response) === null || _currentQARef$current4 === void 0 ? void 0 : _currentQARef$current4.msgStatus) === 'interrupted') {
-              if (currentApiOptions.cancel) {
-                currentApiOptions.cancel({
-                  session_id: getCurrentSessionId()
-                });
+              // Cancel was already sent by handleCancel; don't repeat it here.
+              if (currentQARef.current.response) {
+                currentQARef.current.response.cards = [{
+                  code: 'AgentScopeRuntimeResponseCard',
+                  data: agentScopeRuntimeResponseBuilder.cancel()
+                }];
+                updateMessage(currentQARef.current.response);
               }
-              currentQARef.current.response.cards = [{
-                code: 'AgentScopeRuntimeResponseCard',
-                data: agentScopeRuntimeResponseBuilder.cancel()
-              }];
-              updateMessage(currentQARef.current.response);
             } else {
               console.error(_context2.t2);
             }
-          case 61:
+          case 66:
           case "end":
             return _context2.stop();
         }
-      }, _callee2, null, [[3, 11], [16, 58], [19, 42, 46, 56], [47,, 51, 55]]);
+      }, _callee2, null, [[4, 12], [17, 61], [20, 45, 49, 59], [50,, 54, 58]]);
     }));
-    return function (_x2) {
+    return function (_x2, _x3, _x4) {
       return _ref2.apply(this, arguments);
     };
   }(), [getCurrentSessionId, currentQARef, updateMessage, onFinish]);
   var request = useCallback( /*#__PURE__*/function () {
-    var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3(historyMessages, biz_params) {
-      var _currentQARef$current5;
-      var currentApiOptions, _currentApiOptions$en, enableHistoryMessages, abortSignal, response;
+    var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3(historyMessages, biz_params, myRequestId) {
+      var _currentQARef$current5, _currentQARef$current6;
+      var currentApiOptions, _currentApiOptions$en, enableHistoryMessages, abortSignal, requestId, sessionId, response;
       return _regeneratorRuntime().wrap(function _callee3$(_context3) {
         while (1) switch (_context3.prev = _context3.next) {
           case 0:
             currentApiOptions = apiOptionsRef.current;
             _currentApiOptions$en = currentApiOptions.enableHistoryMessages, enableHistoryMessages = _currentApiOptions$en === void 0 ? false : _currentApiOptions$en;
             abortSignal = (_currentQARef$current5 = currentQARef.current.abortController) === null || _currentQARef$current5 === void 0 ? void 0 : _currentQARef$current5.signal;
-            _context3.prev = 3;
+            requestId = myRequestId !== null && myRequestId !== void 0 ? myRequestId : currentQARef.current.activeRequestId;
+            sessionId = (_currentQARef$current6 = currentQARef.current.activeSessionId) !== null && _currentQARef$current6 !== void 0 ? _currentQARef$current6 : getCurrentSessionId();
+            _context3.prev = 5;
             if (!currentApiOptions.fetch) {
-              _context3.next = 10;
+              _context3.next = 12;
               break;
             }
-            _context3.next = 7;
+            _context3.next = 9;
             return currentApiOptions.fetch({
               input: historyMessages,
               biz_params: biz_params,
               signal: abortSignal
             });
-          case 7:
+          case 9:
             _context3.t0 = _context3.sent;
-            _context3.next = 13;
+            _context3.next = 15;
             break;
-          case 10:
-            _context3.next = 12;
+          case 12:
+            _context3.next = 14;
             return fetch(currentApiOptions.baseURL, {
               method: 'POST',
               headers: {
@@ -303,36 +336,36 @@ export default function useChatRequest(options) {
               }),
               signal: abortSignal
             });
-          case 12:
+          case 14:
             _context3.t0 = _context3.sent;
-          case 13:
+          case 15:
             response = _context3.t0;
-            _context3.next = 18;
+            _context3.next = 20;
             break;
-          case 16:
-            _context3.prev = 16;
-            _context3.t1 = _context3["catch"](3);
           case 18:
+            _context3.prev = 18;
+            _context3.t1 = _context3["catch"](5);
+          case 20:
             if (!(response && response.body)) {
-              _context3.next = 21;
+              _context3.next = 23;
               break;
             }
-            _context3.next = 21;
-            return processSSEResponse(response);
-          case 21:
+            _context3.next = 23;
+            return processSSEResponse(response, requestId, sessionId);
+          case 23:
           case "end":
             return _context3.stop();
         }
-      }, _callee3, null, [[3, 16]]);
+      }, _callee3, null, [[5, 18]]);
     }));
-    return function (_x3, _x4) {
+    return function (_x5, _x6, _x7) {
       return _ref3.apply(this, arguments);
     };
   }(), [getCurrentSessionId, currentQARef, processSSEResponse]);
   var reconnect = useCallback( /*#__PURE__*/function () {
-    var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee4(sessionId) {
-      var _currentQARef$current6;
-      var currentApiOptions, abortSignal, response;
+    var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee4(sessionId, myRequestId) {
+      var _currentQARef$current7;
+      var currentApiOptions, abortSignal, requestId, response;
       return _regeneratorRuntime().wrap(function _callee4$(_context4) {
         while (1) switch (_context4.prev = _context4.next) {
           case 0:
@@ -343,34 +376,35 @@ export default function useChatRequest(options) {
             }
             return _context4.abrupt("return");
           case 3:
-            abortSignal = (_currentQARef$current6 = currentQARef.current.abortController) === null || _currentQARef$current6 === void 0 ? void 0 : _currentQARef$current6.signal;
-            _context4.prev = 4;
-            _context4.next = 7;
+            abortSignal = (_currentQARef$current7 = currentQARef.current.abortController) === null || _currentQARef$current7 === void 0 ? void 0 : _currentQARef$current7.signal;
+            requestId = myRequestId !== null && myRequestId !== void 0 ? myRequestId : currentQARef.current.activeRequestId;
+            _context4.prev = 5;
+            _context4.next = 8;
             return currentApiOptions.reconnect({
               session_id: sessionId,
               signal: abortSignal
             });
-          case 7:
+          case 8:
             response = _context4.sent;
-            _context4.next = 12;
+            _context4.next = 13;
             break;
-          case 10:
-            _context4.prev = 10;
-            _context4.t0 = _context4["catch"](4);
-          case 12:
+          case 11:
+            _context4.prev = 11;
+            _context4.t0 = _context4["catch"](5);
+          case 13:
             if (!(response && response.body)) {
-              _context4.next = 15;
+              _context4.next = 16;
               break;
             }
-            _context4.next = 15;
-            return processSSEResponse(response);
-          case 15:
+            _context4.next = 16;
+            return processSSEResponse(response, requestId, sessionId);
+          case 16:
           case "end":
             return _context4.stop();
         }
-      }, _callee4, null, [[4, 10]]);
+      }, _callee4, null, [[5, 11]]);
     }));
-    return function (_x5) {
+    return function (_x8, _x9) {
       return _ref4.apply(this, arguments);
     };
   }(), [currentQARef, processSSEResponse]);

package/lib/AgentScopeRuntimeWebUI/core/types/IChatAnywhere.d.ts

@@ -58,6 +58,15 @@ export interface IAgentScopeRuntimeWebUIAPIOptions {
      * @descriptionEn Custom media URL transformer (e.g. sign URL, replace CDN domain)
      */
     replaceMediaURL?: (url: string) => string;
+    /**
+     * @description 自定义文件点击事件（桌面端可通过此钩子调用原生 API 打开文件链接），不传则默认 window.open
+     * @descriptionEn Custom file click handler (desktop apps can use native APIs to open file URLs), defaults to window.open
+     */
+    onFileCardClick?: (file: {
+        url?: string;
+        name?: string;
+        size?: number;
+    }) => void;
 }
 /**
  * @description 主题配置选项
@@ -411,6 +420,10 @@ export interface IAgentScopeRuntimeWebUIRequestActionsOptions {
      */
     list?: {
         icon?: React.ReactElement;
+        children?: React.ReactElement;
+        render?: ({ data }: {
+            data: IAgentScopeRuntimeRequest;
+        }) => React.ReactElement;
         onClick?: ({ data }: {
             data: IAgentScopeRuntimeRequest;
         }) => void;
@@ -423,6 +436,7 @@ export interface IAgentScopeRuntimeWebUIActionsOptions {
      */
     list: {
         icon?: React.ReactElement;
+        children?: React.ReactElement;
         render?: ({ data, }: {
             data: IAgentScopeRuntimeResponse;
         }) => React.ReactElement;
@@ -436,6 +450,7 @@ export interface IAgentScopeRuntimeWebUIActionsOptions {
      */
     right?: false | {
         icon?: React.ReactElement;
+        children?: React.ReactElement;
         render?: ({ data }: {
             data: IAgentScopeRuntimeResponse;
         }) => React.ReactElement;

package/lib/DefaultCards/Files/index.js

@@ -45,7 +45,11 @@ export default function Files(props) {
           }), fileInfo.url && /*#__PURE__*/_jsx("div", {
             className: "".concat(prefixCls, "-download"),
             onClick: function onClick() {
-              window.open(fileInfo.url, '_blank');
+              if (props.onClick) {
+                props.onClick(fileInfo);
+              } else {
+                window.open(fileInfo.url, '_blank');
+              }
             },
             children: /*#__PURE__*/_jsx(SparkDownloadLine, {})
           })]

package/lib/Markdown/Markdown.js

@@ -110,6 +110,7 @@ export default /*#__PURE__*/memo(function (props) {
       renderer: {
         html: function html(token) {
           var text = token.text || token.raw || '';
+          if (/^<br\s*\/?>$/i.test(text.trim())) return '<br />';
           return text.replace(/</g, '&lt;').replace(/>/g, '&gt;');
         }
       }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@agentscope-ai/chat",
-  "version": "1.1.65",
+  "version": "1.1.67",
   "description": "a free and open-source chat framework for building excellent LLM-powered chat experiences",
   "license": "Apache-2.0",
   "sideEffects": [

package/bin/starter_webui/README.md

@@ -1,75 +0,0 @@
-# agentscope-runtime-starter-webui
-
-## node version
-
-> =22
-
-## install
-
-```
-$ npm run install
-```
-
-## dev
-
-```
-$ npm run dev
-```
-
-## build
-
-```
-$ npm run build
-```
-
-## Core Code
-```tsx
-import { AgentScopeRuntimeWebUI } from '@agentscope-ai/chat';
-
-const options = {
-  theme: {
-    colorPrimary: '#615CED',
-    darkMode: true,
-    prefix: 'agentscope-runtime-webui',
-    leftHeader: {
-      logo: 'https://img.alicdn.com/imgextra/i2/O1CN01lmoGYn1kjoXATy4PX_!!6000000004720-2-tps-200-200.png',
-      title: 'Runtime WebUI',
-    },
-  },
-  sender: {
-    maxLength: 10000,
-    disclaimer:
-      'AI can also make mistakes, so please check carefully and use it with caution',
-  },
-
-  welcome: {
-    greeting: 'Hello, how can I help you today?',
-    description:
-      'I am a helpful assistant that can help you with your questions.',
-    avatar:
-      'https://img.alicdn.com/imgextra/i2/O1CN01lmoGYn1kjoXATy4PX_!!6000000004720-2-tps-200-200.png',
-    prompts: [
-      {
-        value: 'Hello',
-      },
-      {
-        value: 'How are you?',
-      },
-      {
-        value: 'What can you do?',
-      },
-    ],
-  },
-  api: {
-    baseURL: 'YOUR_API_URL',
-    token: 'YOUR_API_TOKEN', // is not required
-  },
-};
-
-
-<AgentScopeRuntimeWebUI
-  options={options}
-/>
-
-
-```

package/bin/starter_webui/eslint.config.js

@@ -1,28 +0,0 @@
-import js from '@eslint/js'
-import globals from 'globals'
-import reactHooks from 'eslint-plugin-react-hooks'
-import reactRefresh from 'eslint-plugin-react-refresh'
-import tseslint from 'typescript-eslint'
-
-export default tseslint.config(
-  { ignores: ['dist'] },
-  {
-    extends: [js.configs.recommended, ...tseslint.configs.recommended],
-    files: ['**/*.{ts,tsx}'],
-    languageOptions: {
-      ecmaVersion: 2020,
-      globals: globals.browser,
-    },
-    plugins: {
-      'react-hooks': reactHooks,
-      'react-refresh': reactRefresh,
-    },
-    rules: {
-      ...reactHooks.configs.recommended.rules,
-      'react-refresh/only-export-components': [
-        'warn',
-        { allowConstantExport: true },
-      ],
-    },
-  },
-)

package/bin/starter_webui/index.html

@@ -1,12 +0,0 @@
-<!doctype html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>AgentScope Runtime Starter WebUI</title>
-  </head>
-  <body>
-    <div id="root"></div>
-    <script type="module" src="/src/main.tsx"></script>
-  </body>
-</html>

package/bin/starter_webui/package.json

@@ -1,34 +0,0 @@
-{
-  "name": "agentscope-runtime-starter-webui",
-  "private": true,
-  "version": "0.0.0",
-  "type": "module",
-  "scripts": {
-    "dev": "vite --host",
-    "build": "tsc -b && vite build",
-    "lint": "eslint .",
-    "preview": "vite preview"
-  },
-  "dependencies": {
-    "@agentscope-ai/icons": "^1.0.46",
-    "@agentscope-ai/chat": "^1.1.44",
-    "@agentscope-ai/design": "^1.0.19",
-    "antd": "^5.29.1",
-    "antd-style": "^3.7.1",
-    "react": "^18",
-    "react-dom": "^18"
-  },
-  "devDependencies": {
-    "@eslint/js": "^9.25.0",
-    "@types/react": "^18",
-    "@types/react-dom": "^18",
-    "@vitejs/plugin-react": "^4.4.1",
-    "eslint": "^9.25.0",
-    "eslint-plugin-react-hooks": "^5.2.0",
-    "eslint-plugin-react-refresh": "^0.4.19",
-    "globals": "^16.0.0",
-    "typescript": "~5.8.3",
-    "typescript-eslint": "^8.30.1",
-    "vite": "^6.3.5"
-  }
-}

package/bin/starter_webui/src/App.tsx

@@ -1,20 +0,0 @@
-import Chat from './components/Chat';
-
-import { createGlobalStyle } from 'antd-style';
-
-
-const GlobalStyle = createGlobalStyle`
-* {
-  margin: 0;
-  box-sizing: border-box;
-}
-`;
-
-function App() {
-  return <>
-    <GlobalStyle />
-    <Chat />
-  </>
-}
-
-export default App