diff --git a/native/chat/multimedia-message.react.js b/native/chat/multimedia-message.react.js --- a/native/chat/multimedia-message.react.js +++ b/native/chat/multimedia-message.react.js @@ -143,13 +143,11 @@ const aboveMargin = isViewer ? 30 : 50; const aboveSpace = tooltipHeight + aboveMargin; - let location = 'below', - margin = belowMargin; + let margin = belowMargin; if ( multimediaBottom + belowSpace > boundsBottom && multimediaTop - aboveSpace > boundsTop ) { - location = 'above'; margin = aboveMargin; } @@ -160,7 +158,7 @@ item, initialCoordinates: coordinates, verticalBounds, - location, + location: 'fixed', margin, visibleEntryIDs, }, diff --git a/native/chat/robotext-message.react.js b/native/chat/robotext-message.react.js --- a/native/chat/robotext-message.react.js +++ b/native/chat/robotext-message.react.js @@ -103,13 +103,11 @@ const aboveMargin = isViewer ? 30 : 50; const aboveSpace = tooltipHeight + aboveMargin; - let location = 'below', - margin = 0; + let margin = 0; if ( messageBottom + belowSpace > boundsBottom && messageTop - aboveSpace > boundsTop ) { - location = 'above'; margin = aboveMargin; } @@ -120,7 +118,7 @@ initialCoordinates: coordinates, verticalBounds, visibleEntryIDs, - location, + location: 'fixed', margin, item, }, diff --git a/native/chat/text-message.react.js b/native/chat/text-message.react.js --- a/native/chat/text-message.react.js +++ b/native/chat/text-message.react.js @@ -170,13 +170,11 @@ const aboveMargin = isViewer ? 30 : 50; const aboveSpace = tooltipHeight + aboveMargin; - let location = 'below', - margin = belowMargin; + let margin = belowMargin; if ( messageBottom + belowSpace > boundsBottom && messageTop - aboveSpace > boundsTop ) { - location = 'above'; margin = aboveMargin; } @@ -187,7 +185,7 @@ initialCoordinates: coordinates, verticalBounds, visibleEntryIDs, - location, + location: 'fixed', margin, item, }, diff --git a/native/navigation/tooltip.react.js b/native/navigation/tooltip.react.js --- a/native/navigation/tooltip.react.js +++ b/native/navigation/tooltip.react.js @@ -77,7 +77,7 @@ +presentedFrom: string, +initialCoordinates: LayoutCoordinates, +verticalBounds: VerticalBounds, - +location?: 'above' | 'below', + +location?: 'above' | 'below' | 'fixed', +margin?: number, +visibleEntryIDs?: $ReadOnlyArray, }; @@ -226,7 +226,7 @@ return tooltipHeight; } - get location(): 'above' | 'below' { + get location(): 'above' | 'below' | 'fixed' { const { params } = this.props.route; const { location } = params; if (location) { @@ -296,6 +296,8 @@ const { initialCoordinates, verticalBounds } = route.params; const { x, y, width, height } = initialCoordinates; const { margin, location } = this; + console.log('here is margin'); + console.log(margin); const style = {}; style.position = 'absolute'; @@ -312,7 +314,16 @@ } style.minWidth = dimensions.width - 16; - if (location === 'above') { + if (location === 'fixed') { + const fullScreenHeight = dimensions.height; + const fixedMargin = 32; + + style.bottom = + fullScreenHeight - + verticalBounds.height - + verticalBounds.y - + fixedMargin; + } else if (location === 'above') { const fullScreenHeight = dimensions.height; style.bottom = fullScreenHeight - Math.max(y, verticalBounds.y) + margin;