Skip to content

Commit

Permalink
feat(MMPD-546): update portfolio icon (#6795)
Browse files Browse the repository at this point in the history
* feat(MMPD-546): update portfolio icon

* feat(MMPD-546): lint, update to use translations, keep test id

* Update index.tsx

change icon

* fix snapshots

---------

Co-authored-by: sethkfman <10342624+sethkfman@users.noreply.github.com>
  • Loading branch information
GuiBibeau and sethkfman authored Jul 13, 2023
1 parent 06a9467 commit 0798f07
Show file tree
Hide file tree
Showing 3 changed files with 152 additions and 66 deletions.
192 changes: 141 additions & 51 deletions app/components/UI/Tokens/__snapshots__/index.test.tsx.snap
Original file line number Diff line number Diff line change
Expand Up @@ -321,7 +321,8 @@ exports[`Tokens should hide zero balance tokens when setting is on 1`] = `
Object {
"alignItems": "center",
"flexDirection": "row",
"marginLeft": 16,
"justifyContent": "space-between",
"marginHorizontal": 16,
"marginVertical": 24,
}
}
Expand All @@ -339,21 +340,20 @@ exports[`Tokens should hide zero balance tokens when setting is on 1`] = `
>
0 USD
</Text>
<TouchableOpacity
<Button
endIconName="Export"
label="Portfolio"
onPress={[Function]}
size="40"
style={
Object {
"marginLeft": 8,
"marginVertical": 5,
}
}
testID="portfolio-button"
>
<Icon
color="Primary"
name="Diagram"
size="20"
/>
</TouchableOpacity>
variant="Secondary"
width="full"
/>
</View>
}
data={
Expand Down Expand Up @@ -415,7 +415,8 @@ exports[`Tokens should hide zero balance tokens when setting is on 1`] = `
Object {
"alignItems": "center",
"flexDirection": "row",
"marginLeft": 16,
"justifyContent": "space-between",
"marginHorizontal": 16,
"marginVertical": 24,
}
}
Expand All @@ -436,25 +437,54 @@ exports[`Tokens should hide zero balance tokens when setting is on 1`] = `
0 USD
</Text>
<TouchableOpacity
activeOpacity={0.5}
onPress={[Function]}
onPressIn={[Function]}
onPressOut={[Function]}
style={
Object {
"marginLeft": 8,
"alignItems": "center",
"alignSelf": "stretch",
"backgroundColor": "transparent",
"borderColor": "#0376C9",
"borderRadius": 20,
"borderWidth": 1,
"flexDirection": "row",
"height": 40,
"justifyContent": "center",
"marginVertical": 5,
"paddingHorizontal": 16,
}
}
testID="portfolio-button"
variant="Secondary"
>
<Text
style={
Object {
"color": "#0376C9",
"fontFamily": "Euclid Circular B",
"fontSize": 14,
"fontWeight": "400",
"letterSpacing": 0,
"lineHeight": 22,
}
}
>
Portfolio
</Text>
<SvgMock
color="#0376C9"
height={20}
name="Diagram"
height={16}
name="Export"
style={
Object {
"height": 20,
"width": 20,
"height": 16,
"marginLeft": 8,
"width": 16,
}
}
width={20}
width={16}
/>
</TouchableOpacity>
</View>
Expand Down Expand Up @@ -1276,7 +1306,8 @@ exports[`Tokens should render correctly 1`] = `
Object {
"alignItems": "center",
"flexDirection": "row",
"marginLeft": 16,
"justifyContent": "space-between",
"marginHorizontal": 16,
"marginVertical": 24,
}
}
Expand All @@ -1294,21 +1325,20 @@ exports[`Tokens should render correctly 1`] = `
>
0 USD
</Text>
<TouchableOpacity
<Button
endIconName="Export"
label="Portfolio"
onPress={[Function]}
size="40"
style={
Object {
"marginLeft": 8,
"marginVertical": 5,
}
}
testID="portfolio-button"
>
<Icon
color="Primary"
name="Diagram"
size="20"
/>
</TouchableOpacity>
variant="Secondary"
width="full"
/>
</View>
}
data={
Expand Down Expand Up @@ -1370,7 +1400,8 @@ exports[`Tokens should render correctly 1`] = `
Object {
"alignItems": "center",
"flexDirection": "row",
"marginLeft": 16,
"justifyContent": "space-between",
"marginHorizontal": 16,
"marginVertical": 24,
}
}
Expand All @@ -1391,25 +1422,54 @@ exports[`Tokens should render correctly 1`] = `
0 USD
</Text>
<TouchableOpacity
activeOpacity={0.5}
onPress={[Function]}
onPressIn={[Function]}
onPressOut={[Function]}
style={
Object {
"marginLeft": 8,
"alignItems": "center",
"alignSelf": "stretch",
"backgroundColor": "transparent",
"borderColor": "#0376C9",
"borderRadius": 20,
"borderWidth": 1,
"flexDirection": "row",
"height": 40,
"justifyContent": "center",
"marginVertical": 5,
"paddingHorizontal": 16,
}
}
testID="portfolio-button"
variant="Secondary"
>
<Text
style={
Object {
"color": "#0376C9",
"fontFamily": "Euclid Circular B",
"fontSize": 14,
"fontWeight": "400",
"letterSpacing": 0,
"lineHeight": 22,
}
}
>
Portfolio
</Text>
<SvgMock
color="#0376C9"
height={20}
name="Diagram"
height={16}
name="Export"
style={
Object {
"height": 20,
"width": 20,
"height": 16,
"marginLeft": 8,
"width": 16,
}
}
width={20}
width={16}
/>
</TouchableOpacity>
</View>
Expand Down Expand Up @@ -2231,7 +2291,8 @@ exports[`Tokens should show all balance tokens when hideZeroBalanceTokens settin
Object {
"alignItems": "center",
"flexDirection": "row",
"marginLeft": 16,
"justifyContent": "space-between",
"marginHorizontal": 16,
"marginVertical": 24,
}
}
Expand All @@ -2249,21 +2310,20 @@ exports[`Tokens should show all balance tokens when hideZeroBalanceTokens settin
>
0 USD
</Text>
<TouchableOpacity
<Button
endIconName="Export"
label="Portfolio"
onPress={[Function]}
size="40"
style={
Object {
"marginLeft": 8,
"marginVertical": 5,
}
}
testID="portfolio-button"
>
<Icon
color="Primary"
name="Diagram"
size="20"
/>
</TouchableOpacity>
variant="Secondary"
width="full"
/>
</View>
}
data={
Expand Down Expand Up @@ -2333,7 +2393,8 @@ exports[`Tokens should show all balance tokens when hideZeroBalanceTokens settin
Object {
"alignItems": "center",
"flexDirection": "row",
"marginLeft": 16,
"justifyContent": "space-between",
"marginHorizontal": 16,
"marginVertical": 24,
}
}
Expand All @@ -2354,25 +2415,54 @@ exports[`Tokens should show all balance tokens when hideZeroBalanceTokens settin
0 USD
</Text>
<TouchableOpacity
activeOpacity={0.5}
onPress={[Function]}
onPressIn={[Function]}
onPressOut={[Function]}
style={
Object {
"marginLeft": 8,
"alignItems": "center",
"alignSelf": "stretch",
"backgroundColor": "transparent",
"borderColor": "#0376C9",
"borderRadius": 20,
"borderWidth": 1,
"flexDirection": "row",
"height": 40,
"justifyContent": "center",
"marginVertical": 5,
"paddingHorizontal": 16,
}
}
testID="portfolio-button"
variant="Secondary"
>
<Text
style={
Object {
"color": "#0376C9",
"fontFamily": "Euclid Circular B",
"fontSize": 14,
"fontWeight": "400",
"letterSpacing": 0,
"lineHeight": 22,
}
}
>
Portfolio
</Text>
<SvgMock
color="#0376C9"
height={20}
name="Diagram"
height={16}
name="Export"
style={
Object {
"height": 20,
"width": 20,
"height": 16,
"marginLeft": 8,
"width": 16,
}
}
width={20}
width={16}
/>
</TouchableOpacity>
</View>
Expand Down
23 changes: 9 additions & 14 deletions app/components/UI/Tokens/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -72,11 +72,7 @@ import SkeletonText from '../../../components/UI/FiatOnRampAggregator/components
import Routes from '../../../constants/navigation/Routes';
import { TOKEN_BALANCE_LOADING, TOKEN_RATE_UNDEFINED } from './constants';
import AppConstants from '../../../core/AppConstants';
import Icon, {
IconColor,
IconName,
IconSize,
} from '../../../component-library/components/Icons/Icon';
import { IconName } from '../../../component-library/components/Icons/Icon';

import {
PORTFOLIO_BUTTON,
Expand Down Expand Up @@ -455,17 +451,16 @@ const Tokens: React.FC<TokensI> = ({ tokens }) => {
>
{fiatBalance}
</Text>
<TouchableOpacity
<Button
variant={ButtonVariants.Secondary}
size={ButtonSize.Md}
width={ButtonWidthTypes.Full}
style={styles.buyButton}
onPress={onOpenPortfolio}
style={styles.portfolioLink}
label={strings('asset_overview.portfolio_button')}
{...generateTestId(Platform, PORTFOLIO_BUTTON)}
>
<Icon
color={IconColor.Primary}
name={IconName.Diagram}
size={IconSize.Md}
/>
</TouchableOpacity>
endIconName={IconName.Export}
/>
</View>
);
};
Expand Down
3 changes: 2 additions & 1 deletion app/components/UI/Tokens/styles.ts
Original file line number Diff line number Diff line change
Expand Up @@ -89,7 +89,8 @@ const createStyles = (colors: Colors) =>
networth: {
flexDirection: 'row',
alignItems: 'center',
marginLeft: 16,
marginHorizontal: 16,
justifyContent: 'space-between',
marginVertical: 24,
},
fiatBalance: {
Expand Down

0 comments on commit 0798f07

Please sign in to comment.