diff --git a/native/account/fullscreen-siwe-panel.react.js b/native/account/fullscreen-siwe-panel.react.js
new file mode 100644
--- /dev/null
+++ b/native/account/fullscreen-siwe-panel.react.js
@@ -0,0 +1,32 @@
+// @flow
+
+import * as React from 'react';
+import { ActivityIndicator, View } from 'react-native';
+
+import SIWEPanel from './siwe-panel.react.js';
+
+type Props = {
+ +onClose: () => mixed,
+ +closing: boolean,
+};
+function FullscreenSIWEPanel(props: Props): React.Node {
+ const [loading, setLoading] = React.useState(true);
+
+ const activity = loading ? : null;
+
+ const activityContainer = React.useMemo(
+ () => ({
+ flex: 1,
+ }),
+ [],
+ );
+
+ return (
+ <>
+ {activity}
+
+ >
+ );
+}
+
+export default FullscreenSIWEPanel;
diff --git a/native/account/logged-out-modal.react.js b/native/account/logged-out-modal.react.js
--- a/native/account/logged-out-modal.react.js
+++ b/native/account/logged-out-modal.react.js
@@ -23,12 +23,12 @@
import { fetchNewCookieFromNativeCredentials } from 'lib/utils/action-utils.js';
import { splashBackgroundURI } from './background-info.js';
+import FullscreenSIWEPanel from './fullscreen-siwe-panel.react.js';
import LogInPanel from './log-in-panel.react.js';
import type { LogInState } from './log-in-panel.react.js';
import LoggedOutStaffInfo from './logged-out-staff-info.react.js';
import RegisterPanel from './register-panel.react.js';
import type { RegisterState } from './register-panel.react.js';
-import SIWEPanel from './siwe-panel.react.js';
import KeyboardAvoidingView from '../components/keyboard-avoiding-view.react.js';
import ConnectedStatusBar from '../connected-status-bar.react.js';
import {
@@ -597,7 +597,7 @@
let siwePanel;
if (this.state.mode === 'siwe') {
siwePanel = (
-
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
@@ -2,7 +2,7 @@
import BottomSheet from '@gorhom/bottom-sheet';
import * as React from 'react';
-import { ActivityIndicator, View, Alert } from 'react-native';
+import { Alert } from 'react-native';
import { useSafeAreaInsets } from 'react-native-safe-area-context';
import WebView from 'react-native-webview';
@@ -37,6 +37,7 @@
type Props = {
+onClose: () => mixed,
+closing: boolean,
+ +setLoading: boolean => mixed,
};
function SIWEPanel(props: Props): React.Node {
const navContext = React.useContext(NavContext);
@@ -243,24 +244,13 @@
);
}
- let activity;
- if (!getSIWENonceCallFailed && (isLoading || siweAuthCallLoading)) {
- activity = ;
- }
-
- const activityContainer = React.useMemo(
- () => ({
- flex: 1,
- }),
- [],
- );
+ const setLoadingProp = props.setLoading;
+ const loading = !getSIWENonceCallFailed && (isLoading || siweAuthCallLoading);
+ React.useEffect(() => {
+ setLoadingProp(loading);
+ }, [setLoadingProp, loading]);
- return (
- <>
- {activity}
- {bottomSheet}
- >
- );
+ return bottomSheet;
}
export default SIWEPanel;