Page MenuHomePhabricator
Files F3329204

D9437.id31828.diff
No OneTemporary
Actions

D9437.id31828.diff
View Options

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
@@ -18,6 +18,7 @@
type BindServerCallsParams,
} from 'lib/utils/action-utils.js';
+import { useKeyboardHeight } from '../keyboard/keyboard-hooks.js';
import { useSelector } from '../redux/redux-utils.js';
import Alert from '../utils/alert.js';
import { getContentSigningKey } from '../utils/crypto-utils.js';
@@ -88,21 +89,24 @@
const [walletConnectModalHeight, setWalletConnectModalHeight] =
React.useState(0);
const insets = useSafeAreaInsets();
+ const keyboardHeight = useKeyboardHeight();
const bottomInset = insets.bottom;
const snapPoints = React.useMemo(() => {
if (isLoading) {
return [1];
} else if (walletConnectModalHeight) {
- const baseHeight = bottomInset + walletConnectModalHeight;
+ const baseHeight =
+ bottomInset + walletConnectModalHeight + keyboardHeight;
if (baseHeight < 400) {
- return [baseHeight + 3];
+ return [baseHeight - 10];
} else {
- return [baseHeight - 17];
+ return [baseHeight + 5];
}
} else {
- return [bottomInset + 435, bottomInset + 600];
+ const baseHeight = bottomInset + keyboardHeight;
+ return [baseHeight + 435, baseHeight + 600];
}
- }, [isLoading, walletConnectModalHeight, bottomInset]);
+ }, [isLoading, walletConnectModalHeight, bottomInset, keyboardHeight]);
const bottomSheetRef = React.useRef();
const snapToIndex = bottomSheetRef.current?.snapToIndex;
diff --git a/native/keyboard/keyboard-hooks.js b/native/keyboard/keyboard-hooks.js
new file mode 100644
--- /dev/null
+++ b/native/keyboard/keyboard-hooks.js
@@ -0,0 +1,41 @@
+// @flow
+
+import * as React from 'react';
+
+import {
+ addKeyboardShowListener,
+ addKeyboardDismissListener,
+ removeKeyboardListener,
+} from './keyboard.js';
+import type { KeyboardEvent } from '../types/react-native.js';
+
+function useKeyboardHeight(): number {
+ const [keyboardHeight, setKeyboardHeight] = React.useState<number>(0);
+
+ const onKeyboardShow = React.useCallback((event: KeyboardEvent) => {
+ const height = event?.endCoordinates?.height ?? 0;
+ setKeyboardHeight(height);
+ }, []);
+ React.useEffect(() => {
+ const keyboardShowListener = addKeyboardShowListener(onKeyboardShow);
+ return () => {
+ removeKeyboardListener(keyboardShowListener);
+ };
+ }, [onKeyboardShow]);
+
+ const onKeyboardDismiss = React.useCallback((event: ?KeyboardEvent) => {
+ setKeyboardHeight(0);
+ }, []);
+
+ React.useEffect(() => {
+ const keyboardDismissListener =
+ addKeyboardDismissListener(onKeyboardDismiss);
+ return () => {
+ removeKeyboardListener(keyboardDismissListener);
+ };
+ }, [onKeyboardDismiss]);
+
+ return keyboardHeight;
+}
+
+export { useKeyboardHeight };

File Metadata

Mime Type
text/plain
Expires
Thu, Nov 21, 4:39 PM (2 h, 6 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
2556682
Default Alt Text
D9437.id31828.diff (2 KB)

Event Timeline