fix: copy button not work

src/components/copy-button/index.tsx

@@ -1,6 +1,8 @@
-import useCopyToClipboard from '@/hooks/use-copy-to-clipboard';
 import { CheckCircleFilled, CopyOutlined } from '@ant-design/icons';
-import { Button } from 'antd';
+import { useIntl } from '@umijs/max';
+import { Button, message } from 'antd';
+import ClipboardJS from 'clipboard';
+import { useEffect, useRef, useState } from 'react';
 
 type CopyButtonProps = {
   text: string;
@@ -21,19 +23,45 @@ const CopyButton: React.FC<CopyButtonProps> = ({
   style,
   size = 'middle'
 }) => {
-  const { copied, copyToClipboard } = useCopyToClipboard();
+  const intl = useIntl();
+  const [copied, setCopied] = useState(false);
+  const buttonRef = useRef(null);
+  const clipboardRef = useRef<any>(null);
 
-  const handleCopy = async (e: any) => {
-    e.stopPropagation();
-    await copyToClipboard(text);
+  const initClipboard = () => {
+    if (buttonRef.current) {
+      clipboardRef.current = new ClipboardJS(buttonRef.current);
+      clipboardRef.current.on('success', () => {
+        setCopied(true);
+        setTimeout(() => {
+          setCopied(false);
+        }, 3000);
+      });
+
+      clipboardRef.current.on('error', (e: any) => {
+        message.success(
+          intl.formatMessage({ id: 'common.copy.fail' }) as string
+        );
+        e.clearSelection();
+      });
+    }
   };
+
+  useEffect(() => {
+    initClipboard();
+    return () => {
+      clipboardRef.current?.destroy();
+    };
+  }, [buttonRef]);
+
   return (
     <Button
+      ref={buttonRef}
       type={type}
       shape={shape}
       size={size}
-      onClick={handleCopy}
       disabled={!!disabled}
+      data-clipboard-text={text}
       icon={
         copied ? (
           <CheckCircleFilled

src/locales/en-US/dashboard.ts

@@ -9,11 +9,11 @@ export default {
   'dashboard.memory': 'RAM',
   'dashboard.disk': 'Storage',
   'dashboard.vram': 'VRAM',
-  'dashboard.cpuutilization': 'CPU Utilization',
-  'dashboard.memoryutilization': 'RAM Utilization',
+  'dashboard.cpuutilization': 'Average CPU Utilization',
+  'dashboard.memoryutilization': 'Average RAM Utilization',
   'dashboard.diskutilization': 'Storage Utilization',
-  'dashboard.vramutilization': 'VRAM Utilization',
-  'dashboard.gpuutilization': 'GPU Utilization',
+  'dashboard.vramutilization': 'Average VRAM Utilization',
+  'dashboard.gpuutilization': 'Average GPU Utilization',
   'dashboard.usage': 'Usage',
   'dashboard.apirequest': 'API Requests',
   'dashboard.tokens': 'Token Usage',

src/locales/zh-CN/dashboard.ts

@@ -9,11 +9,11 @@ export default {
   'dashboard.memory': '内存',
   'dashboard.disk': '磁盘',
   'dashboard.vram': '显存',
-  'dashboard.cpuutilization': 'CPU 利用率',
-  'dashboard.memoryutilization': '内存利用率',
+  'dashboard.cpuutilization': '平均 CPU 利用率',
+  'dashboard.memoryutilization': '平均内存利用率',
   'dashboard.diskutilization': '磁盘利用率',
-  'dashboard.vramutilization': '显存利用率',
-  'dashboard.gpuutilization': 'GPU 利用率',
+  'dashboard.vramutilization': '平均显存利用率',
+  'dashboard.gpuutilization': '平均 GPU 利用率',
   'dashboard.usage': '使用量',
   'dashboard.apirequest': 'API 请求',
   'dashboard.tokens': 'Token 使用量',

src/pages/playground/components/view-code-modal.tsx

@@ -143,7 +143,7 @@ const ViewCodeModal: React.FC<ViewModalProps> = (props) => {
     readOnly: true,
     formatOnType: true,
     formatOnPaste: true,
-    fontWeight: 700,
+    fontWeight: 'bold',
     scrollbar: {
       verticalSliderSize: 8
     }