Self Closing Notification

notification.jsx

class Notification extends Component {
  constructor(props) {
    super(props);
    this.removeNoti = this.removeNoti.bind(this);
  }

  componentDidMount() {
    this.timeout = setTimeout(this.removeNoti, 4000);
  }

  shouldComponentUpdate(nextProps) {
    return this.props.notification !== nextProps.notification;
  }

  componentWillUnmount() {
    clearTimeout(this.timeout);
  }

  removeNoti() {
    const {removeNoti, notification} = this.props;
    removeNoti(notification.id);
  }

  render() {
    const {notification} = this.props;
    return (
      <Noti type={notification.type} onClick={this.removeNoti}>
        <Message>
          {notification.message}
        </Message>
        <Button onClick={this.removeNoti}>
          Close
        </Button>
      </Noti>
    );
  }
}