aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorWhymarrh Whitby <whymarrh.whitby@gmail.com>2018-09-09 07:06:19 +0800
committerWhymarrh Whitby <whymarrh.whitby@gmail.com>2018-09-09 07:20:31 +0800
commitdb241e6b914d301086f54bb62fb307519a8386ec (patch)
tree800087fb9de0beec5217879be4014e9cf8225064
parent7c3b69e1e495ed0d44cd1ed43db55828f3e05642 (diff)
downloadtangerine-wallet-browser-db241e6b914d301086f54bb62fb307519a8386ec.tar
tangerine-wallet-browser-db241e6b914d301086f54bb62fb307519a8386ec.tar.gz
tangerine-wallet-browser-db241e6b914d301086f54bb62fb307519a8386ec.tar.bz2
tangerine-wallet-browser-db241e6b914d301086f54bb62fb307519a8386ec.tar.lz
tangerine-wallet-browser-db241e6b914d301086f54bb62fb307519a8386ec.tar.xz
tangerine-wallet-browser-db241e6b914d301086f54bb62fb307519a8386ec.tar.zst
tangerine-wallet-browser-db241e6b914d301086f54bb62fb307519a8386ec.zip
Rewrite Tooltip component as ES6
-rw-r--r--ui/app/components/selected-account/selected-account.component.js2
-rw-r--r--ui/app/components/tooltip-v2.js81
-rw-r--r--ui/app/components/wallet-view.js2
3 files changed, 55 insertions, 30 deletions
diff --git a/ui/app/components/selected-account/selected-account.component.js b/ui/app/components/selected-account/selected-account.component.js
index 6c202141e..55b935ee0 100644
--- a/ui/app/components/selected-account/selected-account.component.js
+++ b/ui/app/components/selected-account/selected-account.component.js
@@ -3,7 +3,7 @@ import PropTypes from 'prop-types'
import copyToClipboard from 'copy-to-clipboard'
import { addressSlicer } from '../../util'
-const Tooltip = require('../tooltip-v2.js')
+const Tooltip = require('../tooltip-v2.js').default
class SelectedAccount extends Component {
state = {
diff --git a/ui/app/components/tooltip-v2.js b/ui/app/components/tooltip-v2.js
index 05a5efc80..0ac5444d6 100644
--- a/ui/app/components/tooltip-v2.js
+++ b/ui/app/components/tooltip-v2.js
@@ -1,33 +1,58 @@
-const Component = require('react').Component
-const h = require('react-hyperscript')
-const inherits = require('util').inherits
-const ReactTippy = require('react-tippy').Tooltip
+import PropTypes from 'prop-types'
+import React, {PureComponent} from 'react'
+import {Tooltip as ReactTippy} from 'react-tippy'
-module.exports = Tooltip
+export default class Tooltip extends PureComponent {
+ static defaultProps = {
+ arrow: true,
+ children: null,
+ containerClassName: '',
+ hideOnClick: false,
+ onHidden: null,
+ position: 'left',
+ size: 'small',
+ title: null,
+ trigger: 'mouseenter',
+ wrapperClassName: '',
+ }
-inherits(Tooltip, Component)
-function Tooltip () {
- Component.call(this)
-}
-
-Tooltip.prototype.render = function () {
- const props = this.props
- const { position, title, children, wrapperClassName, containerClassName, onHidden } = props
-
- return h('div', {
- className: wrapperClassName,
- }, [
+ static propTypes = {
+ arrow: PropTypes.bool,
+ children: PropTypes.node,
+ containerClassName: PropTypes.string,
+ onHidden: PropTypes.func,
+ position: PropTypes.oneOf([
+ 'top',
+ 'right',
+ 'bottom',
+ 'left',
+ ]),
+ size: PropTypes.oneOf([
+ 'small', 'regular', 'big',
+ ]),
+ title: PropTypes.string,
+ trigger: PropTypes.any,
+ wrapperClassName: PropTypes.string,
+ }
- h(ReactTippy, {
- title,
- position: position || 'left',
- trigger: 'mouseenter',
- hideOnClick: false,
- size: 'small',
- arrow: true,
- className: containerClassName,
- onHidden,
- }, children),
+ render () {
+ const {arrow, children, containerClassName, position, size, title, trigger, onHidden, wrapperClassName } = this.props
- ])
+ return (
+ <div className={wrapperClassName}>
+ <ReactTippy
+ className={containerClassName}
+ title={title}
+ position={position}
+ trigger={trigger}
+ hideOnClick={false}
+ size={size}
+ arrow={arrow}
+ onHidden={onHidden}
+ >
+ {children}
+ </ReactTippy>
+ </div>
+ )
+ }
}
diff --git a/ui/app/components/wallet-view.js b/ui/app/components/wallet-view.js
index 6de265110..77c7f3a4b 100644
--- a/ui/app/components/wallet-view.js
+++ b/ui/app/components/wallet-view.js
@@ -9,7 +9,7 @@ const classnames = require('classnames')
const { checksumAddress } = require('../util')
const Identicon = require('./identicon')
// const AccountDropdowns = require('./dropdowns/index.js').AccountDropdowns
-const Tooltip = require('./tooltip-v2.js')
+const Tooltip = require('./tooltip-v2.js').default
const copyToClipboard = require('copy-to-clipboard')
const actions = require('../actions')
const BalanceComponent = require('./balance-component')