diff --git a/src/NotificationContainer.js b/src/NotificationContainer.js index 431d11b..e89ed79 100644 --- a/src/NotificationContainer.js +++ b/src/NotificationContainer.js @@ -1,53 +1,41 @@ -import React from 'react'; +import React, { useState, useEffect } from 'react'; import PropTypes from 'prop-types'; import NotificationManager from './NotificationManager'; import Notifications from './Notifications'; -class NotificationContainer extends React.Component { - static propTypes = { - enterTimeout: PropTypes.number, - leaveTimeout: PropTypes.number - }; - - static defaultProps = { - enterTimeout: 400, - leaveTimeout: 400 - }; - - state = { - notifications: [] - }; +const NotificationContainer = ({ + enterTimeout = 400, + leaveTimeout = 400 +}) => { + const [notifications, setNotifications] = useState([]); - componentWillMount = () => { - NotificationManager.addChangeListener(this.handleStoreChange); - }; + useEffect(() => { + NotificationManager.addChangeListener(handleStoreChange); - componentWillUnmount = () => { - NotificationManager.removeChangeListener(this.handleStoreChange); - }; + NotificationManager.removeChangeListener(handleStoreChange); + }); - handleStoreChange = (notifications) => { - this.setState({ - notifications - }); + const handleStoreChange = newNotifications => { + setNotifications(newNotifications) }; - handleRequestHide = (notification) => { + const handleRequestHide = (notification) => { NotificationManager.remove(notification); }; - render() { - const { notifications } = this.state; - const { enterTimeout, leaveTimeout } = this.props; - return ( - - ); - } + return ( + + ); } +NotificationContainer.propTypes = { + enterTimeout: PropTypes.number, + leaveTimeout: PropTypes.number +}; + export default NotificationContainer;