aboutsummaryrefslogtreecommitdiffstats
path: root/ui/app/components/unit-input/unit-input.component.js
diff options
context:
space:
mode:
authorChi Kei Chan <chikeichan@gmail.com>2019-03-22 07:03:30 +0800
committerDan J Miller <danjm.com@gmail.com>2019-03-22 07:03:30 +0800
commit31175625b446cb5d18b17db23018bca8b14d280c (patch)
treef54e159883deef003fb281267025edf796eb8004 /ui/app/components/unit-input/unit-input.component.js
parent7287133e15fab22299e07704206e85bc855d1064 (diff)
downloadtangerine-wallet-browser-31175625b446cb5d18b17db23018bca8b14d280c.tar
tangerine-wallet-browser-31175625b446cb5d18b17db23018bca8b14d280c.tar.gz
tangerine-wallet-browser-31175625b446cb5d18b17db23018bca8b14d280c.tar.bz2
tangerine-wallet-browser-31175625b446cb5d18b17db23018bca8b14d280c.tar.lz
tangerine-wallet-browser-31175625b446cb5d18b17db23018bca8b14d280c.tar.xz
tangerine-wallet-browser-31175625b446cb5d18b17db23018bca8b14d280c.tar.zst
tangerine-wallet-browser-31175625b446cb5d18b17db23018bca8b14d280c.zip
Folder restructure (#6304)
* Remove ui/app/keychains/ * Remove ui/app/img/ (unused images) * Move conversion-util to helpers/utils/ * Move token-util to helpers/utils/ * Move /helpers/*.js inside /helpers/utils/ * Move util tests inside /helpers/utils/ * Renameand move confirm-transaction/util.js to helpers/utils/ * Move higher-order-components to helpers/higher-order-components/ * Move infura-conversion.json to helpers/constants/ * Move all utility functions to helpers/utils/ * Move pages directory to top-level * Move all constants to helpers/constants/ * Move metametrics inside helpers/ * Move app and root inside pages/ * Move routes inside helpers/ * Re-organize ducks/ * Move reducers to ducks/ * Move selectors inside selectors/ * Move test out of test folder * Move action, reducer, store inside store/ * Move ui components inside ui/ * Move UI components inside ui/ * Move connected components inside components/app/ * Move i18n-helper inside helpers/ * Fix unit tests * Fix unit test * Move pages components * Rename routes component * Move reducers to ducks/index * Fix bad path in unit test
Diffstat (limited to 'ui/app/components/unit-input/unit-input.component.js')
-rw-r--r--ui/app/components/unit-input/unit-input.component.js108
1 files changed, 0 insertions, 108 deletions
diff --git a/ui/app/components/unit-input/unit-input.component.js b/ui/app/components/unit-input/unit-input.component.js
deleted file mode 100644
index 230eecfe6..000000000
--- a/ui/app/components/unit-input/unit-input.component.js
+++ /dev/null
@@ -1,108 +0,0 @@
-import React, { PureComponent } from 'react'
-import PropTypes from 'prop-types'
-import classnames from 'classnames'
-import { removeLeadingZeroes } from '../send/send.utils'
-
-/**
- * Component that attaches a suffix or unit of measurement trailing user input, ex. 'ETH'. Also
- * allows rendering a child component underneath the input to, for example, display conversions of
- * the shown suffix.
- */
-export default class UnitInput extends PureComponent {
- static propTypes = {
- children: PropTypes.node,
- actionComponent: PropTypes.node,
- error: PropTypes.bool,
- onBlur: PropTypes.func,
- onChange: PropTypes.func,
- placeholder: PropTypes.string,
- suffix: PropTypes.string,
- value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
- }
-
- static defaultProps = {
- placeholder: '0',
- }
-
- constructor (props) {
- super(props)
-
- this.state = {
- value: props.value || '',
- }
- }
-
- componentDidUpdate (prevProps) {
- const { value: prevPropsValue } = prevProps
- const { value: propsValue } = this.props
- const { value: stateValue } = this.state
-
- if (prevPropsValue !== propsValue && propsValue !== stateValue) {
- this.setState({ value: propsValue })
- }
- }
-
- handleFocus = () => {
- this.unitInput.focus()
- }
-
- handleChange = event => {
- const { value: userInput } = event.target
- let value = userInput
-
- if (userInput.length && userInput.length > 1) {
- value = removeLeadingZeroes(userInput)
- }
-
- this.setState({ value })
- this.props.onChange(value)
- }
-
- handleBlur = event => {
- const { onBlur } = this.props
- typeof onBlur === 'function' && onBlur(this.state.value)
- }
-
- getInputWidth (value) {
- const valueString = String(value)
- const valueLength = valueString.length || 1
- const decimalPointDeficit = valueString.match(/\./) ? -0.5 : 0
- return (valueLength + decimalPointDeficit + 0.5) + 'ch'
- }
-
- render () {
- const { error, placeholder, suffix, actionComponent, children } = this.props
- const { value } = this.state
-
- return (
- <div
- className={classnames('unit-input', { 'unit-input--error': error })}
- onClick={this.handleFocus}
- >
- <div className="unit-input__inputs">
- <div className="unit-input__input-container">
- <input
- type="number"
- className="unit-input__input"
- value={value}
- placeholder={placeholder}
- onChange={this.handleChange}
- onBlur={this.handleBlur}
- style={{ width: this.getInputWidth(value) }}
- ref={ref => { this.unitInput = ref }}
- />
- {
- suffix && (
- <div className="unit-input__suffix">
- { suffix }
- </div>
- )
- }
- </div>
- { children }
- </div>
- {actionComponent}
- </div>
- )
- }
-}