Skip to content

Commit b4e2393

Browse files
authored
Merge pull request #5441 from EdgeApp/jon/fix/markets-buttons
Jon/fix/markets-buttons
2 parents 4c12abe + e4ad258 commit b4e2393

File tree

8 files changed

+400
-147
lines changed

8 files changed

+400
-147
lines changed

src/__tests__/components/__snapshots__/TransactionListTop.test.tsx.snap

Lines changed: 194 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -464,7 +464,7 @@ exports[`TransactionListTop should render (with ENABLE_VISA_PROGRAM) 1`] = `
464464
{
465465
"busy": undefined,
466466
"checked": undefined,
467-
"disabled": false,
467+
"disabled": undefined,
468468
"expanded": undefined,
469469
"selected": undefined,
470470
}
@@ -573,7 +573,7 @@ exports[`TransactionListTop should render (with ENABLE_VISA_PROGRAM) 1`] = `
573573
{
574574
"busy": undefined,
575575
"checked": undefined,
576-
"disabled": false,
576+
"disabled": undefined,
577577
"expanded": undefined,
578578
"selected": undefined,
579579
}
@@ -677,24 +677,112 @@ exports[`TransactionListTop should render (with ENABLE_VISA_PROGRAM) 1`] = `
677677
Send
678678
</Text>
679679
</View>
680-
<ActivityIndicator
681-
color="#00f1a2"
680+
<View
681+
accessibilityState={
682+
{
683+
"busy": undefined,
684+
"checked": undefined,
685+
"disabled": true,
686+
"expanded": undefined,
687+
"selected": undefined,
688+
}
689+
}
690+
accessibilityValue={
691+
{
692+
"max": undefined,
693+
"min": undefined,
694+
"now": undefined,
695+
"text": undefined,
696+
}
697+
}
698+
accessible={false}
699+
collapsable={false}
700+
focusable={true}
701+
onClick={[Function]}
702+
onResponderGrant={[Function]}
703+
onResponderMove={[Function]}
704+
onResponderRelease={[Function]}
705+
onResponderTerminate={[Function]}
706+
onResponderTerminationRequest={[Function]}
707+
onStartShouldSetResponder={[Function]}
682708
style={
683709
{
684710
"alignItems": "center",
685-
"flexDirection": "row",
711+
"flexShrink": 1,
686712
"justifyContent": "center",
687-
"minWidth": 67,
688-
"paddingRight": 22,
713+
"marginHorizontal": -22,
714+
"marginVertical": 11,
715+
"opacity": 1,
716+
"paddingHorizontal": 22,
689717
}
690718
}
691-
/>
719+
>
720+
<View
721+
style={
722+
{
723+
"alignItems": "center",
724+
"flexShrink": 1,
725+
"justifyContent": "center",
726+
"marginBottom": 6,
727+
"paddingTop": 11,
728+
}
729+
}
730+
>
731+
<View
732+
style={
733+
{
734+
"alignItems": "center",
735+
"backgroundColor": "rgba(255, 255, 255, .1)",
736+
"borderRadius": 33.5,
737+
"height": 67,
738+
"justifyContent": "center",
739+
"width": 67,
740+
}
741+
}
742+
>
743+
<ActivityIndicator
744+
color="#00f1a2"
745+
style={
746+
{
747+
"alignItems": "center",
748+
"flexDirection": "row",
749+
"justifyContent": "center",
750+
"minWidth": 67,
751+
"paddingRight": 22,
752+
}
753+
}
754+
/>
755+
</View>
756+
</View>
757+
<Text
758+
adjustsFontSizeToFit={true}
759+
minimumFontScale={0.65}
760+
numberOfLines={1}
761+
style={
762+
[
763+
{
764+
"color": "#FFFFFF",
765+
"fontFamily": "Quicksand-Regular",
766+
"fontSize": 22,
767+
"includeFontPadding": false,
768+
},
769+
{
770+
"marginBottom": 11,
771+
"textAlign": "center",
772+
},
773+
null,
774+
]
775+
}
776+
>
777+
Earn
778+
</Text>
779+
</View>
692780
<View
693781
accessibilityState={
694782
{
695783
"busy": undefined,
696784
"checked": undefined,
697-
"disabled": false,
785+
"disabled": undefined,
698786
"expanded": undefined,
699787
"selected": undefined,
700788
}
@@ -1439,7 +1527,7 @@ exports[`TransactionListTop should render 1`] = `
14391527
{
14401528
"busy": undefined,
14411529
"checked": undefined,
1442-
"disabled": false,
1530+
"disabled": undefined,
14431531
"expanded": undefined,
14441532
"selected": undefined,
14451533
}
@@ -1548,7 +1636,7 @@ exports[`TransactionListTop should render 1`] = `
15481636
{
15491637
"busy": undefined,
15501638
"checked": undefined,
1551-
"disabled": false,
1639+
"disabled": undefined,
15521640
"expanded": undefined,
15531641
"selected": undefined,
15541642
}
@@ -1652,24 +1740,112 @@ exports[`TransactionListTop should render 1`] = `
16521740
Send
16531741
</Text>
16541742
</View>
1655-
<ActivityIndicator
1656-
color="#00f1a2"
1743+
<View
1744+
accessibilityState={
1745+
{
1746+
"busy": undefined,
1747+
"checked": undefined,
1748+
"disabled": true,
1749+
"expanded": undefined,
1750+
"selected": undefined,
1751+
}
1752+
}
1753+
accessibilityValue={
1754+
{
1755+
"max": undefined,
1756+
"min": undefined,
1757+
"now": undefined,
1758+
"text": undefined,
1759+
}
1760+
}
1761+
accessible={false}
1762+
collapsable={false}
1763+
focusable={true}
1764+
onClick={[Function]}
1765+
onResponderGrant={[Function]}
1766+
onResponderMove={[Function]}
1767+
onResponderRelease={[Function]}
1768+
onResponderTerminate={[Function]}
1769+
onResponderTerminationRequest={[Function]}
1770+
onStartShouldSetResponder={[Function]}
16571771
style={
16581772
{
16591773
"alignItems": "center",
1660-
"flexDirection": "row",
1774+
"flexShrink": 1,
16611775
"justifyContent": "center",
1662-
"minWidth": 67,
1663-
"paddingRight": 22,
1776+
"marginHorizontal": -22,
1777+
"marginVertical": 11,
1778+
"opacity": 1,
1779+
"paddingHorizontal": 22,
16641780
}
16651781
}
1666-
/>
1782+
>
1783+
<View
1784+
style={
1785+
{
1786+
"alignItems": "center",
1787+
"flexShrink": 1,
1788+
"justifyContent": "center",
1789+
"marginBottom": 6,
1790+
"paddingTop": 11,
1791+
}
1792+
}
1793+
>
1794+
<View
1795+
style={
1796+
{
1797+
"alignItems": "center",
1798+
"backgroundColor": "rgba(255, 255, 255, .1)",
1799+
"borderRadius": 33.5,
1800+
"height": 67,
1801+
"justifyContent": "center",
1802+
"width": 67,
1803+
}
1804+
}
1805+
>
1806+
<ActivityIndicator
1807+
color="#00f1a2"
1808+
style={
1809+
{
1810+
"alignItems": "center",
1811+
"flexDirection": "row",
1812+
"justifyContent": "center",
1813+
"minWidth": 67,
1814+
"paddingRight": 22,
1815+
}
1816+
}
1817+
/>
1818+
</View>
1819+
</View>
1820+
<Text
1821+
adjustsFontSizeToFit={true}
1822+
minimumFontScale={0.65}
1823+
numberOfLines={1}
1824+
style={
1825+
[
1826+
{
1827+
"color": "#FFFFFF",
1828+
"fontFamily": "Quicksand-Regular",
1829+
"fontSize": 22,
1830+
"includeFontPadding": false,
1831+
},
1832+
{
1833+
"marginBottom": 11,
1834+
"textAlign": "center",
1835+
},
1836+
null,
1837+
]
1838+
}
1839+
>
1840+
Earn
1841+
</Text>
1842+
</View>
16671843
<View
16681844
accessibilityState={
16691845
{
16701846
"busy": undefined,
16711847
"checked": undefined,
1672-
"disabled": false,
1848+
"disabled": undefined,
16731849
"expanded": undefined,
16741850
"selected": undefined,
16751851
}

src/components/buttons/IconButton.tsx

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,9 @@ export interface Props {
1313
/** React node that gets rendered within the circular container area */
1414
children?: React.ReactNode
1515

16+
/** Whether the button is disabled */
17+
disabled?: boolean
18+
1619
/** Text to render on top of a primary gradient container in the top right */
1720
superscriptLabel?: string
1821

@@ -29,7 +32,7 @@ export interface Props {
2932
* container, if given.
3033
*/
3134
export const IconButton = (props: Props) => {
32-
const { children, superscriptLabel, label, sizeRem = 3, testID, onPress } = props
35+
const { children, disabled, superscriptLabel, label, sizeRem = 3, testID, onPress } = props
3336
const theme = useTheme()
3437
const styles = getStyles(theme)
3538

@@ -46,7 +49,7 @@ export const IconButton = (props: Props) => {
4649
)
4750

4851
return (
49-
<EdgeTouchableOpacity accessible={false} style={styles.tappableArea} onPress={onPress} testID={testID}>
52+
<EdgeTouchableOpacity accessible={false} style={styles.tappableArea} onPress={onPress} testID={testID} disabled={disabled}>
5053
<View style={styles.topContainer}>
5154
<View style={iconContainerStyle}>{children}</View>
5255
{superscriptLabel == null ? null : (

0 commit comments

Comments
 (0)