diff --git a/native/account/siwe-panel.react.js b/native/account/siwe-panel.react.js
--- a/native/account/siwe-panel.react.js
+++ b/native/account/siwe-panel.react.js
@@ -1,7 +1,8 @@
// @flow
+import BottomSheet from '@gorhom/bottom-sheet';
import * as React from 'react';
-import { ActivityIndicator, Text } from 'react-native';
+import { ActivityIndicator, Text, View } from 'react-native';
import WebView from 'react-native-webview';
import {
@@ -100,13 +101,71 @@
[nonce],
);
+ const [isLoading, setLoading] = React.useState(true);
+
+ const snapPoints = React.useMemo(() => {
+ if (isLoading) {
+ return [1];
+ } else {
+ return [700];
+ }
+ }, [isLoading]);
+
+ const onWebViewLoaded = React.useCallback(() => {
+ setLoading(false);
+ }, []);
+
+ const handleStyle = React.useMemo(
+ () => ({
+ backgroundColor: '#242529',
+ }),
+ [],
+ );
+
+ const bottomSheetHandleIndicatorStyle = React.useMemo(
+ () => ({
+ backgroundColor: 'white',
+ }),
+ [],
+ );
+
+ let bottomSheet;
if (nonce) {
- return ;
- } else if (getSIWENonceCallFailed) {
- return Oops, try again later!;
- } else {
- return ;
+ bottomSheet = (
+
+
+
+ );
+ }
+
+ let activity;
+ if (getSIWENonceCallFailed) {
+ activity = Oops, try again later!;
+ } else if (isLoading) {
+ activity = ;
}
+
+ const activityContainer = React.useMemo(
+ () => ({
+ flex: 1,
+ }),
+ [],
+ );
+
+ return (
+ <>
+ {activity}
+ {bottomSheet}
+ >
+ );
}
export default SIWEPanel;
diff --git a/native/package.json b/native/package.json
--- a/native/package.json
+++ b/native/package.json
@@ -52,6 +52,7 @@
"@commapp/sqlcipher-amalgamation": "^4.4.3-a",
"@expo/react-native-action-sheet": "^3.14.0",
"@expo/vector-icons": "^13.0.0",
+ "@gorhom/bottom-sheet": "^4.4.5",
"@react-native-async-storage/async-storage": "^1.17.10",
"@react-native-clipboard/clipboard": "^1.11.1",
"@react-native-community/art": "^1.2.0",
diff --git a/yarn.lock b/yarn.lock
--- a/yarn.lock
+++ b/yarn.lock
@@ -2977,6 +2977,21 @@
teeny-request "^7.1.3"
xdg-basedir "^4.0.0"
+"@gorhom/bottom-sheet@^4.4.5":
+ version "4.4.5"
+ resolved "https://registry.yarnpkg.com/@gorhom/bottom-sheet/-/bottom-sheet-4.4.5.tgz#b9041b01ce1af9a936e7c0fc1d78f026d759eebe"
+ integrity sha512-Z5Z20wshLUB8lIdtMKoJaRnjd64wBR/q8EeVPThrg+skrcBwBPHfUwZJ2srB0rEszA/01ejSJy/ixyd7Ra7vUA==
+ dependencies:
+ "@gorhom/portal" "1.0.14"
+ invariant "^2.2.4"
+
+"@gorhom/portal@1.0.14":
+ version "1.0.14"
+ resolved "https://registry.yarnpkg.com/@gorhom/portal/-/portal-1.0.14.tgz#1953edb76aaba80fb24021dc774550194a18e111"
+ integrity sha512-MXyL4xvCjmgaORr/rtryDNFy3kU4qUbKlwtQqqsygd0xX3mhKjOLn6mQK8wfu0RkoE0pBE0nAasRoHua+/QZ7A==
+ dependencies:
+ nanoid "^3.3.1"
+
"@graphql-tools/merge@8.3.1":
version "8.3.1"
resolved "https://registry.yarnpkg.com/@graphql-tools/merge/-/merge-8.3.1.tgz#06121942ad28982a14635dbc87b5d488a041d722"
@@ -16426,6 +16441,11 @@
resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.1.30.tgz#63f93cc548d2a113dc5dfbc63bfa09e2b9b64362"
integrity sha512-zJpuPDwOv8D2zq2WRoMe1HsfZthVewpel9CAvTfc/2mBD1uUT/agc5f7GHGWXlYkFvi1mVxe4IjvP2HNrop7nQ==
+nanoid@^3.3.1:
+ version "3.3.4"
+ resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.3.4.tgz#730b67e3cd09e2deacf03c027c81c9d9dbc5e8ab"
+ integrity sha512-MqBkQh/OHTS2egovRtLk45wEyNXwF+cokD+1YPf9u5VfJiRdAiRwB2froX5Co9Rh20xs4siNPm8naNotSD6RBw==
+
nanomatch@^1.2.9:
version "1.2.13"
resolved "https://registry.yarnpkg.com/nanomatch/-/nanomatch-1.2.13.tgz#b87a8aa4fc0de8fe6be88895b38983ff265bd119"