import { useMemo } from 'react' ; import { Dimensions } from 'react-native' ; const { width : WINDOW_WIDTH , height : WINDOW_HEIGHT } = Dimensions . get ( 'window' ) ; const IMAGE_RATIO = 993 / 1125 ; const LOGO_RATIO = 377 / 1125 ; const NO_TRIM_RATIO = 0.462 ; const MAX_TRIM_RATIO = 0.53 ; const MAX_TRIM = - 30 ; const ILLUSTRATION_HEIGHT = IMAGE_RATIO * WINDOW_WIDTH ; const LOGO_HEIGHT = LOGO_RATIO * WINDOW_WIDTH ; export function useConfirmationSpace ( minContentHeight ) { const contentHeight = useMemo ( ( ) => { const bottomHeight = WINDOW_HEIGHT - ILLUSTRATION_HEIGHT - LOGO_HEIGHT ; return minContentHeight > bottomHeight ? minContentHeight : bottomHeight ; } , [ minContentHeight ] ) ; const topTrim = useMemo ( ( ) => { const screenRatio = WINDOW_WIDTH / WINDOW_HEIGHT ; const trimRange = MAX_TRIM_RATIO - NO_TRIM_RATIO ; const trimPercent = screenRatio < NO_TRIM_RATIO ? 0 : screenRatio > MAX_TRIM_RATIO ? 1 : 1 - ( MAX_TRIM_RATIO - screenRatio ) / trimRange ; return trimPercent * MAX_TRIM ; } , [ ] ) ; return { topTrim , contentHeight , ILLUSTRATION_HEIGHT , LOGO_HEIGHT } ; }