Implement Send page > Edit Network Routing

[briansztamfater]

Feature Issue

User Story

As a user, I want to edit network routing so that I can customize the amount of tokens I want to send from each network (Mainnet, Optimism, Arbitrum).

Description

Figma Design 1: https://www.figma.com/file/HKncH4wnDwZDAhc4AryK8Y/Wallet-for-Mobile?type=design&node-id=1001-243824&mode=design&t=pyKMfYWl16de9nk6-4 Figma Design 2: https://www.figma.com/file/HKncH4wnDwZDAhc4AryK8Y/Wallet-for-Mobile?type=design&node-id=1001-244282&mode=design&t=ykTAVvCEiI3vfnXm-4 Figma Design 3: https://www.figma.com/file/HKncH4wnDwZDAhc4AryK8Y/Wallet-for-Mobile?type=design&node-id=1041-251672&mode=design&t=ykTAVvCEiI3vfnXm-4 Figma Design 4: https://www.figma.com/file/HKncH4wnDwZDAhc4AryK8Y/Wallet-for-Mobile?type=design&node-id=1041-251909&mode=design&t=ykTAVvCEiI3vfnXm-4 Figma Design 5: https://www.figma.com/file/HKncH4wnDwZDAhc4AryK8Y/Wallet-for-Mobile?type=design&node-id=1041-252155&mode=design&t=ykTAVvCEiI3vfnXm-4

Visual reference:

Video reference:

https://github.com/status-im/status-mobile/assets/18485527/ed2f4134-f593-4a7f-9486-b791ce0110a6

Acceptance Criteria

• [ ] When user taps on details button, numbered keyboard should be hidden and network routing component should be shown
• [ ] User can tap a network (soft blue representing mainnet, red representing Optimism and turquoise representing Arbitrum) to enter edit mode for that network
• [ ] On edit mode, user can drag to adjust that network
• [ ] While dragging, a popover with remaining assets in the editing network should be shown (check video reference)
• [ ] When user releases the touch, network routing, fees and network breakdown should be updated
• [ ] When in loading state, Continue button should be disabled
• [ ] When user taps again details button, numbered keyboard should be shown again and network routing component should be hidden