mirror of https://github.com/kremalicious/blog.git
42 lines
1021 B
TypeScript
42 lines
1021 B
TypeScript
import React from 'react'
|
|
import Input from '../atoms/Input'
|
|
import Account from './Account'
|
|
import Conversion from './Conversion'
|
|
import styles from './InputGroup.module.scss'
|
|
|
|
export default function InputGroup({
|
|
amount,
|
|
onAmountChange,
|
|
sendTransaction,
|
|
selectedAccount
|
|
}: {
|
|
amount: string
|
|
onAmountChange(target: any): void
|
|
sendTransaction(): void
|
|
selectedAccount?: string | null
|
|
}) {
|
|
return (
|
|
<div className={styles.inputGroup}>
|
|
<div className={styles.input}>
|
|
<Input
|
|
type="number"
|
|
value={amount}
|
|
onChange={onAmountChange}
|
|
min="0"
|
|
step="0.01"
|
|
/>
|
|
<div className={styles.currency}>
|
|
<span>ETH</span>
|
|
</div>
|
|
</div>
|
|
<button className="btn btn-primary" onClick={sendTransaction}>
|
|
Make it rain
|
|
</button>
|
|
<div className={styles.infoline}>
|
|
<Conversion amount={amount} />
|
|
{selectedAccount && <Account account={selectedAccount} />}
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|