added system notification (#3118)

frontend/src/components/system-notification.js

@@ -0,0 +1,52 @@
+import React from 'react';
+import { curNoteMsg, curNoteID, siteRoot, gettext } from '../utils/constants'; 
+
+import '../css/system-notification.css';
+
+class SystemNotification extends React.Component {
+
+  constructor(props) {
+    super(props);
+    this.state = {
+      isClosed: false
+    };
+  }
+
+  close = () => {
+    this.setState({isClosed: true});
+
+    if (navigator.cookieEnabled) {
+      let date = new Date(),
+        cookies = document.cookie.split('; '),
+        infoIDExist = false,
+        newInfoID = curNoteID + '_';
+      date.setTime(date.getTime() + 14*24*60*60*1000);
+      newInfoID += '; expires=' + date.toGMTString() + '; path=' + siteRoot;
+      for (var i = 0, len = cookies.length; i < len; i++) {
+        if (cookies[i].split('=')[0] == 'info_id') {
+          infoIDExist = true;
+          document.cookie = 'info_id=' + cookies[i].split('=')[1] + newInfoID;
+          break;
+        }
+      }
+      if (!infoIDExist) {
+        document.cookie = 'info_id=' + newInfoID;
+      }
+    }
+  }
+  
+  render() {
+    if (!curNoteMsg || this.state.isClosed) {
+      return null;
+    }
+
+    return (
+      <div id="info-bar">
+        <p id="info-bar-info">{curNoteMsg}</p>
+        <span className="close sf2-icon-x1" title={gettext('Close')} onClick={this.close}></span>
+      </div>
+    );
+  }
+}
+
+export default SystemNotification;