aboutsummaryrefslogtreecommitdiffstats
path: root/packages/website/ts/components/ui
diff options
context:
space:
mode:
authorBrandon Millman <brandon.millman@gmail.com>2017-12-20 13:44:08 +0800
committerLeonid Logvinov <logvinov.leon@gmail.com>2017-12-20 22:30:25 +0800
commitcb11aec84df346d5180c7d5874859c1c34f0bf1c (patch)
treeb959a65bdcfc3e8b01dca1bc160f93a0df8a4bf9 /packages/website/ts/components/ui
parent972e1675f6490bc10e8d9fd64cce2f7945cd4840 (diff)
downloaddexon-sol-tools-cb11aec84df346d5180c7d5874859c1c34f0bf1c.tar
dexon-sol-tools-cb11aec84df346d5180c7d5874859c1c34f0bf1c.tar.gz
dexon-sol-tools-cb11aec84df346d5180c7d5874859c1c34f0bf1c.tar.bz2
dexon-sol-tools-cb11aec84df346d5180c7d5874859c1c34f0bf1c.tar.lz
dexon-sol-tools-cb11aec84df346d5180c7d5874859c1c34f0bf1c.tar.xz
dexon-sol-tools-cb11aec84df346d5180c7d5874859c1c34f0bf1c.tar.zst
dexon-sol-tools-cb11aec84df346d5180c7d5874859c1c34f0bf1c.zip
Add new underscore-privates rule to @0xproject/tslint-config and fix lint errors
Diffstat (limited to 'packages/website/ts/components/ui')
-rw-r--r--packages/website/ts/components/ui/badge.tsx6
-rw-r--r--packages/website/ts/components/ui/copy_icon.tsx38
-rw-r--r--packages/website/ts/components/ui/drop_down_menu_item.tsx40
-rw-r--r--packages/website/ts/components/ui/flash_message.tsx4
-rw-r--r--packages/website/ts/components/ui/lifecycle_raised_button.tsx12
-rw-r--r--packages/website/ts/components/ui/menu_item.tsx6
-rw-r--r--packages/website/ts/components/ui/swap_icon.tsx6
7 files changed, 56 insertions, 56 deletions
diff --git a/packages/website/ts/components/ui/badge.tsx b/packages/website/ts/components/ui/badge.tsx
index cf4396047..fae51860e 100644
--- a/packages/website/ts/components/ui/badge.tsx
+++ b/packages/website/ts/components/ui/badge.tsx
@@ -42,14 +42,14 @@ export class Badge extends React.Component<BadgeProps, BadgeState> {
<div
className="p1 center"
style={badgeStyle}
- onMouseOver={this.setHoverState.bind(this, true)}
- onMouseOut={this.setHoverState.bind(this, false)}
+ onMouseOver={this._setHoverState.bind(this, true)}
+ onMouseOut={this._setHoverState.bind(this, false)}
>
{this.props.title}
</div>
);
}
- private setHoverState(isHovering: boolean) {
+ private _setHoverState(isHovering: boolean) {
this.setState({
isHovering,
});
diff --git a/packages/website/ts/components/ui/copy_icon.tsx b/packages/website/ts/components/ui/copy_icon.tsx
index 3c50430df..754f5d456 100644
--- a/packages/website/ts/components/ui/copy_icon.tsx
+++ b/packages/website/ts/components/ui/copy_icon.tsx
@@ -15,8 +15,8 @@ interface CopyIconState {
}
export class CopyIcon extends React.Component<CopyIconProps, CopyIconState> {
- private copyTooltipTimeoutId: number;
- private copyable: HTMLInputElement;
+ private _copyTooltipTimeoutId: number;
+ private _copyable: HTMLInputElement;
constructor(props: CopyIconProps) {
super(props);
this.state = {
@@ -25,25 +25,25 @@ export class CopyIcon extends React.Component<CopyIconProps, CopyIconState> {
}
public componentDidUpdate() {
// Remove tooltip if hover away
- if (!this.state.isHovering && this.copyTooltipTimeoutId) {
- clearInterval(this.copyTooltipTimeoutId);
- this.hideTooltip();
+ if (!this.state.isHovering && this._copyTooltipTimeoutId) {
+ clearInterval(this._copyTooltipTimeoutId);
+ this._hideTooltip();
}
}
public render() {
return (
<div className="inline-block">
- <CopyToClipboard text={this.props.data} onCopy={this.onCopy.bind(this)}>
+ <CopyToClipboard text={this.props.data} onCopy={this._onCopy.bind(this)}>
<div
className="inline flex"
style={{cursor: 'pointer', color: colors.amber600}}
- ref={this.setRefToProperty.bind(this)}
+ ref={this._setRefToProperty.bind(this)}
data-tip={true}
data-for="copy"
data-event="click"
data-iscapture={true} // This let's the click event continue to propogate
- onMouseOver={this.setHoverState.bind(this, true)}
- onMouseOut={this.setHoverState.bind(this, false)}
+ onMouseOver={this._setHoverState.bind(this, true)}
+ onMouseOut={this._setHoverState.bind(this, false)}
>
<div>
<i style={{fontSize: 15}} className="zmdi zmdi-copy" />
@@ -57,25 +57,25 @@ export class CopyIcon extends React.Component<CopyIconProps, CopyIconState> {
</div>
);
}
- private setRefToProperty(el: HTMLInputElement) {
- this.copyable = el;
+ private _setRefToProperty(el: HTMLInputElement) {
+ this._copyable = el;
}
- private setHoverState(isHovering: boolean) {
+ private _setHoverState(isHovering: boolean) {
this.setState({
isHovering,
});
}
- private onCopy() {
- if (this.copyTooltipTimeoutId) {
- clearInterval(this.copyTooltipTimeoutId);
+ private _onCopy() {
+ if (this._copyTooltipTimeoutId) {
+ clearInterval(this._copyTooltipTimeoutId);
}
const tooltipLifespanMs = 1000;
- this.copyTooltipTimeoutId = window.setTimeout(() => {
- this.hideTooltip();
+ this._copyTooltipTimeoutId = window.setTimeout(() => {
+ this._hideTooltip();
}, tooltipLifespanMs);
}
- private hideTooltip() {
- ReactTooltip.hide(ReactDOM.findDOMNode(this.copyable));
+ private _hideTooltip() {
+ ReactTooltip.hide(ReactDOM.findDOMNode(this._copyable));
}
}
diff --git a/packages/website/ts/components/ui/drop_down_menu_item.tsx b/packages/website/ts/components/ui/drop_down_menu_item.tsx
index 55347cb98..ee26e004e 100644
--- a/packages/website/ts/components/ui/drop_down_menu_item.tsx
+++ b/packages/website/ts/components/ui/drop_down_menu_item.tsx
@@ -28,8 +28,8 @@ export class DropDownMenuItem extends React.Component<DropDownMenuItemProps, Dro
menuItemStyle: DEFAULT_STYLE,
isNightVersion: false,
};
- private isHovering: boolean;
- private popoverCloseCheckIntervalId: number;
+ private _isHovering: boolean;
+ private _popoverCloseCheckIntervalId: number;
constructor(props: DropDownMenuItemProps) {
super(props);
this.state = {
@@ -37,20 +37,20 @@ export class DropDownMenuItem extends React.Component<DropDownMenuItemProps, Dro
};
}
public componentDidMount() {
- this.popoverCloseCheckIntervalId = window.setInterval(() => {
- this.checkIfShouldClosePopover();
+ this._popoverCloseCheckIntervalId = window.setInterval(() => {
+ this._checkIfShouldClosePopover();
}, CHECK_CLOSE_POPOVER_INTERVAL_MS);
}
public componentWillUnmount() {
- window.clearInterval(this.popoverCloseCheckIntervalId);
+ window.clearInterval(this._popoverCloseCheckIntervalId);
}
public render() {
const colorStyle = this.props.isNightVersion ? 'white' : this.props.style.color;
return (
<div
style={{...this.props.style, color: colorStyle}}
- onMouseEnter={this.onHover.bind(this)}
- onMouseLeave={this.onHoverOff.bind(this)}
+ onMouseEnter={this._onHover.bind(this)}
+ onMouseLeave={this._onHoverOff.bind(this)}
>
<div className="flex relative">
<div style={{paddingRight: 10}}>
@@ -65,12 +65,12 @@ export class DropDownMenuItem extends React.Component<DropDownMenuItemProps, Dro
anchorEl={this.state.anchorEl}
anchorOrigin={{horizontal: 'middle', vertical: 'bottom'}}
targetOrigin={{horizontal: 'middle', vertical: 'top'}}
- onRequestClose={this.closePopover.bind(this)}
+ onRequestClose={this._closePopover.bind(this)}
useLayerForClickAway={false}
>
<div
- onMouseEnter={this.onHover.bind(this)}
- onMouseLeave={this.onHoverOff.bind(this)}
+ onMouseEnter={this._onHover.bind(this)}
+ onMouseLeave={this._onHoverOff.bind(this)}
>
<Menu style={{color: colors.grey}}>
{this.props.subMenuItems}
@@ -80,11 +80,11 @@ export class DropDownMenuItem extends React.Component<DropDownMenuItemProps, Dro
</div>
);
}
- private onHover(event: React.FormEvent<HTMLInputElement>) {
- this.isHovering = true;
- this.checkIfShouldOpenPopover(event);
+ private _onHover(event: React.FormEvent<HTMLInputElement>) {
+ this._isHovering = true;
+ this._checkIfShouldOpenPopover(event);
}
- private checkIfShouldOpenPopover(event: React.FormEvent<HTMLInputElement>) {
+ private _checkIfShouldOpenPopover(event: React.FormEvent<HTMLInputElement>) {
if (this.state.isDropDownOpen) {
return; // noop
}
@@ -94,16 +94,16 @@ export class DropDownMenuItem extends React.Component<DropDownMenuItemProps, Dro
anchorEl: event.currentTarget,
});
}
- private onHoverOff(event: React.FormEvent<HTMLInputElement>) {
- this.isHovering = false;
+ private _onHoverOff(event: React.FormEvent<HTMLInputElement>) {
+ this._isHovering = false;
}
- private checkIfShouldClosePopover() {
- if (!this.state.isDropDownOpen || this.isHovering) {
+ private _checkIfShouldClosePopover() {
+ if (!this.state.isDropDownOpen || this._isHovering) {
return; // noop
}
- this.closePopover();
+ this._closePopover();
}
- private closePopover() {
+ private _closePopover() {
this.setState({
isDropDownOpen: false,
});
diff --git a/packages/website/ts/components/ui/flash_message.tsx b/packages/website/ts/components/ui/flash_message.tsx
index ab4edbbb0..c0c00463e 100644
--- a/packages/website/ts/components/ui/flash_message.tsx
+++ b/packages/website/ts/components/ui/flash_message.tsx
@@ -26,7 +26,7 @@ export class FlashMessage extends React.Component<FlashMessageProps, FlashMessag
open={true}
message={this.props.flashMessage}
autoHideDuration={this.props.showDurationMs}
- onRequestClose={this.onClose.bind(this)}
+ onRequestClose={this._onClose.bind(this)}
bodyStyle={this.props.bodyStyle}
/>
);
@@ -34,7 +34,7 @@ export class FlashMessage extends React.Component<FlashMessageProps, FlashMessag
return null;
}
}
- private onClose() {
+ private _onClose() {
this.props.dispatcher.hideFlashMessage();
}
}
diff --git a/packages/website/ts/components/ui/lifecycle_raised_button.tsx b/packages/website/ts/components/ui/lifecycle_raised_button.tsx
index 08e8bc9ce..852975ef6 100644
--- a/packages/website/ts/components/ui/lifecycle_raised_button.tsx
+++ b/packages/website/ts/components/ui/lifecycle_raised_button.tsx
@@ -35,8 +35,8 @@ export class LifeCycleRaisedButton extends
backgroundColor: colors.white,
labelColor: colors.darkGrey,
};
- private buttonTimeoutId: number;
- private didUnmount: boolean;
+ private _buttonTimeoutId: number;
+ private _didUnmount: boolean;
constructor(props: LifeCycleRaisedButtonProps) {
super(props);
this.state = {
@@ -44,8 +44,8 @@ export class LifeCycleRaisedButton extends
};
}
public componentWillUnmount() {
- clearTimeout(this.buttonTimeoutId);
- this.didUnmount = true;
+ clearTimeout(this._buttonTimeoutId);
+ this._didUnmount = true;
}
public render() {
if (this.props.isHidden) {
@@ -83,14 +83,14 @@ export class LifeCycleRaisedButton extends
buttonState: ButtonState.LOADING,
});
const didSucceed = await this.props.onClickAsyncFn();
- if (this.didUnmount) {
+ if (this._didUnmount) {
return; // noop since unmount called before async callback returned.
}
if (didSucceed) {
this.setState({
buttonState: ButtonState.COMPLETE,
});
- this.buttonTimeoutId = window.setTimeout(() => {
+ this._buttonTimeoutId = window.setTimeout(() => {
this.setState({
buttonState: ButtonState.READY,
});
diff --git a/packages/website/ts/components/ui/menu_item.tsx b/packages/website/ts/components/ui/menu_item.tsx
index c7ce7439f..3ec993476 100644
--- a/packages/website/ts/components/ui/menu_item.tsx
+++ b/packages/website/ts/components/ui/menu_item.tsx
@@ -35,15 +35,15 @@ export class MenuItem extends React.Component<MenuItemProps, MenuItemState> {
onClick={this.props.onClick.bind(this)}
className={`mx-auto ${this.props.className}`}
style={menuItemStyles}
- onMouseEnter={this.onToggleHover.bind(this, true)}
- onMouseLeave={this.onToggleHover.bind(this, false)}
+ onMouseEnter={this._onToggleHover.bind(this, true)}
+ onMouseLeave={this._onToggleHover.bind(this, false)}
>
{this.props.children}
</div>
</Link>
);
}
- private onToggleHover(isHovering: boolean) {
+ private _onToggleHover(isHovering: boolean) {
this.setState({
isHovering,
});
diff --git a/packages/website/ts/components/ui/swap_icon.tsx b/packages/website/ts/components/ui/swap_icon.tsx
index 124e7018c..2adefbda3 100644
--- a/packages/website/ts/components/ui/swap_icon.tsx
+++ b/packages/website/ts/components/ui/swap_icon.tsx
@@ -27,8 +27,8 @@ export class SwapIcon extends React.Component<SwapIconProps, SwapIconState> {
className="mx-auto pt4"
style={{cursor: 'pointer', height: 50, width: 37.5}}
onClick={this.props.swapTokensFn}
- onMouseEnter={this.onToggleHover.bind(this, true)}
- onMouseLeave={this.onToggleHover.bind(this, false)}
+ onMouseEnter={this._onToggleHover.bind(this, true)}
+ onMouseLeave={this._onToggleHover.bind(this, false)}
>
<i
style={swapStyles}
@@ -37,7 +37,7 @@ export class SwapIcon extends React.Component<SwapIconProps, SwapIconState> {
</div>
);
}
- private onToggleHover(isHovering: boolean) {
+ private _onToggleHover(isHovering: boolean) {
this.setState({
isHovering,
});