feat(suite-native): enhance layout of the account import summary screen

[yanascz]

The Confirm button fixed to the bottom of the screen.

Related Issue

Resolve #14065

Screenshots:

[github-actions]

Fingerprint is changed, new EAS Build(s) are now in pipeline.

Build with commit f8c1284

Name	Build	Details
🤖 Android build	View build page	Details Distribution: INTERNAL Build profile: preview SDK version: 51.0.0 App version: 24.10.2
🍎 iOS build	View build page	Details Distribution: INTERNAL Build profile: preview SDK version: 51.0.0 App version: 24.10.2

Fingerprint diff

[
  {
    "op": "changed",
    "source": {
      "type": "contents",
      "id": "expoConfig",
      "contents": "{\"android\":{\"adaptiveIcon\":{\"backgroundColor\":\"#E59D17\",\"foregroundImage\":\"./assets/appIcon_android.png\",\"monochromeImage\":\"./assets/appIcon_android.png\"},\"intentFilters\":[{\"action\":\"VIEW\",\"autoVerify\":true,\"category\":[\"BROWSABLE\",\"DEFAULT\"],\"data\":[{\"host\":\"dev.suite.sldev.cz\",\"pathPattern\":\"/connect/.*/.*/deeplink/.*\",\"scheme\":\"https\"},{\"host\":\"dev.suite.sldev.cz\",\"pathPattern\":\"/connect/.*/deeplink/.*\",\"scheme\":\"https\"}]}],\"package\":\"io.trezor.suite.preview\",\"permissions\":[\"android.permission.CAMERA\"]},\"extra\":{\"commitHash\":\"e197c9c0e022e924b1c333ae8a90d051d2a57173\",\"eas\":{\"projectId\":\"15998f8a-e75c-4b60-959d-6f68e5ff4936\"}},\"ios\":{\"associatedDomains\":[\"applinks:dev.suite.sldev.cz\"],\"bundleIdentifier\":\"io.trezor.suite.preview\",\"icon\":\"./assets/preview/appIcon.png\",\"infoPlist\":{\"ITSAppUsesNonExemptEncryption\":false,\"NSAppTransportSecurity\":{\"NSAllowsArbitraryLoads\":true,\"NSExceptionDomains\":{\"data.trezor.io\":{\"NSExceptionAllowsInsecureHTTPLoads\":true,\"NSIncludesSubdomains\":true},\"localhost\":{\"NSExceptionAllowsInsecureHTTPLoads\":true}}},\"NSCameraUsageDescription\":\"$(PRODUCT_NAME) needs access to your Camera to scan your XPUB.\",\"NSFaceIDUsageDescription\":\"$(PRODUCT_NAME) needs Face ID and Touch ID to keep sensitive data about your portfolio private.\",\"NSMicrophoneUsageDescription\":\"This app does not require access to the microphone.\",\"UIRequiredDeviceCapabilities\":[\"armv7\"]},\"supportsTablet\":true},\"name\":\"Trezor Suite Lite Preview\",\"orientation\":\"portrait\",\"owner\":\"trezorcompany-develop\",\"platforms\":[\"android\",\"ios\"],\"plugins\":[\"./plugins/withGradleProperties.js\",\"./plugins/withRemoveXcodeLocalEnv.js\",\"./plugins/withRemoveiOSNotificationEntitlement.js\",\"@trezor/react-native-usb/plugins/withUSBDevice.js\",[\"./plugins/withAndroidMainActivityAttributes.js\",{\"android:allowBackup\":false}],[\"@config-plugins/detox\",{\"subdomains\":\"*\"}],[\"@sentry/react-native/expo\",{\"organization\":\"satoshilabs\",\"project\":\"suite-native\",\"url\":\"https://sentry.io/\"}],[\"expo-build-properties\",{\"android\":{\"minSdkVersion\":28},\"ios\":{\"deploymentTarget\":\"14.0\"}}],[\"expo-camera\",{\"cameraPermission\":\"Allow $(PRODUCT_NAME) to access camera for QR code scanning.\",\"microphonePermission\":false,\"recordAudioAndroid\":false}],[\"expo-font\",{\"fonts\":[\"../../packages/theme/fonts/TTSatoshi-DemiBold.otf\",\"../../packages/theme/fonts/TTSatoshi-Medium.otf\",\"../../suite-common/icons/iconFontsMobile/TrezorSuiteIcons.ttf\"]}],[\"expo-image-picker\",{\"microphonePermission\":false,\"photosPermission\":\"Allow $(PRODUCT_NAME) to access your photos to let you import QR code images.\"}]],\"runtimeVersion\":\"9\",\"scheme\":\"trezorsuitelite\",\"sdkVersion\":\"51.0.0\",\"slug\":\"trezor-suite-preview\",\"splash\":{\"backgroundColor\":\"#25292E\",\"image\":\"./assets/splash_icon.png\",\"resizeMode\":\"contain\"},\"updates\":{\"requestHeaders\":{\"expo-channel-name\":\"preview\"},\"url\":\"https://u.expo.dev/15998f8a-e75c-4b60-959d-6f68e5ff4936\"},\"userInterfaceStyle\":\"automatic\",\"version\":\"24.10.2\"}",
      "reasons": [
        "expoConfig"
      ],
      "hash": "357a1ca4abd16138441a3f038cfe3e16259f3594"
    }
  }
]

Learn more about 𝝠 Expo Github Action

[github-actions]

🚀 Expo preview is ready!

• Project → trezor-suite-preview
• Platforms → android, ios
• Scheme → trezorsuitelite
• Runtime Version → 9
• More info

Learn more about 𝝠 Expo Github Action

[PeKne]

I tested it on the iPhone 13 mini, and it works nicely!

One thing I don't like is that if you start filling in the account label input, the submit button is hidden behind the keyboard :/. Sometimes, even the input is hidden behind it. Can we change that?

ScreenRecording_11-01-2024.12-41-51_1.MP4

But it was probably like that, even with the old version, right? So maybe let's just create an issue and fix it separately.

[yanascz]

One thing I don't like is that if you start filling in the account label input, the submit button is hidden behind the keyboard :/. Sometimes, even the input is hidden behind it. Can we change that?

I used KeyboardAvoidingView for the summary footer as in XpubHint. It's not ideal but at least it works the same.

[PeKne]

Tested on both platforms 👍