61 lines
1.5 KiB
JavaScript
61 lines
1.5 KiB
JavaScript
// @flow
|
|
|
|
import { useEffect, useState } from 'react';
|
|
import { Keyboard } from 'react-native';
|
|
|
|
import { toState } from '../../redux';
|
|
|
|
export const useKeyboardHeight = () => {
|
|
const [ keyboardHeight, setKeyboardHeight ] = useState(0);
|
|
|
|
const onKeyboardDidShow = e => {
|
|
setKeyboardHeight(e.endCoordinates.height);
|
|
};
|
|
|
|
const onKeyboardDidHide = () => {
|
|
setKeyboardHeight(0);
|
|
};
|
|
|
|
useEffect(() => {
|
|
const keyboardShow = Keyboard.addListener('keyboardDidShow', onKeyboardDidShow);
|
|
const keyboardHide = Keyboard.addListener('keyboardDidHide', onKeyboardDidHide);
|
|
|
|
return () => {
|
|
keyboardShow.remove();
|
|
keyboardHide.remove();
|
|
};
|
|
}, []);
|
|
|
|
return keyboardHeight;
|
|
};
|
|
|
|
/**
|
|
*
|
|
* Returns the client width.
|
|
*
|
|
* @param {(Function|Object)} stateful - The (whole) redux state, or redux's
|
|
* {@code getState} function to be used to retrieve the state
|
|
* features/base/config.
|
|
* @returns {number}.
|
|
*/
|
|
export function getClientWidth(stateful: Object) {
|
|
const state = toState(stateful['features/base/responsive-ui']);
|
|
|
|
return state.clientWidth;
|
|
}
|
|
|
|
/**
|
|
*
|
|
* Returns the client height.
|
|
*
|
|
* @param {(Function|Object)} stateful - The (whole) redux state, or redux's
|
|
* {@code getState} function to be used to retrieve the state
|
|
* features/base/config.
|
|
* @returns {number}.
|
|
*/
|
|
export function getClientHeight(stateful: Object) {
|
|
const state = toState(stateful['features/base/responsive-ui']);
|
|
|
|
return state.clientHeight;
|
|
}
|