2024-01-03 17:34:26 +08:00
|
|
|
import {OverlayTrigger, Tooltip} from "react-bootstrap";
|
2024-01-15 15:51:04 +08:00
|
|
|
import React, {useEffect, useState} from "react";
|
2024-01-03 17:34:26 +08:00
|
|
|
|
2024-01-15 15:51:04 +08:00
|
|
|
export function Notification({id, tip, content, sideMenuIsOpen}) {
|
2024-01-15 12:28:07 +08:00
|
|
|
const [show, setShow] = useState(false);
|
|
|
|
|
|
|
|
useEffect(() => {
|
|
|
|
setTimeout(() => {
|
|
|
|
setShow(true)
|
|
|
|
}, 100);
|
|
|
|
|
|
|
|
setTimeout(() => {
|
|
|
|
setShow(false)
|
|
|
|
}, 5000);
|
|
|
|
}, []);
|
2024-01-05 13:15:43 +08:00
|
|
|
|
2024-01-03 17:34:26 +08:00
|
|
|
return (
|
2024-01-15 12:28:07 +08:00
|
|
|
<OverlayTrigger
|
|
|
|
placement="top"
|
|
|
|
trigger={["click", "hover"]}
|
2024-01-05 13:15:43 +08:00
|
|
|
style={{display: 'inline'}}
|
2024-01-15 12:28:07 +08:00
|
|
|
show={show}
|
|
|
|
onToggle={() => setShow(false)}
|
2024-01-03 17:34:26 +08:00
|
|
|
overlay={<Tooltip id={id}>{tip}</Tooltip>}
|
2024-01-15 15:51:04 +08:00
|
|
|
rootClose={!sideMenuIsOpen}
|
2024-01-03 17:34:26 +08:00
|
|
|
>
|
2024-01-15 12:28:07 +08:00
|
|
|
{content}
|
|
|
|
</OverlayTrigger>
|
2024-01-03 17:34:26 +08:00
|
|
|
)
|
|
|
|
}
|