imeeting/components/Toast/Toast.tsx

82 lines
1.8 KiB
TypeScript

import { notification } from "antd";
import {
CheckCircleOutlined,
CloseCircleOutlined,
ExclamationCircleOutlined,
InfoCircleOutlined,
} from "@ant-design/icons";
notification.config({
placement: "topRight",
top: 24,
duration: 3,
maxCount: 3,
});
const Toast = {
success: (message: string, description = "", duration = 3) => {
notification.success({
message,
description,
duration,
icon: <CheckCircleOutlined style={{ color: "#52c41a" }} />,
style: {
borderRadius: "8px",
boxShadow: "0 4px 12px rgba(0, 0, 0, 0.15)",
},
});
},
error: (message: string, description = "", duration = 3) => {
notification.error({
message,
description,
duration,
icon: <CloseCircleOutlined style={{ color: "#ff4d4f" }} />,
style: {
borderRadius: "8px",
boxShadow: "0 4px 12px rgba(0, 0, 0, 0.15)",
},
});
},
warning: (message: string, description = "", duration = 3) => {
notification.warning({
message,
description,
duration,
icon: <ExclamationCircleOutlined style={{ color: "#faad14" }} />,
style: {
borderRadius: "8px",
boxShadow: "0 4px 12px rgba(0, 0, 0, 0.15)",
},
});
},
info: (message: string, description = "", duration = 3) => {
notification.info({
message,
description,
duration,
icon: <InfoCircleOutlined style={{ color: "#1677ff" }} />,
style: {
borderRadius: "8px",
boxShadow: "0 4px 12px rgba(0, 0, 0, 0.15)",
},
});
},
custom: (config: Record<string, any>) => {
notification.open({
...config,
style: {
borderRadius: "8px",
boxShadow: "0 4px 12px rgba(0, 0, 0, 0.15)",
...config.style,
},
});
},
};
export default Toast;