Skip to content

Commit

Permalink
Feature: EIP747 watchAsset (#576)
Browse files Browse the repository at this point in the history
* watchasset erc20 basic support

* render watchasset modal

* handle watchasset call

* handle watchasset rejection

* handle watched asset images

* missing strings

* snapshots

* bump gaba

* fix styles

* snapshots

* styles update

* pin dep

* install
  • Loading branch information
estebanmino authored Apr 3, 2019
1 parent 6f64728 commit b3857df
Show file tree
Hide file tree
Showing 13 changed files with 572 additions and 9 deletions.
8 changes: 6 additions & 2 deletions app/components/UI/AssetIcon/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -18,16 +18,20 @@ const styles = StyleSheet.create({
// eslint-disable-next-line react/display-name
const AssetIcon = React.memo(props => {
if (!props.logo) return null;
const uri = getAssetLogoPath(props.logo);
const uri = props.watchedAsset ? props.logo : getAssetLogoPath(props.logo);
const style = [styles.logo, props.customStyle];
return <Image fadeIn placeholderStyle={{ backgroundColor: colors.white }} source={{ uri }} style={style} />;
});

AssetIcon.propTypes = {
/**
* String of the asset icon
* String of the asset icon to be searched in contractMap
*/
logo: PropTypes.string,
/**
* Whether logo has to be fetched from eth-contract-metadata
*/
watchedAsset: PropTypes.bool,
/**
* Custom style to apply to image
*/
Expand Down
9 changes: 7 additions & 2 deletions app/components/UI/AssetOverview/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -92,12 +92,17 @@ class AssetOverview extends Component {

renderLogo = () => {
const {
asset: { address, logo, symbol }
asset: { address, image, logo, symbol }
} = this.props;
if (symbol === 'ETH') {
return <Image source={ethLogo} style={styles.ethLogo} />;
}
return logo ? <AssetIcon logo={logo} /> : <Identicon address={address} />;
const watchedAsset = image !== undefined;
return logo || image ? (
<AssetIcon watchedAsset={watchedAsset} logo={image || logo} />
) : (
<Identicon address={address} />
);
};

render() {
Expand Down
7 changes: 4 additions & 3 deletions app/components/UI/TokenImage/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -50,11 +50,12 @@ export default class TokenElement extends Component {
asset.logo = contractMap[checksumAddress].logo;
}
}

// When image is defined, is coming from a token added by watchAsset, so it has to be handled alone
const watchedAsset = asset.image !== undefined;
return (
<View style={[styles.itemLogoWrapper, containerStyle]}>
{asset.logo ? (
<AssetIcon logo={asset.logo} customStyle={iconStyle} />
{asset.logo || asset.image ? (
<AssetIcon watchedAsset={watchedAsset} logo={asset.image || asset.logo} customStyle={iconStyle} />
) : (
<Identicon address={asset.address} customStyle={iconStyle} />
)}
Expand Down
212 changes: 212 additions & 0 deletions app/components/UI/WatchAssetRequest/__snapshots__/index.test.js.snap
Original file line number Diff line number Diff line change
@@ -0,0 +1,212 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`WatchAssetRequest should render correctly 1`] = `
<View
style={
Object {
"backgroundColor": "#FFFFFF",
"borderTopLeftRadius": 10,
"borderTopRightRadius": 10,
"minHeight": "50%",
"paddingBottom": 20,
}
}
>
<View>
<Text
style={
Object {
"color": "#000000",
"fontFamily": "Roboto",
"fontSize": 18,
"fontWeight": "600",
"marginHorizontal": 20,
"marginVertical": 12,
"textAlign": "center",
}
}
>
Add Suggested Token
</Text>
</View>
<ActionView
cancelTestID="request-signature-cancel-button"
cancelText="CANCEL"
confirmButtonMode="normal"
confirmTestID="request-signature-confirm-button"
confirmText="ADD TOKEN"
confirmed={false}
onConfirmPress={[Function]}
showCancelButton={true}
showConfirmButton={true}
>
<View
style={
Object {
"alignItems": "center",
"borderTopColor": "#d2d8dd",
"borderTopWidth": 1,
}
}
>
<View
style={
Object {
"flexDirection": "row",
"margin": 20,
}
}
>
<Text
style={
Object {
"fontFamily": "Roboto",
"fontSize": 16,
"fontWeight": "400",
}
}
>
Would you like to add this token?
</Text>
</View>
<View
style={
Object {
"alignItems": "flex-start",
"flex": 1,
"flexDirection": "row",
"marginHorizontal": 40,
"marginVertical": 30,
}
}
>
<View
style={
Object {
"flex": 1,
"flexDirection": "column",
}
}
>
<View
style={
Object {
"alignItems": "center",
}
}
>
<Text
style={
Object {
"fontFamily": "Roboto",
"fontWeight": "600",
}
}
>
Token
</Text>
</View>
<View
style={
Object {
"alignItems": "center",
}
}
>
<View
style={
Object {
"flexDirection": "row",
}
}
>
<View
style={
Object {
"paddingVertical": 10,
}
}
>
<TokenElement
asset={
Object {
"address": "0x2",
"decimals": 0,
"logo": undefined,
"symbol": "TKN",
}
}
logoDefined={true}
/>
</View>
<Text
style={
Object {
"fontFamily": "Roboto",
"fontSize": 16,
"fontWeight": "400",
"paddingHorizontal": 10,
"paddingTop": 25,
}
}
>
TKN
</Text>
</View>
</View>
</View>
<View
style={
Object {
"flex": 1,
"flexDirection": "column",
}
}
>
<View
style={
Object {
"alignItems": "center",
}
}
>
<Text
style={
Object {
"fontFamily": "Roboto",
"fontWeight": "600",
}
}
>
Balance
</Text>
</View>
<View
style={
Object {
"alignItems": "center",
}
}
>
<Text
style={
Object {
"fontFamily": "Roboto",
"fontSize": 16,
"fontWeight": "400",
"paddingHorizontal": 10,
"paddingTop": 25,
}
}
>
0
TKN
</Text>
</View>
</View>
</View>
</View>
</ActionView>
</View>
`;
Loading

0 comments on commit b3857df

Please sign in to comment.