diff --git a/native/chat/text-message-tooltip-modal.react.js b/native/chat/text-message-tooltip-modal.react.js --- a/native/chat/text-message-tooltip-modal.react.js +++ b/native/chat/text-message-tooltip-modal.react.js @@ -56,12 +56,12 @@ }, { id: 'create_sidebar', - text: 'Create thread', + text: 'Thread', onPress: navigateToSidebar, }, { id: 'open_sidebar', - text: 'Go to thread', + text: 'Thread', onPress: navigateToSidebar, }, ], 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 @@ -8,7 +8,6 @@ View, StyleSheet, TouchableWithoutFeedback, - Platform, TouchableOpacity, } from 'react-native'; import Animated from 'react-native-reanimated'; @@ -310,11 +309,11 @@ const extraLeftSpace = x; const extraRightSpace = dimensions.width - width - x; if (extraLeftSpace < extraRightSpace) { - style.left = 0; - style.minWidth = width + 2 * extraLeftSpace; + style.left = 8; + style.minWidth = dimensions.width - 16; } else { - style.right = 0; - style.minWidth = width + 2 * extraRightSpace; + style.right = 8; + style.minWidth = dimensions.width - 16; } if (location === 'above') { @@ -361,33 +360,6 @@ ); }); - let triangleStyle; - const { route } = this.props; - const { initialCoordinates } = route.params; - const { x, width } = initialCoordinates; - const extraLeftSpace = x; - const extraRightSpace = dimensions.width - width - x; - if (extraLeftSpace < extraRightSpace) { - triangleStyle = { - alignSelf: 'flex-start', - left: extraLeftSpace + (width - 20) / 2, - }; - } else { - triangleStyle = { - alignSelf: 'flex-end', - right: extraRightSpace + (width - 20) / 2, - }; - } - - let triangleDown = null; - let triangleUp = null; - const { location } = this; - if (location === 'above') { - triangleDown = ; - } else { - triangleUp = ; - } - invariant(overlayContext, 'Tooltip should have OverlayContext'); const { position } = overlayContext; const isOpeningSidebar = !!chatContext?.currentTransitionSidebarSourceID; @@ -411,9 +383,7 @@ style={this.tooltipContainerStyle} onLayout={this.onTooltipContainerLayout} > - {triangleUp} {items} - {triangleDown} @@ -527,17 +497,19 @@ itemContainer: { alignItems: 'center', flex: 1, - flexDirection: 'row', + flexDirection: 'column', justifyContent: 'center', padding: 10, }, itemMargin: { - borderBottomColor: '#E1E1E1', - borderBottomWidth: 1, + borderRightColor: '#E1E1E1', + borderRightWidth: 1, }, items: { backgroundColor: 'white', borderRadius: 5, + flex: 1, + flexDirection: 'row', overflow: 'hidden', }, label: { @@ -546,34 +518,6 @@ lineHeight: 17, textAlign: 'center', }, - triangleDown: { - borderBottomColor: 'transparent', - borderBottomWidth: 0, - borderLeftColor: 'transparent', - borderLeftWidth: 10, - borderRightColor: 'transparent', - borderRightWidth: 10, - borderStyle: 'solid', - borderTopColor: 'white', - borderTopWidth: 10, - height: 10, - top: Platform.OS === 'android' ? -1 : 0, - width: 10, - }, - triangleUp: { - borderBottomColor: 'white', - borderBottomWidth: 10, - borderLeftColor: 'transparent', - borderLeftWidth: 10, - borderRightColor: 'transparent', - borderRightWidth: 10, - borderStyle: 'solid', - borderTopColor: 'transparent', - borderTopWidth: 0, - bottom: Platform.OS === 'android' ? -1 : 0, - height: 10, - width: 10, - }, }); function tooltipHeight(numEntries: number): number {