react-notification-system
react-notification-system copied to clipboard
Extend time left for same uid
Enhancement suggestion: besides preventing notification with same uid shown, it would be better there have an option to reset existing notification's remaining time with same uid.
eg. trigger Notification A with uid='notify-a' -> A shows, timeLeft = 5s delay(2s) trigger Notification A-clone with uid='notify-a' -> A.timeLeft = 5s
In other words, do you want to extend the time of a known and existing notification, right?
Maybe something like extendNotification(uid, time)?
Exactly.
+1 It might be interesting too send the same identifier but to accept changes to the text, type and title for example.
The scenario could be: uid: 1 -> connecting.... (5 sec) uid: 1 -> connecting (reset timer) uid: 1 -> connected
Is there any possibility to make this?
I like the idea of updating - this sounds like the right idea @gravitycode
I created a bus trough redux store. The idea is create channels based on topics. For each channel in which a notifier subscribe only one message is visualized. This is the more important feature. For example when we create a instance on NotificationSystem suscribed to topic "#websockets" we can send messages with this path and the NotificationSystem delete old messages and publish the new message.
Instance:
<Notifications channels={['#general', '#websocket']} notifications={this.props.notifications} onRemove={this.removeNotification}/>
Notifications Component:
function filterNotifications(channels, notifications) { var result = []; if(channels && channels.length > 0) { channels.forEach(ch => { result = _.concat(result, _.filter(notifications, {channel: ch})); }); }else { result = notifications; } return result; };
`
class Notifications extends Component {
system() {
return this.refs.notificationSystem;
}
removeNotificationsByChannel(notifications, channel, uid) {
if(channel) {
_.filter(notifications, {channel: channel})
.forEach((notification) => {
if(notification.uid !== uid){
this.system().removeNotification(notification);
}
});
}
}
componentWillReceiveProps(nextProps) {
var notifications = filterNotifications(this.props.channels, nextProps.notifications);
notifications.forEach((notification) => {
this.removeNotificationsByChannel(notifications, notification.channel, notification.uid);
this.system().addNotification({
...notification,
onRemove: () => {
this.props.onRemove(notification.uid);
}
});
});
}
render() {
return(
<NotificationSystem ref="notificationSystem"/>
)
}
};`
Sending messages (through redux actions):
sendNotification({ channel:"#websocket", title:'my title', message: 'my message', position:'br', autoDismiss:1, dismissible:true, level:"success" });