arno/trezor-wallet
1
0
Fork 0
mirror of https://github.com/trezor/trezor-wallet synced 2025-01-09 07:30:58 +00:00
Code Issues Releases Wiki Activity

fix DeviceIcon component

Browse Source
This commit is contained in:
slowbackspace 2019-03-19 16:34:30 +01:00
parent 50a7bcf97e
commit 6ea3aac8aa
1 changed files with 6 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
src/components/images/DeviceIcon/index.js
View File

@ -2,8 +2,7 @@
import React from 'react'; import React from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import { colors as COLORS, icons as ICONS } from 'trezor-ui-components'; import { Icon, colors as COLORS, icons } from 'trezor-ui-components';
import styled from 'styled-components';
import type { TrezorDevice } from 'flowtype'; import type { TrezorDevice } from 'flowtype';
type Props = { type Props = {
@ -14,26 +13,14 @@ type Props = {
onClick?: any, onClick?: any,
}; };
const SvgWrapper = styled.svg`
:hover {
path {
fill: ${props => props.hoverColor};
}
}
`;
const Path = styled.path`
fill: ${props => props.color};
`;
const getDeviceIcon = (majorVersion: number) => { const getDeviceIcon = (majorVersion: number) => {
switch (majorVersion) { switch (majorVersion) {
case 1: case 1:
return ICONS.T1; return icons.T1;
case 2: case 2:
return ICONS.T2; return icons.T2;
default: default:
return ICONS.T2; return icons.T2;
} }
}; };
@ -45,17 +32,8 @@ const DeviceIcon = ({
onClick, onClick,
}: Props) => { }: Props) => {
const majorVersion = device.features ? device.features.major_version : 2; const majorVersion = device.features ? device.features.major_version : 2;
return ( const icon = getDeviceIcon(majorVersion);
<SvgWrapper return <Icon icon={icon} hoverColor={hoverColor} onClick={onClick} color={color} size={size} />;
hoverColor={hoverColor}
width={`${size}`}
height={`${size}`}
viewBox="0 0 1024 1024"
onClick={onClick}
>
<Path key={majorVersion} color={color} d={getDeviceIcon(majorVersion)} />
</SvgWrapper>
);
}; };
DeviceIcon.propTypes = { DeviceIcon.propTypes = {