style: playground button tips

src/pages/playground/components/ground-left.tsx

@@ -4,7 +4,7 @@ import useContainerScroll from '@/hooks/use-container-scorll';
 import { fetchChunkedData, readStreamData } from '@/utils/fetch-chunk-data';
 import { EyeInvisibleOutlined, EyeOutlined } from '@ant-design/icons';
 import { useIntl } from '@umijs/max';
-import { Button, Input, Spin } from 'antd';
+import { Button, Input, Spin, Tooltip } from 'antd';
 import _ from 'lodash';
 import { useEffect, useRef, useState } from 'react';
 import { useHotkeys } from 'react-hotkeys-hook';
@@ -189,9 +189,17 @@ const MessageList: React.FC<MessageProps> = (props) => {
         <span className="title">
           {intl.formatMessage({ id: 'playground.system' })}
         </span>
-        <Button size="small">
-          {collapsed ? <EyeInvisibleOutlined /> : <EyeOutlined />}
-        </Button>
+        <Tooltip
+          title={
+            collapsed
+              ? intl.formatMessage({ id: 'common.button.collapse' })
+              : intl.formatMessage({ id: 'common.button.expand' })
+          }
+        >
+          <Button size="small">
+            {collapsed ? <EyeInvisibleOutlined /> : <EyeOutlined />}
+          </Button>
+        </Tooltip>
       </div>
     );
   };

src/pages/playground/components/message-item.tsx

@@ -2,7 +2,7 @@ import CopyButton from '@/components/copy-button';
 import HotKeys from '@/config/hotkeys';
 import { MinusCircleOutlined } from '@ant-design/icons';
 import { useIntl } from '@umijs/max';
-import { Button, Input, Space } from 'antd';
+import { Button, Input, Space, Tooltip } from 'antd';
 import { useEffect, useRef, useState } from 'react';
 import { useHotkeys } from 'react-hotkeys-hook';
 import { Roles } from '../config';
@@ -130,11 +130,13 @@ const MessageItem: React.FC<{
               fontSize="12px"
             ></CopyButton>
           )}
-          <Button
-            size="small"
-            onClick={handleDelete}
-            icon={<MinusCircleOutlined />}
-          ></Button>
+          <Tooltip title={intl.formatMessage({ id: 'common.button.delete' })}>
+            <Button
+              size="small"
+              onClick={handleDelete}
+              icon={<MinusCircleOutlined />}
+            ></Button>
+          </Tooltip>
         </Space>
       </div>
     </div>