Add notification badge feature back
This commit is contained in:
parent
9ab030bb13
commit
6eede9d84b
|
@ -52,6 +52,8 @@ const messages = defineMessages({
|
||||||
const mapStateToProps = (state, ownProps) => ({
|
const mapStateToProps = (state, ownProps) => ({
|
||||||
columns: state.getIn(['settings', 'columns']),
|
columns: state.getIn(['settings', 'columns']),
|
||||||
showSearch: ownProps.multiColumn ? state.getIn(['search', 'submitted']) && !state.getIn(['search', 'hidden']) : false,
|
showSearch: ownProps.multiColumn ? state.getIn(['search', 'submitted']) && !state.getIn(['search', 'hidden']) : false,
|
||||||
|
unreadNotifications: state.getIn(['notifications', 'unread']),
|
||||||
|
showNotificationsBadge: state.getIn(['local_settings', 'notifications', 'tab_badge']),
|
||||||
});
|
});
|
||||||
|
|
||||||
// ~4% chance you'll end up with an unexpected friend
|
// ~4% chance you'll end up with an unexpected friend
|
||||||
|
@ -66,6 +68,8 @@ class Compose extends PureComponent {
|
||||||
columns: ImmutablePropTypes.list.isRequired,
|
columns: ImmutablePropTypes.list.isRequired,
|
||||||
multiColumn: PropTypes.bool,
|
multiColumn: PropTypes.bool,
|
||||||
showSearch: PropTypes.bool,
|
showSearch: PropTypes.bool,
|
||||||
|
unreadNotifications: PropTypes.number,
|
||||||
|
showNotificationsBadge: PropTypes.bool,
|
||||||
intl: PropTypes.object.isRequired,
|
intl: PropTypes.object.isRequired,
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -124,7 +128,7 @@ class Compose extends PureComponent {
|
||||||
};
|
};
|
||||||
|
|
||||||
render () {
|
render () {
|
||||||
const { multiColumn, showSearch, intl } = this.props;
|
const { multiColumn, showSearch, showNotificationsBadge, unreadNotifications, intl } = this.props;
|
||||||
|
|
||||||
const elefriend = [glitchedElephant1, glitchedElephant2, glitchedElephant3, elephantUIPlane][this.state.elefriend];
|
const elefriend = [glitchedElephant1, glitchedElephant2, glitchedElephant3, elephantUIPlane][this.state.elefriend];
|
||||||
|
|
||||||
|
@ -139,7 +143,12 @@ class Compose extends PureComponent {
|
||||||
<Link to='/home' className='drawer__tab' title={intl.formatMessage(messages.home_timeline)} aria-label={intl.formatMessage(messages.home_timeline)}><Icon id='home' icon={HomeIcon} /></Link>
|
<Link to='/home' className='drawer__tab' title={intl.formatMessage(messages.home_timeline)} aria-label={intl.formatMessage(messages.home_timeline)}><Icon id='home' icon={HomeIcon} /></Link>
|
||||||
)}
|
)}
|
||||||
{!columns.some(column => column.get('id') === 'NOTIFICATIONS') && (
|
{!columns.some(column => column.get('id') === 'NOTIFICATIONS') && (
|
||||||
<Link to='/notifications' className='drawer__tab' title={intl.formatMessage(messages.notifications)} aria-label={intl.formatMessage(messages.notifications)}><Icon id='bell' icon={NotificationsIcon} /></Link>
|
<Link to='/notifications' className='drawer__tab' title={intl.formatMessage(messages.notifications)} aria-label={intl.formatMessage(messages.notifications)}>
|
||||||
|
<span className='icon-badge-wrapper'>
|
||||||
|
<Icon id='bell' icon={NotificationsIcon} />
|
||||||
|
{showNotificationsBadge && unreadNotifications > 0 && <div className='icon-badge' />}
|
||||||
|
</span>
|
||||||
|
</Link>
|
||||||
)}
|
)}
|
||||||
{!columns.some(column => column.get('id') === 'COMMUNITY') && (
|
{!columns.some(column => column.get('id') === 'COMMUNITY') && (
|
||||||
<Link to='/public/local' className='drawer__tab' title={intl.formatMessage(messages.community)} aria-label={intl.formatMessage(messages.community)}><Icon id='users' icon={PeopleIcon} /></Link>
|
<Link to='/public/local' className='drawer__tab' title={intl.formatMessage(messages.community)} aria-label={intl.formatMessage(messages.community)}><Icon id='users' icon={PeopleIcon} /></Link>
|
||||||
|
|
Loading…
Reference in New Issue