Send and Swap UX improvements + Collapsible panels for transaction details#316
Send and Swap UX improvements + Collapsible panels for transaction details#316danilosilvackl merged 16 commits intomainfrom
Conversation
feat: added new IconButton variants feat: refactor ContactRow component to handle empty address state
minor: added exclude list to BalanceList
fix: collapsible margins
danilosilvackl
requested review from
CassioMG,
aristidesstaffieri and
leofelix077
| "receive": "Receive", | ||
| "chooseToken": "Choose token", | ||
| "selectToken": "Select a token", | ||
| "selectToken": "Select an token", |
There was a problem hiding this comment.
nit: this doesn't seem right
There was a problem hiding this comment.
thats true, I just copy and pasted from figma before, but yeah, it was wrong, reverted
| options={({ route }) => ({ | ||
| headerTitle: | ||
| route.params.selectionType === "destination" | ||
| ? t("swapScreen.swapTo") | ||
| : t("swapScreen.swapFrom"), | ||
| })} |
| }} | ||
| options={({ route }) => ({ | ||
| headerTitle: | ||
| route.params.selectionType === "destination" |
There was a problem hiding this comment.
could we use a constant or enum for this "destination" string?
| onPress={toggleExpanded} | ||
| className="flex-row items-center justify-between" | ||
| > | ||
| {header} |
There was a problem hiding this comment.
nice, so this means the whole header is tappable?
There was a problem hiding this comment.
thats right, at firs I was afraid of how it would behave and had only the chevron active, but it turned out fine so the entire header is tappable now 🙌
There was a problem hiding this comment.
the only thing I left behind was the animation, because of the bottom sheet it did not behave very well with this combo, so it doest have any smoothing for now
There was a problem hiding this comment.
that's fine, I think it's looking good "as is"
fix: fixed wrong translation copy
| <Text>Send to</Text> | ||
| <Text sm secondary> | ||
| Choose recipient |
There was a problem hiding this comment.
added them, thanks
| <Button secondary lg onPress={() => navigation.goBack()}> | ||
| {t("common.edit")} | ||
| </Button> | ||
| <IconButton |
There was a problem hiding this comment.
good idea on reusing the IconButton component and converting it to nativewind
| ); | ||
| }); | ||
|
|
||
| export default React.memo(SignTransactionOperationDetails, () => true); |
There was a problem hiding this comment.
is this double wrapping SignTransactionOperationDetails with React.memo ?
There was a problem hiding this comment.
oh, yeah it was a double wrapping I added to debug the operations behavior when the auth sections were animated, good catch, simplified it now
CassioMG
left a comment
CassioMG
left a comment
There was a problem hiding this comment.
LGTM - good work with the CollapsibleSection and IconButton rework
2 participants
Reworked navigation logic for send and swap flows
iOS
Home screen - send
home_send_ios.mp4
Home screen - swap
home_swap_ios.mp4
Token details - send
token_details_send_ios.mp4
Token details - swap
token_details_swap_ios.mp4
Transaction details
transaction_details_ios.mp4
Android 🤖
Home screen - send
home_send_android.webm
Home screen - swap
home_swap_android.webm
Token details - send
token_details_send_android.webm
Token details - swap
token_details_swap_android.webm
Transaction details
transaction_details_android.webm
closes #293