aboutsummaryrefslogtreecommitdiffstats
path: root/packages/website/ts/components
diff options
context:
space:
mode:
authorSteve Klebanoff <steve.klebanoff@gmail.com>2019-01-16 02:43:55 +0800
committerSteve Klebanoff <steve.klebanoff@gmail.com>2019-01-16 02:43:55 +0800
commit600b44c9620494c976b5aac6e8a1912543cda81c (patch)
treefd78c65dd2fdd7b1cbee1b5eff97a95a984a9186 /packages/website/ts/components
parent8a8a5332d76ae8429d1c6449e0ea693a2e8c8a8a (diff)
parentf570f80674c22f69712c45e8e3c48e948b51f357 (diff)
downloaddexon-sol-tools-600b44c9620494c976b5aac6e8a1912543cda81c.tar
dexon-sol-tools-600b44c9620494c976b5aac6e8a1912543cda81c.tar.gz
dexon-sol-tools-600b44c9620494c976b5aac6e8a1912543cda81c.tar.bz2
dexon-sol-tools-600b44c9620494c976b5aac6e8a1912543cda81c.tar.lz
dexon-sol-tools-600b44c9620494c976b5aac6e8a1912543cda81c.tar.xz
dexon-sol-tools-600b44c9620494c976b5aac6e8a1912543cda81c.tar.zst
dexon-sol-tools-600b44c9620494c976b5aac6e8a1912543cda81c.zip
Merge branch 'development' into feature/instant/asset-buyer-check-liquidity
Diffstat (limited to 'packages/website/ts/components')
-rw-r--r--packages/website/ts/components/dialogs/ledger_config_dialog.tsx18
-rw-r--r--packages/website/ts/components/fill_order.tsx8
-rw-r--r--packages/website/ts/components/generate_order/asset_picker.tsx42
-rw-r--r--packages/website/ts/components/generate_order/generate_order_form.tsx20
-rw-r--r--packages/website/ts/components/generate_order/new_token_form.tsx2
-rw-r--r--packages/website/ts/components/inputs/allowance_state_toggle.tsx2
-rw-r--r--packages/website/ts/components/portal/portal.tsx4
-rw-r--r--packages/website/ts/components/token_balances.tsx22
-rw-r--r--packages/website/ts/components/ui/alert.tsx2
-rw-r--r--packages/website/ts/components/ui/lifecycle_raised_button.tsx24
10 files changed, 72 insertions, 72 deletions
diff --git a/packages/website/ts/components/dialogs/ledger_config_dialog.tsx b/packages/website/ts/components/dialogs/ledger_config_dialog.tsx
index e15a2dd94..527353aa0 100644
--- a/packages/website/ts/components/dialogs/ledger_config_dialog.tsx
+++ b/packages/website/ts/components/dialogs/ledger_config_dialog.tsx
@@ -20,8 +20,8 @@ import { utils } from 'ts/utils/utils';
const VALID_ETHEREUM_DERIVATION_PATH_PREFIX = `44'/60'`;
enum LedgerSteps {
- CONNECT,
- SELECT_ADDRESS,
+ Connect,
+ SelectAddress,
}
interface LedgerConfigDialogProps {
@@ -52,7 +52,7 @@ export class LedgerConfigDialog extends React.Component<LedgerConfigDialogProps,
const derivationPathIfExists = props.blockchain.getLedgerDerivationPathIfExists();
this.state = {
connectionErrMsg: '',
- stepIndex: LedgerSteps.CONNECT,
+ stepIndex: LedgerSteps.Connect,
userAddresses: [],
addressBalances: [],
derivationPath: _.isUndefined(derivationPathIfExists)
@@ -67,7 +67,7 @@ export class LedgerConfigDialog extends React.Component<LedgerConfigDialogProps,
<FlatButton key="ledgerConnectCancel" label="Cancel" onClick={this._onClose.bind(this)} />,
];
const dialogTitle =
- this.state.stepIndex === LedgerSteps.CONNECT ? 'Connect to your Ledger' : 'Select desired address';
+ this.state.stepIndex === LedgerSteps.Connect ? 'Connect to your Ledger' : 'Select desired address';
return (
<Dialog
title={dialogTitle}
@@ -79,8 +79,8 @@ export class LedgerConfigDialog extends React.Component<LedgerConfigDialogProps,
bodyStyle={{ paddingBottom: 0 }}
>
<div style={{ color: colors.grey700, paddingTop: 1 }}>
- {this.state.stepIndex === LedgerSteps.CONNECT && this._renderConnectStep()}
- {this.state.stepIndex === LedgerSteps.SELECT_ADDRESS && this._renderSelectAddressStep()}
+ {this.state.stepIndex === LedgerSteps.Connect && this._renderConnectStep()}
+ {this.state.stepIndex === LedgerSteps.SelectAddress && this._renderSelectAddressStep()}
</div>
</Dialog>
);
@@ -195,7 +195,7 @@ export class LedgerConfigDialog extends React.Component<LedgerConfigDialogProps,
private _onClose(): void {
this.setState({
connectionErrMsg: '',
- stepIndex: LedgerSteps.CONNECT,
+ stepIndex: LedgerSteps.Connect,
});
const isOpen = false;
this.props.toggleDialogFn(isOpen);
@@ -210,7 +210,7 @@ export class LedgerConfigDialog extends React.Component<LedgerConfigDialogProps,
this.props.blockchain.fetchTokenInformationAsync();
this.props.dispatcher.updateUserWeiBalance(selectAddressBalance);
this.setState({
- stepIndex: LedgerSteps.CONNECT,
+ stepIndex: LedgerSteps.Connect,
});
const isOpen = false;
this.props.toggleDialogFn(isOpen);
@@ -284,7 +284,7 @@ export class LedgerConfigDialog extends React.Component<LedgerConfigDialogProps,
const didSucceed = await this._fetchAddressesAndBalancesAsync();
if (didSucceed) {
this.setState({
- stepIndex: LedgerSteps.SELECT_ADDRESS,
+ stepIndex: LedgerSteps.SelectAddress,
connectionErrMsg: '',
});
}
diff --git a/packages/website/ts/components/fill_order.tsx b/packages/website/ts/components/fill_order.tsx
index 2fa2b94a0..7fee8c4df 100644
--- a/packages/website/ts/components/fill_order.tsx
+++ b/packages/website/ts/components/fill_order.tsx
@@ -182,7 +182,7 @@ export class FillOrder extends React.Component<FillOrderProps, FillOrderState> {
</div>
)}
{!_.isEmpty(this.state.orderJSONErrMsg) && (
- <Alert type={AlertTypes.ERROR} message={this.state.orderJSONErrMsg} />
+ <Alert type={AlertTypes.Error} message={this.state.orderJSONErrMsg} />
)}
</div>
);
@@ -298,7 +298,7 @@ export class FillOrder extends React.Component<FillOrderProps, FillOrderState> {
onClick={this._onCancelOrderClickFireAndForgetAsync.bind(this)}
/>
{this.state.didCancelOrderSucceed && (
- <Alert type={AlertTypes.SUCCESS} message={this._renderCancelSuccessMsg()} />
+ <Alert type={AlertTypes.Success} message={this._renderCancelSuccessMsg()} />
)}
</div>
) : (
@@ -310,10 +310,10 @@ export class FillOrder extends React.Component<FillOrderProps, FillOrderState> {
onClick={this._onFillOrderClick.bind(this)}
/>
{!_.isEmpty(this.state.globalErrMsg) && (
- <Alert type={AlertTypes.ERROR} message={this.state.globalErrMsg} />
+ <Alert type={AlertTypes.Error} message={this.state.globalErrMsg} />
)}
{this.state.didFillOrderSucceed && (
- <Alert type={AlertTypes.SUCCESS} message={this._renderFillSuccessMsg()} />
+ <Alert type={AlertTypes.Success} message={this._renderFillSuccessMsg()} />
)}
</div>
)}
diff --git a/packages/website/ts/components/generate_order/asset_picker.tsx b/packages/website/ts/components/generate_order/asset_picker.tsx
index e6ecd2ec8..d3f11f962 100644
--- a/packages/website/ts/components/generate_order/asset_picker.tsx
+++ b/packages/website/ts/components/generate_order/asset_picker.tsx
@@ -18,9 +18,9 @@ import { utils } from 'ts/utils/utils';
const TOKEN_ICON_DIMENSION = 100;
const TILE_DIMENSION = 146;
enum AssetViews {
- ASSET_PICKER = 'ASSET_PICKER',
- NEW_TOKEN_FORM = 'NEW_TOKEN_FORM',
- CONFIRM_TRACK_TOKEN = 'CONFIRM_TRACK_TOKEN',
+ AssetPicker = 'ASSET_PICKER',
+ NewTokenForm = 'NEW_TOKEN_FORM',
+ ConfirmTrackToken = 'CONFIRM_TRACK_TOKEN',
}
interface AssetPickerProps {
@@ -44,29 +44,29 @@ interface AssetPickerState {
export class AssetPicker extends React.Component<AssetPickerProps, AssetPickerState> {
public static defaultProps: Partial<AssetPickerProps> = {
- tokenVisibility: TokenVisibility.ALL,
+ tokenVisibility: TokenVisibility.All,
};
private readonly _dialogConfigsByAssetView: { [assetView: string]: DialogConfigs };
constructor(props: AssetPickerProps) {
super(props);
this.state = {
- assetView: AssetViews.ASSET_PICKER,
+ assetView: AssetViews.AssetPicker,
hoveredAddress: undefined,
chosenTrackTokenAddress: undefined,
isAddingTokenToTracked: false,
};
this._dialogConfigsByAssetView = {
- [AssetViews.ASSET_PICKER]: {
+ [AssetViews.AssetPicker]: {
title: 'Select token',
isModal: false,
actions: [],
},
- [AssetViews.NEW_TOKEN_FORM]: {
+ [AssetViews.NewTokenForm]: {
title: 'Add an ERC20 token',
isModal: false,
actions: [],
},
- [AssetViews.CONFIRM_TRACK_TOKEN]: {
+ [AssetViews.ConfirmTrackToken]: {
title: 'Tracking confirmation',
isModal: true,
actions: [
@@ -95,15 +95,15 @@ export class AssetPicker extends React.Component<AssetPickerProps, AssetPickerSt
autoScrollBodyContent={true}
onRequestClose={this._onCloseDialog.bind(this)}
>
- {this.state.assetView === AssetViews.ASSET_PICKER && this._renderAssetPicker()}
- {this.state.assetView === AssetViews.NEW_TOKEN_FORM && (
+ {this.state.assetView === AssetViews.AssetPicker && this._renderAssetPicker()}
+ {this.state.assetView === AssetViews.NewTokenForm && (
<NewTokenForm
blockchain={this.props.blockchain}
onNewTokenSubmitted={this._onNewTokenSubmitted.bind(this)}
tokenByAddress={this.props.tokenByAddress}
/>
)}
- {this.state.assetView === AssetViews.CONFIRM_TRACK_TOKEN && this._renderConfirmTrackToken()}
+ {this.state.assetView === AssetViews.ConfirmTrackToken && this._renderConfirmTrackToken()}
</Dialog>
);
}
@@ -138,19 +138,19 @@ export class AssetPicker extends React.Component<AssetPickerProps, AssetPickerSt
const allTokens = _.values(this.props.tokenByAddress);
// filter tokens based on visibility specified in props, do not show ZRX or ETHER as tracked or untracked
const filteredTokens =
- this.props.tokenVisibility === TokenVisibility.ALL
+ this.props.tokenVisibility === TokenVisibility.All
? allTokens
: _.filter(allTokens, token => {
return (
token.symbol !== constants.ZRX_TOKEN_SYMBOL &&
token.symbol !== constants.ETHER_TOKEN_SYMBOL &&
- ((this.props.tokenVisibility === TokenVisibility.TRACKED && utils.isTokenTracked(token)) ||
- (this.props.tokenVisibility === TokenVisibility.UNTRACKED &&
+ ((this.props.tokenVisibility === TokenVisibility.Tracked && utils.isTokenTracked(token)) ||
+ (this.props.tokenVisibility === TokenVisibility.Untracked &&
!utils.isTokenTracked(token)))
);
});
// if we are showing tracked tokens, sort by date added, otherwise sort by symbol
- const sortKey = this.props.tokenVisibility === TokenVisibility.TRACKED ? 'trackedTimestamp' : 'symbol';
+ const sortKey = this.props.tokenVisibility === TokenVisibility.Tracked ? 'trackedTimestamp' : 'symbol';
const sortedTokens = filteredTokens.sort(firstBy(sortKey));
if (_.isEmpty(sortedTokens)) {
return <div className="mx-auto p4 h2">No tokens to remove.</div>;
@@ -188,7 +188,7 @@ export class AssetPicker extends React.Component<AssetPickerProps, AssetPickerSt
cursor: 'pointer',
opacity: isHovered ? 0.6 : 1,
};
- if (this.props.tokenVisibility !== TokenVisibility.TRACKED) {
+ if (this.props.tokenVisibility !== TokenVisibility.Tracked) {
gridTiles.push(
<div
key={otherTokenKey}
@@ -222,7 +222,7 @@ export class AssetPicker extends React.Component<AssetPickerProps, AssetPickerSt
}
private _onCloseDialog(): void {
this.setState({
- assetView: AssetViews.ASSET_PICKER,
+ assetView: AssetViews.AssetPicker,
});
this.props.onTokenChosen(this.props.currentTokenAddress);
}
@@ -232,21 +232,21 @@ export class AssetPicker extends React.Component<AssetPickerProps, AssetPickerSt
this.props.onTokenChosen(tokenAddress);
} else {
this.setState({
- assetView: AssetViews.CONFIRM_TRACK_TOKEN,
+ assetView: AssetViews.ConfirmTrackToken,
chosenTrackTokenAddress: tokenAddress,
});
}
}
private _onCustomAssetChosen(): void {
this.setState({
- assetView: AssetViews.NEW_TOKEN_FORM,
+ assetView: AssetViews.NewTokenForm,
});
}
private _onNewTokenSubmitted(newToken: Token): void {
trackedTokenStorage.addTrackedTokenToUser(this.props.userAddress, this.props.networkId, newToken);
this.props.dispatcher.addTokenToTokenByAddress(newToken);
this.setState({
- assetView: AssetViews.ASSET_PICKER,
+ assetView: AssetViews.AssetPicker,
});
this.props.onTokenChosen(newToken.address);
}
@@ -254,7 +254,7 @@ export class AssetPicker extends React.Component<AssetPickerProps, AssetPickerSt
const resetState: AssetPickerState = {
...this.state,
isAddingTokenToTracked: false,
- assetView: AssetViews.ASSET_PICKER,
+ assetView: AssetViews.AssetPicker,
chosenTrackTokenAddress: undefined,
};
if (!didUserAcceptTracking) {
diff --git a/packages/website/ts/components/generate_order/generate_order_form.tsx b/packages/website/ts/components/generate_order/generate_order_form.tsx
index 8afbee977..0f70aa18f 100644
--- a/packages/website/ts/components/generate_order/generate_order_form.tsx
+++ b/packages/website/ts/components/generate_order/generate_order_form.tsx
@@ -36,9 +36,9 @@ import { errorReporter } from 'ts/utils/error_reporter';
import { utils } from 'ts/utils/utils';
enum SigningState {
- UNSIGNED,
- SIGNING,
- SIGNED,
+ Unsigned,
+ Signing,
+ Signed,
}
interface GenerateOrderFormProps {
@@ -76,7 +76,7 @@ export class GenerateOrderForm extends React.Component<GenerateOrderFormProps, G
this.state = {
globalErrMsg: '',
shouldShowIncompleteErrs: false,
- signingState: SigningState.UNSIGNED,
+ signingState: SigningState.Unsigned,
};
}
public componentDidMount(): void {
@@ -207,7 +207,7 @@ export class GenerateOrderForm extends React.Component<GenerateOrderFormProps, G
/>
</div>
{this.state.globalErrMsg !== '' && (
- <Alert type={AlertTypes.ERROR} message={this.state.globalErrMsg} />
+ <Alert type={AlertTypes.Error} message={this.state.globalErrMsg} />
)}
</div>
</div>
@@ -215,7 +215,7 @@ export class GenerateOrderForm extends React.Component<GenerateOrderFormProps, G
title="Order JSON"
titleStyle={{ fontWeight: 100 }}
modal={false}
- open={this.state.signingState === SigningState.SIGNED}
+ open={this.state.signingState === SigningState.Signed}
onRequestClose={this._onCloseOrderJSONDialog.bind(this)}
>
<OrderJSON
@@ -247,7 +247,7 @@ export class GenerateOrderForm extends React.Component<GenerateOrderFormProps, G
// orderHash will not collide with the previously generated orderHash.
this.props.dispatcher.updateOrderSalt(generatePseudoRandomSalt());
this.setState({
- signingState: SigningState.UNSIGNED,
+ signingState: SigningState.Unsigned,
});
}
private async _onSignClickedAsync(): Promise<boolean> {
@@ -305,13 +305,13 @@ export class GenerateOrderForm extends React.Component<GenerateOrderFormProps, G
}
private async _signTransactionAsync(): Promise<PortalOrder | undefined> {
this.setState({
- signingState: SigningState.SIGNING,
+ signingState: SigningState.Signing,
});
const exchangeAddress = this.props.blockchain.getExchangeContractAddressIfExists();
if (_.isUndefined(exchangeAddress)) {
this.props.dispatcher.updateShouldBlockchainErrDialogBeOpen(true);
this.setState({
- signingState: SigningState.UNSIGNED,
+ signingState: SigningState.Unsigned,
});
return undefined;
}
@@ -371,7 +371,7 @@ export class GenerateOrderForm extends React.Component<GenerateOrderFormProps, G
}
}
this.setState({
- signingState: globalErrMsg === '' ? SigningState.SIGNED : SigningState.UNSIGNED,
+ signingState: globalErrMsg === '' ? SigningState.Signed : SigningState.Unsigned,
globalErrMsg,
});
return order;
diff --git a/packages/website/ts/components/generate_order/new_token_form.tsx b/packages/website/ts/components/generate_order/new_token_form.tsx
index b8cd88b18..ce684d177 100644
--- a/packages/website/ts/components/generate_order/new_token_form.tsx
+++ b/packages/website/ts/components/generate_order/new_token_form.tsx
@@ -93,7 +93,7 @@ export class NewTokenForm extends React.Component<NewTokenFormProps, NewTokenFor
onClickAsyncFn={this._onAddNewTokenClickAsync.bind(this)}
/>
</div>
- {this.state.globalErrMsg !== '' && <Alert type={AlertTypes.ERROR} message={this.state.globalErrMsg} />}
+ {this.state.globalErrMsg !== '' && <Alert type={AlertTypes.Error} message={this.state.globalErrMsg} />}
</div>
);
}
diff --git a/packages/website/ts/components/inputs/allowance_state_toggle.tsx b/packages/website/ts/components/inputs/allowance_state_toggle.tsx
index 5396295d2..3a78d32f3 100644
--- a/packages/website/ts/components/inputs/allowance_state_toggle.tsx
+++ b/packages/website/ts/components/inputs/allowance_state_toggle.tsx
@@ -150,7 +150,7 @@ export class AllowanceStateToggle extends React.Component<AllowanceStateTogglePr
}
logUtils.log(`Unexpected error encountered: ${err}`);
logUtils.log(err.stack);
- this.props.onErrorOccurred(BalanceErrs.allowanceSettingFailed);
+ this.props.onErrorOccurred(BalanceErrs.AllowanceSettingFailed);
errorReporter.report(err);
}
}
diff --git a/packages/website/ts/components/portal/portal.tsx b/packages/website/ts/components/portal/portal.tsx
index 6d7c90573..59cf2db71 100644
--- a/packages/website/ts/components/portal/portal.tsx
+++ b/packages/website/ts/components/portal/portal.tsx
@@ -229,8 +229,8 @@ export class Portal extends React.Component<PortalProps, PortalState> {
const isAssetPickerDialogOpen = this.state.tokenManagementState !== TokenManagementState.None;
const tokenVisibility =
this.state.tokenManagementState === TokenManagementState.Add
- ? TokenVisibility.UNTRACKED
- : TokenVisibility.TRACKED;
+ ? TokenVisibility.Untracked
+ : TokenVisibility.Tracked;
return (
<Container>
<MetaTags title={DOCUMENT_TITLE} description={DOCUMENT_DESCRIPTION} />
diff --git a/packages/website/ts/components/token_balances.tsx b/packages/website/ts/components/token_balances.tsx
index 2ed0229c8..e8f2a6461 100644
--- a/packages/website/ts/components/token_balances.tsx
+++ b/packages/website/ts/components/token_balances.tsx
@@ -303,7 +303,7 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
currentTokenAddress={''}
onTokenChosen={this._onAssetTokenPicked.bind(this)}
tokenByAddress={this.props.tokenByAddress}
- tokenVisibility={this.state.isAddingToken ? TokenVisibility.UNTRACKED : TokenVisibility.TRACKED}
+ tokenVisibility={this.state.isAddingToken ? TokenVisibility.Untracked : TokenVisibility.Tracked}
/>
</div>
);
@@ -439,7 +439,7 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
}
private _onSendFailed(): void {
this.setState({
- errorType: BalanceErrs.sendFailed,
+ errorType: BalanceErrs.SendFailed,
});
}
private _renderAmount(amount: BigNumber, decimals: number): React.ReactNode {
@@ -460,7 +460,7 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
}
private _renderErrorDialogBody(): React.ReactNode {
switch (this.state.errorType) {
- case BalanceErrs.incorrectNetworkForFaucet:
+ case BalanceErrs.IncorrectNetworkForFaucet:
return (
<div>
Our faucet can only send test Ether to addresses on testnets. Please make sure you are connected
@@ -468,7 +468,7 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
</div>
);
- case BalanceErrs.faucetRequestFailed:
+ case BalanceErrs.FaucetRequestFailed:
return (
<div>
An unexpected error occurred while trying to request test Ether from our faucet. Please refresh
@@ -476,13 +476,13 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
</div>
);
- case BalanceErrs.faucetQueueIsFull:
+ case BalanceErrs.FaucetQueueIsFull:
return <div>Our test Ether faucet queue is full. Please try requesting test Ether again later.</div>;
- case BalanceErrs.mintingFailed:
+ case BalanceErrs.MintingFailed:
return <div>Minting your test tokens failed unexpectedly. Please refresh the page and try again.</div>;
- case BalanceErrs.allowanceSettingFailed:
+ case BalanceErrs.AllowanceSettingFailed:
return (
<div>
An unexpected error occurred while trying to set your test token allowance. Please refresh the
@@ -521,7 +521,7 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
logUtils.log(`Unexpected error encountered: ${err}`);
logUtils.log(err.stack);
this.setState({
- errorType: BalanceErrs.mintingFailed,
+ errorType: BalanceErrs.MintingFailed,
});
errorReporter.report(err);
return false;
@@ -537,7 +537,7 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
// from, we must show user an error message
if (!utils.isTestNetwork(this.props.blockchain.networkId)) {
this.setState({
- errorType: BalanceErrs.incorrectNetworkForFaucet,
+ errorType: BalanceErrs.IncorrectNetworkForFaucet,
});
return false;
}
@@ -553,8 +553,8 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
logUtils.log(`Unexpected status code: ${response.status} -> ${responseBody}`);
const errorType =
response.status === constants.UNAVAILABLE_STATUS
- ? BalanceErrs.faucetQueueIsFull
- : BalanceErrs.faucetRequestFailed;
+ ? BalanceErrs.FaucetQueueIsFull
+ : BalanceErrs.FaucetRequestFailed;
this.setState({
errorType,
});
diff --git a/packages/website/ts/components/ui/alert.tsx b/packages/website/ts/components/ui/alert.tsx
index 32e0f1be8..c7a5b9030 100644
--- a/packages/website/ts/components/ui/alert.tsx
+++ b/packages/website/ts/components/ui/alert.tsx
@@ -8,7 +8,7 @@ interface AlertProps {
}
export const Alert = (props: AlertProps) => {
- const isAlert = props.type === AlertTypes.ERROR;
+ const isAlert = props.type === AlertTypes.Error;
const errMsgStyles = {
background: isAlert ? colors.red200 : colors.lightestGreen,
color: colors.white,
diff --git a/packages/website/ts/components/ui/lifecycle_raised_button.tsx b/packages/website/ts/components/ui/lifecycle_raised_button.tsx
index a8daf4102..f004dd47f 100644
--- a/packages/website/ts/components/ui/lifecycle_raised_button.tsx
+++ b/packages/website/ts/components/ui/lifecycle_raised_button.tsx
@@ -6,9 +6,9 @@ import * as React from 'react';
const COMPLETE_STATE_SHOW_LENGTH_MS = 2000;
enum ButtonState {
- READY,
- LOADING,
- COMPLETE,
+ Ready,
+ Loading,
+ Complete,
}
interface LifeCycleRaisedButtonProps {
@@ -38,7 +38,7 @@ export class LifeCycleRaisedButton extends React.Component<LifeCycleRaisedButton
constructor(props: LifeCycleRaisedButtonProps) {
super(props);
this.state = {
- buttonState: ButtonState.READY,
+ buttonState: ButtonState.Ready,
};
}
public componentWillUnmount(): void {
@@ -52,13 +52,13 @@ export class LifeCycleRaisedButton extends React.Component<LifeCycleRaisedButton
let label;
switch (this.state.buttonState) {
- case ButtonState.READY:
+ case ButtonState.Ready:
label = this.props.labelReady;
break;
- case ButtonState.LOADING:
+ case ButtonState.Loading:
label = this.props.labelLoading;
break;
- case ButtonState.COMPLETE:
+ case ButtonState.Complete:
label = this.props.labelComplete;
break;
default:
@@ -72,13 +72,13 @@ export class LifeCycleRaisedButton extends React.Component<LifeCycleRaisedButton
backgroundColor={this.props.backgroundColor}
labelColor={this.props.labelColor}
onClick={this.onClickAsync.bind(this)}
- disabled={this.props.isDisabled || this.state.buttonState !== ButtonState.READY}
+ disabled={this.props.isDisabled || this.state.buttonState !== ButtonState.Ready}
/>
);
}
public async onClickAsync(): Promise<void> {
this.setState({
- buttonState: ButtonState.LOADING,
+ buttonState: ButtonState.Loading,
});
const didSucceed = await this.props.onClickAsyncFn();
if (this._didUnmount) {
@@ -86,16 +86,16 @@ export class LifeCycleRaisedButton extends React.Component<LifeCycleRaisedButton
}
if (didSucceed) {
this.setState({
- buttonState: ButtonState.COMPLETE,
+ buttonState: ButtonState.Complete,
});
this._buttonTimeoutId = window.setTimeout(() => {
this.setState({
- buttonState: ButtonState.READY,
+ buttonState: ButtonState.Ready,
});
}, COMPLETE_STATE_SHOW_LENGTH_MS);
} else {
this.setState({
- buttonState: ButtonState.READY,
+ buttonState: ButtonState.Ready,
});
}
}