46 lines
1.2 KiB
TypeScript
46 lines
1.2 KiB
TypeScript
|
import {Button, ButtonGroup, Dropdown} from "react-bootstrap";
|
||
|
|
import React, {Component} from "react";
|
||
|
|
import DropdownItem from "react-bootstrap/DropdownItem";
|
||
|
|
import {CurrencyPair} from "../types";
|
||
|
|
|
||
|
|
|
||
|
|
export type CurrencyPairProps = {
|
||
|
|
active_pair: CurrencyPair,
|
||
|
|
pairs: Array<CurrencyPair>
|
||
|
|
}
|
||
|
|
|
||
|
|
export class CurrencyDropdown extends Component<CurrencyPairProps> {
|
||
|
|
constructor(props) {
|
||
|
|
super(props);
|
||
|
|
}
|
||
|
|
|
||
|
|
dropdownItems() {
|
||
|
|
return this.props.pairs.map((pair) => {
|
||
|
|
return (
|
||
|
|
<DropdownItem key={String(pair.base) + String(pair.quote)}> {pair.base} / {pair.quote} </DropdownItem>)
|
||
|
|
})
|
||
|
|
}
|
||
|
|
|
||
|
|
render() {
|
||
|
|
return (
|
||
|
|
<Dropdown as={ButtonGroup} className={"mr-3"}>
|
||
|
|
<Button variant="outline-primary"><b>{this.props.active_pair.base} / {this.props.active_pair.quote}</b></Button>
|
||
|
|
|
||
|
|
{this.props.pairs.length > 0 &&
|
||
|
|
|
||
|
|
<>
|
||
|
|
<Dropdown.Toggle split variant="primary" id="dropdown-split-basic"/>
|
||
|
|
|
||
|
|
<Dropdown.Menu className={"mr-3"}>
|
||
|
|
{this.dropdownItems()}
|
||
|
|
</Dropdown.Menu>
|
||
|
|
</>
|
||
|
|
}
|
||
|
|
|
||
|
|
</Dropdown>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
|