status-im
/
embark-area-51
mirror of https://github.com/status-im/embark-area-51.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

feat(utils/converter): introduce copy-to-clipboard buttons 

This commit enables users to easily copy values from the converter's inputs to the clipboard.
This commit is contained in:
Pascal Precht 2018-10-04 14:06:25 +02:00
parent 13160e622f
commit 479aafd076
No known key found for this signature in database
GPG Key ID: 0EE28D8D6FD85D7D
1 changed files with 9 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
embark-ui/src/components/Converter.js
View File

@ -1,6 +1,7 @@
import React, {Component} from 'react'; import React, {Component} from 'react';
import {Page, Form} from "tabler-react"; import {Page, Form, Icon, Button} from "tabler-react";
import Units from 'ethereumjs-units'; import Units from 'ethereumjs-units';
import {CopyToClipboard} from 'react-copy-to-clipboard';
const UNITS = [ const UNITS = [
{ key: 'wei', name: 'Wei' }, { key: 'wei', name: 'Wei' },
@ -55,7 +56,13 @@ class Converter extends Component {
UNITS.map(unit => { UNITS.map(unit => {
return ( return (
<Form.Group label={unit.name} key={unit.key}> <Form.Group label={unit.name} key={unit.key}>
<Form.InputGroup>
<Form.Input placeholder={unit.name} value={this.state.units[unit.key]} onChange={e => this.calculate(e.target.value, unit.key)} /> <Form.Input placeholder={unit.name} value={this.state.units[unit.key]} onChange={e => this.calculate(e.target.value, unit.key)} />
<CopyToClipboard text={this.state.units[unit.key]} title="Copy value to clipboard">
<Button color="primary"><Icon name="copy"/></Button>
</CopyToClipboard>
</Form.InputGroup>
</Form.Group> </Form.Group>
) )
}) })