github.com/grafviktor/keep-my-secret@v0.9.10-0.20230908165355-19f35cce90e5/website/src/components/Error/index.jsx (about)

     1  import cx from 'classnames'
     2  import {useContext, useEffect, useState} from 'react'
     3  import ApplicationContext from '../../context'
     4  
     5  import './style.css'
     6  
     7  export default ({message = '', view = ''}) => {
     8    const [isHidden, setHidden] = useState(true)
     9    const {setAlertMessage} = useContext(ApplicationContext)
    10  
    11    useEffect(() => {
    12      // There is no point to keep the alert message if we're moving to a different view
    13      setAlertMessage('')
    14    }, [view])
    15  
    16    useEffect(() => {
    17      if (message !== '') {
    18        setHidden(false)
    19      } else {
    20        setHidden(true)
    21      }
    22    }, [message])
    23  
    24    const onCloseButtonClick = (event) => {
    25      event.preventDefault()
    26      setAlertMessage('')
    27    }
    28  
    29    return (
    30      <div
    31        className={cx(
    32          'alert alert-danger alert-dismissible kms-alert show fade',
    33          {hidden: isHidden},
    34        )}
    35        role="alert"
    36      >
    37        <div>{message}</div>
    38  
    39        <button
    40          type="button"
    41          className="btn-close"
    42          aria-label="Close"
    43          onClick={onCloseButtonClick}
    44        />
    45      </div>
    46    )
    47  }