diff options
author | Florian Dold <florian.dold@gmail.com> | 2017-12-10 18:25:44 +0100 |
---|---|---|
committer | Florian Dold <florian.dold@gmail.com> | 2017-12-10 18:25:44 +0100 |
commit | b855c547fba01106a4a8c3699fd451bdfcadcf8d (patch) | |
tree | 23cedcf2cca0cf19fce34cdc4c355a7f5d37ba26 /src/webex/pages | |
parent | 5e837207a14eb0a4943bf4a3d075ffb0876a7fbd (diff) | |
download | wallet-core-b855c547fba01106a4a8c3699fd451bdfcadcf8d.tar.xz |
make tables scrollable when they would overflow, make long keys expandable
Diffstat (limited to 'src/webex/pages')
-rw-r--r-- | src/webex/pages/tree.tsx | 45 |
1 files changed, 1 insertions, 44 deletions
diff --git a/src/webex/pages/tree.tsx b/src/webex/pages/tree.tsx index 072150312..c8035c597 100644 --- a/src/webex/pages/tree.tsx +++ b/src/webex/pages/tree.tsx @@ -42,7 +42,7 @@ import { refresh, } from "../wxApi"; -import { renderAmount } from "../renderHtml"; +import { ExpanderText, renderAmount } from "../renderHtml"; import * as React from "react"; import * as ReactDOM from "react-dom"; @@ -244,49 +244,6 @@ interface DenominationListProps { exchange: ExchangeRecord; } -interface ExpanderTextProps { - text: string; -} - -class ExpanderText extends ImplicitStateComponent<ExpanderTextProps> { - private expanded = this.makeState<boolean>(false); - private textArea: any = undefined; - - componentDidUpdate() { - if (this.expanded() && this.textArea) { - this.textArea.focus(); - this.textArea.scrollTop = 0; - } - } - - render(): JSX.Element { - if (!this.expanded()) { - return ( - <span onClick={() => { this.expanded(true); }}> - {(this.props.text.length <= 10) - ? this.props.text - : ( - <span> - {this.props.text.substring(0, 10)} - <span style={{textDecoration: "underline"}}>...</span> - </span> - ) - } - </span> - ); - } - return ( - <textarea - readOnly - style={{display: "block"}} - onBlur={() => this.expanded(false)} - ref={(e) => this.textArea = e}> - {this.props.text} - </textarea> - ); - } -} - class DenominationList extends ImplicitStateComponent<DenominationListProps> { private expanded = this.makeState<boolean>(false); private denoms = this.makeState<undefined|DenominationRecord[]>(undefined); |