crowetic/protocol
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Create AccountConnection component

Browse Source
This commit is contained in:
Brandon Millman
2018-06-28 23:24:57 -07:00
parent 81ff99276b
commit 08f7666d21
3 changed files with 61 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
packages/website/ts/components/top_bar/provider_display.tsx
View File

@@ -8,6 +8,7 @@ import * as React from 'react';
import { Blockchain } from 'ts/blockchain';
import { ProviderPicker } from 'ts/components/top_bar/provider_picker';
import { AccountConnection } from 'ts/components/ui/account_connection';
import { Circle } from 'ts/components/ui/circle';
import { Container } from 'ts/components/ui/container';
import { DropDown } from 'ts/components/ui/drop_down';
@@ -189,16 +190,11 @@ export class ProviderDisplay extends React.Component<ProviderDisplayProps, Provi
switch (accountState) {
case AccountState.Ready:
case AccountState.Locked:
const circleColor = this._getInjectedProviderColor();
return (
<Container className="flex items-center">
<Circle diameter={6} fillColor={circleColor} />
<Container marginLeft="6px">
<Text fontSize="12px" lineHeight="14px" fontColor={colors.darkGrey}>
{this.props.injectedProviderName}
</Text>
</Container>
</Container>
<AccountConnection
accountState={accountState}
injectedProviderName={this.props.injectedProviderName}
/>
);
case AccountState.Disconnected:
case AccountState.Loading:
@@ -206,18 +202,6 @@ export class ProviderDisplay extends React.Component<ProviderDisplayProps, Provi
return null;
}
}
private _getInjectedProviderColor(): string {
const accountState = this._getAccountState();
switch (accountState) {
case AccountState.Ready:
return colors.green;
case AccountState.Locked:
case AccountState.Loading:
case AccountState.Disconnected:
default:
return colors.red;
}
}
private _isBlockchainReady(): boolean {
return this.props.blockchainIsLoaded && !_.isUndefined(this.props.blockchain);
}