github.com/pyroscope-io/pyroscope@v0.37.3-0.20230725203016-5f6947968bd0/webapp/javascript/components/Notifications.jsx (about)

     1  import React, { useState, useEffect } from 'react';
     2  import { connect } from 'react-redux';
     3  import 'react-dom';
     4  
     5  import Modal from 'react-modal';
     6  import clsx from 'clsx';
     7  
     8  import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
     9  import { faExclamationTriangle } from '@fortawesome/free-solid-svg-icons/faExclamationTriangle';
    10  
    11  function Notifications(props) {
    12    const { notificationText } = window;
    13  
    14    const [hidden, setHidden] = useState(notificationText === '');
    15  
    16    return (
    17      <div className={clsx('notifications', { hidden })}>
    18        <div className="notifications-container">
    19          <div className="notification-icon">
    20            <FontAwesomeIcon icon={faExclamationTriangle} />
    21          </div>
    22          <div className="notification-body">{notificationText}</div>
    23          <div
    24            className="notification-close-btn"
    25            onClick={function () {
    26              setHidden(true);
    27            }}
    28          />
    29        </div>
    30      </div>
    31    );
    32  }
    33  
    34  export default connect((x) => x, {})(Notifications);