45 lines
1,000 B
JavaScript
45 lines
1,000 B
JavaScript
import React from "react";
|
|
import Link from "component/link";
|
|
|
|
class SnackBar extends React.Component {
|
|
constructor(props) {
|
|
super(props);
|
|
|
|
this._displayTime = 5; // in seconds
|
|
this._hideTimeout = null;
|
|
}
|
|
|
|
render() {
|
|
const { navigate, snacks, removeSnack } = this.props;
|
|
|
|
if (!snacks.length) {
|
|
this._hideTimeout = null; //should be unmounting anyway, but be safe?
|
|
return null;
|
|
}
|
|
|
|
const snack = snacks[0];
|
|
const { message, linkText, linkTarget } = snack;
|
|
|
|
if (this._hideTimeout === null) {
|
|
this._hideTimeout = setTimeout(() => {
|
|
this._hideTimeout = null;
|
|
removeSnack();
|
|
}, this._displayTime * 1000);
|
|
}
|
|
|
|
return (
|
|
<div className="snack-bar">
|
|
{message}
|
|
{linkText &&
|
|
linkTarget &&
|
|
<Link
|
|
onClick={() => navigate(linkTarget)}
|
|
className="snack-bar__action"
|
|
label={linkText}
|
|
/>}
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
export default SnackBar;
|