diff options
Diffstat (limited to 'frontend/src/components/Notifications.js')
-rw-r--r-- | frontend/src/components/Notifications.js | 17 |
1 files changed, 15 insertions, 2 deletions
diff --git a/frontend/src/components/Notifications.js b/frontend/src/components/Notifications.js index 56a4508..92731d9 100644 --- a/frontend/src/components/Notifications.js +++ b/frontend/src/components/Notifications.js @@ -17,6 +17,7 @@ import React, {Component} from "react"; import dispatcher from "../dispatcher"; +import {randomClassName} from "../utils"; import "./Notifications.scss"; const _ = require("lodash"); @@ -30,9 +31,15 @@ class Notifications extends Component { }; componentDidMount() { - dispatcher.register("notifications", n => this.notificationHandler(n)); + dispatcher.register("notifications", this.handleNotifications); } + componentWillUnmount() { + dispatcher.unregister(this.handleNotifications); + } + + handleNotifications = (n) => this.notificationHandler(n); + notificationHandler = (n) => { switch (n.event) { case "connected": @@ -54,6 +61,11 @@ class Notifications extends Component { n.description = `existing rule updated: ${n.message["name"]}`; n.variant = "blue"; return this.pushNotification(n); + case "pcap.completed": + n.title = "new pcap analyzed"; + n.description = `${n.message["processed_packets"]} packets processed`; + n.variant = "blue"; + return this.pushNotification(n); default: return; } @@ -61,6 +73,7 @@ class Notifications extends Component { pushNotification = (notification) => { const notifications = this.state.notifications; + notification.id = randomClassName(); notifications.push(notification); this.setState({notifications}); setTimeout(() => { @@ -103,7 +116,7 @@ class Notifications extends Component { if (n.variant) { notificationClassnames[`notification-${n.variant}`] = true; } - return <div className={classNames(notificationClassnames)} onClick={n.onClick}> + return <div key={n.id} className={classNames(notificationClassnames)} onClick={n.onClick}> <h3 className="notification-title">{n.title}</h3> <pre className="notification-description">{n.description}</pre> </div>; |