Skip to content

Jon/fix/markets-buttons #5441

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
Jon-edge merged 6 commits into from
Feb 11, 2025
Merged

Jon/fix/markets-buttons #5441

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
7d5596e
Include tokens in highest balance search
Jon-edge Jan 30, 2025
9552821
Add `disabled` prop to `IconButton`
Jon-edge Feb 4, 2025
20bfdb2
Refactor common utility code from TransactionListTop
Jon-edge Feb 4, 2025
ca6bb0b
Fix "Earn" Button
Jon-edge Feb 4, 2025
67705c9
Rename "Trade" -> "Swap"
Jon-edge Feb 4, 2025
e4ad258
Make modal titles specific to the action
Jon-edge Feb 4, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
212 changes: 194 additions & 18 deletions src/__tests__/components/__snapshots__/TransactionListTop.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -464,7 +464,7 @@ exports[`TransactionListTop should render (with ENABLE_VISA_PROGRAM) 1`] = `
{
"busy": undefined,
"checked": undefined,
"disabled": false,
"disabled": undefined,
"expanded": undefined,
"selected": undefined,
}
Expand Down Expand Up @@ -573,7 +573,7 @@ exports[`TransactionListTop should render (with ENABLE_VISA_PROGRAM) 1`] = `
{
"busy": undefined,
"checked": undefined,
"disabled": false,
"disabled": undefined,
"expanded": undefined,
"selected": undefined,
}
Expand Down Expand Up @@ -677,24 +677,112 @@ exports[`TransactionListTop should render (with ENABLE_VISA_PROGRAM) 1`] = `
Send
</Text>
</View>
<ActivityIndicator
color="#00f1a2"
<View
accessibilityState={
{
"busy": undefined,
"checked": undefined,
"disabled": true,
"expanded": undefined,
"selected": undefined,
}
}
accessibilityValue={
{
"max": undefined,
"min": undefined,
"now": undefined,
"text": undefined,
}
}
accessible={false}
collapsable={false}
focusable={true}
onClick={[Function]}
onResponderGrant={[Function]}
onResponderMove={[Function]}
onResponderRelease={[Function]}
onResponderTerminate={[Function]}
onResponderTerminationRequest={[Function]}
onStartShouldSetResponder={[Function]}
style={
{
"alignItems": "center",
"flexDirection": "row",
"flexShrink": 1,
"justifyContent": "center",
"minWidth": 67,
"paddingRight": 22,
"marginHorizontal": -22,
"marginVertical": 11,
"opacity": 1,
"paddingHorizontal": 22,
}
}
/>
>
<View
style={
{
"alignItems": "center",
"flexShrink": 1,
"justifyContent": "center",
"marginBottom": 6,
"paddingTop": 11,
}
}
>
<View
style={
{
"alignItems": "center",
"backgroundColor": "rgba(255, 255, 255, .1)",
"borderRadius": 33.5,
"height": 67,
"justifyContent": "center",
"width": 67,
}
}
>
<ActivityIndicator
color="#00f1a2"
style={
{
"alignItems": "center",
"flexDirection": "row",
"justifyContent": "center",
"minWidth": 67,
"paddingRight": 22,
}
}
/>
</View>
</View>
<Text
adjustsFontSizeToFit={true}
minimumFontScale={0.65}
numberOfLines={1}
style={
[
{
"color": "#FFFFFF",
"fontFamily": "Quicksand-Regular",
"fontSize": 22,
"includeFontPadding": false,
},
{
"marginBottom": 11,
"textAlign": "center",
},
null,
]
}
>
Earn
</Text>
</View>
<View
accessibilityState={
{
"busy": undefined,
"checked": undefined,
"disabled": false,
"disabled": undefined,
"expanded": undefined,
"selected": undefined,
}
Expand Down Expand Up @@ -1439,7 +1527,7 @@ exports[`TransactionListTop should render 1`] = `
{
"busy": undefined,
"checked": undefined,
"disabled": false,
"disabled": undefined,
"expanded": undefined,
"selected": undefined,
}
Expand Down Expand Up @@ -1548,7 +1636,7 @@ exports[`TransactionListTop should render 1`] = `
{
"busy": undefined,
"checked": undefined,
"disabled": false,
"disabled": undefined,
"expanded": undefined,
"selected": undefined,
}
Expand Down Expand Up @@ -1652,24 +1740,112 @@ exports[`TransactionListTop should render 1`] = `
Send
</Text>
</View>
<ActivityIndicator
color="#00f1a2"
<View
accessibilityState={
{
"busy": undefined,
"checked": undefined,
"disabled": true,
"expanded": undefined,
"selected": undefined,
}
}
accessibilityValue={
{
"max": undefined,
"min": undefined,
"now": undefined,
"text": undefined,
}
}
accessible={false}
collapsable={false}
focusable={true}
onClick={[Function]}
onResponderGrant={[Function]}
onResponderMove={[Function]}
onResponderRelease={[Function]}
onResponderTerminate={[Function]}
onResponderTerminationRequest={[Function]}
onStartShouldSetResponder={[Function]}
style={
{
"alignItems": "center",
"flexDirection": "row",
"flexShrink": 1,
"justifyContent": "center",
"minWidth": 67,
"paddingRight": 22,
"marginHorizontal": -22,
"marginVertical": 11,
"opacity": 1,
"paddingHorizontal": 22,
}
}
/>
>
<View
style={
{
"alignItems": "center",
"flexShrink": 1,
"justifyContent": "center",
"marginBottom": 6,
"paddingTop": 11,
}
}
>
<View
style={
{
"alignItems": "center",
"backgroundColor": "rgba(255, 255, 255, .1)",
"borderRadius": 33.5,
"height": 67,
"justifyContent": "center",
"width": 67,
}
}
>
<ActivityIndicator
color="#00f1a2"
style={
{
"alignItems": "center",
"flexDirection": "row",
"justifyContent": "center",
"minWidth": 67,
"paddingRight": 22,
}
}
/>
</View>
</View>
<Text
adjustsFontSizeToFit={true}
minimumFontScale={0.65}
numberOfLines={1}
style={
[
{
"color": "#FFFFFF",
"fontFamily": "Quicksand-Regular",
"fontSize": 22,
"includeFontPadding": false,
},
{
"marginBottom": 11,
"textAlign": "center",
},
null,
]
}
>
Earn
</Text>
</View>
<View
accessibilityState={
{
"busy": undefined,
"checked": undefined,
"disabled": false,
"disabled": undefined,
"expanded": undefined,
"selected": undefined,
}
Expand Down
7 changes: 5 additions & 2 deletions src/components/buttons/IconButton.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,9 @@ export interface Props {
/** React node that gets rendered within the circular container area */
children?: React.ReactNode

/** Whether the button is disabled */
disabled?: boolean

/** Text to render on top of a primary gradient container in the top right */
superscriptLabel?: string

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

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

return (
<EdgeTouchableOpacity accessible={false} style={styles.tappableArea} onPress={onPress} testID={testID}>
<EdgeTouchableOpacity accessible={false} style={styles.tappableArea} onPress={onPress} testID={testID} disabled={disabled}>
<View style={styles.topContainer}>
<View style={iconContainerStyle}>{children}</View>
{superscriptLabel == null ? null : (
Expand Down
Loading
Loading