@applicaster/zapp-react-native-ui-components
Version:
Applicaster Zapp React Native ui components for the Quick Brick App
71 lines (58 loc) • 1.52 kB
text/typescript
import * as React from "react";
import {
useNavigationPluginData,
useIsNavBarVisible,
useRoute,
} from "@applicaster/zapp-react-native-utils/reactHooks";
import { toBooleanWithDefaultFalse } from "@applicaster/zapp-react-native-utils/booleanUtils";
import {
setFocusOnContent,
setFocusOnMenu,
} from "@applicaster/zapp-react-native-utils/appUtils/focusManagerAux";
type Return =
| {
onContent: true;
onMenu: false;
}
| {
onContent: false;
onMenu: true;
};
const getInitialFocus = (focusOnContent, isNavBarVisible): Return => {
if (focusOnContent) {
return {
onContent: true,
onMenu: false,
};
}
if (!focusOnContent && isNavBarVisible) {
// put focus on navbar
return {
onContent: false,
onMenu: true,
};
}
// we don't have navbar, put focus on content anyway
return {
onContent: true,
onMenu: false,
};
};
export const useInitialFocus = (): void => {
const navigationPluginData = useNavigationPluginData();
const focusOnContent = toBooleanWithDefaultFalse(
navigationPluginData?.rules?.focus_on_content
);
const isNavBarVisible = useIsNavBarVisible();
const { pathname: currentRoute } = useRoute();
React.useEffect(() => {
const initialFocus = getInitialFocus(focusOnContent, isNavBarVisible);
if (initialFocus.onContent) {
setFocusOnContent(currentRoute);
return;
}
if (initialFocus.onMenu) {
setFocusOnMenu(currentRoute);
}
}, []);
};