style: error message toast

2026-02-12 12:20:05 +08:00
parent 932c30cd7f
commit b21fe0ac4c
3 changed files with 62 additions and 33 deletions
@@ -0,0 +1,44 @@
+import { CheckCircleFilled, CopyOutlined } from '@ant-design/icons';
+import { Typography } from 'antd';
+import styled from 'styled-components';
+
+const Content = styled.div`
+  position: relative;
+  .cp-btn {
+    position: absolute;
+    top: 0px;
+    right: -4px;
+    display: none;
+  }
+  &:hover .cp-btn {
+    display: inline-block;
+  }
+  .msg {
+    display: none;
+  }
+`;
+
+const ErrorMessageContent: React.FC<{ errMsg: string }> = ({ errMsg }) => {
+  return (
+    <Content>
+      <Typography.Text
+        className="cp-btn"
+        copyable={{
+          text: errMsg,
+          icon: [
+            <CopyOutlined style={{ fontSize: 14 }} key="copy" />,
+            <CheckCircleFilled
+              style={{ color: 'var(--ant-color-success)', fontSize: 14 }}
+              key="copied"
+            />
+          ]
+        }}
+      >
+        <span className="msg">{errMsg}</span>
+      </Typography.Text>
+      {errMsg}
+    </Content>
+  );
+};
+
+export default ErrorMessageContent;