diff options
Diffstat (limited to 'app/javascript/mastodon/features/ui/components/notifications_counter_icon.js')
-rw-r--r-- | app/javascript/mastodon/features/ui/components/notifications_counter_icon.js | 23 |
1 files changed, 23 insertions, 0 deletions
diff --git a/app/javascript/mastodon/features/ui/components/notifications_counter_icon.js b/app/javascript/mastodon/features/ui/components/notifications_counter_icon.js new file mode 100644 index 000000000..deb907866 --- /dev/null +++ b/app/javascript/mastodon/features/ui/components/notifications_counter_icon.js @@ -0,0 +1,23 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import { connect } from 'react-redux'; +import Icon from 'mastodon/components/icon'; + +const mapStateToProps = state => ({ + count: state.getIn(['notifications', 'unread']), +}); + +const formatNumber = num => num > 99 ? '99+' : num; + +const NotificationsCounterIcon = ({ count }) => ( + <i className='icon-with-badge'> + <Icon id='bell' fixedWidth /> + {count > 0 && <i className='icon-with-badge__badge'>{formatNumber(count)}</i>} + </i> +); + +NotificationsCounterIcon.propTypes = { + count: PropTypes.number.isRequired, +}; + +export default connect(mapStateToProps)(NotificationsCounterIcon); |