2019-02-26 15:22:12 +01:00
|
|
|
import React from 'react'
|
|
|
|
import cx from 'classnames'
|
|
|
|
import { User } from '../../../context/User'
|
|
|
|
import styles from './Indicator.module.scss'
|
|
|
|
|
|
|
|
const Indicator = ({
|
|
|
|
className,
|
2019-02-27 00:26:53 +01:00
|
|
|
togglePopover
|
2019-02-26 15:22:12 +01:00
|
|
|
}: {
|
|
|
|
className?: string
|
2019-02-28 17:12:48 +01:00
|
|
|
togglePopover: () => void
|
2019-02-26 15:22:12 +01:00
|
|
|
}) => (
|
|
|
|
<div
|
|
|
|
className={cx(styles.status, className)}
|
2019-02-27 00:26:53 +01:00
|
|
|
onMouseOver={togglePopover}
|
|
|
|
onMouseOut={togglePopover}
|
2019-02-26 15:22:12 +01:00
|
|
|
>
|
|
|
|
<User.Consumer>
|
|
|
|
{states =>
|
|
|
|
!states.isWeb3 ? (
|
|
|
|
<span className={styles.statusIndicator} />
|
|
|
|
) : !states.isLogged ? (
|
|
|
|
<span className={styles.statusIndicatorCloseEnough} />
|
|
|
|
) : states.isLogged ? (
|
|
|
|
<span className={styles.statusIndicatorActive} />
|
|
|
|
) : null
|
|
|
|
}
|
|
|
|
</User.Consumer>
|
|
|
|
</div>
|
|
|
|
)
|
|
|
|
|
|
|
|
export default Indicator
|