forked from M-Labs/web2019
31 lines
836 B
JavaScript
31 lines
836 B
JavaScript
import {OverlayTrigger, Tooltip} from "react-bootstrap";
|
|
import React, {useEffect, useState, useRef} from "react";
|
|
import {useClickAway} from "./useClickAway";
|
|
|
|
export function Notification({id, tip, content}) {
|
|
const [show, setShow] = useState(false);
|
|
|
|
useEffect(() => {
|
|
setTimeout(() => {
|
|
setShow(true)
|
|
}, 100);
|
|
|
|
setTimeout(() => {
|
|
setShow(false)
|
|
}, 5000);
|
|
}, []);
|
|
|
|
return (
|
|
<OverlayTrigger
|
|
placement="top"
|
|
trigger={["click", "hover"]}
|
|
style={{display: 'inline'}}
|
|
show={show}
|
|
onToggle={() => setShow(false)}
|
|
overlay={<Tooltip id={id}>{tip}</Tooltip>}
|
|
rootClose
|
|
>
|
|
{content}
|
|
</OverlayTrigger>
|
|
)
|
|
} |