Skip to content

Commit 8c65a76

Browse files
authored
chore(runway): cherry-pick fix: Ensure bottom modal height is large enough for tooltips on android (#15629)
- fix: Ensure bottom modal height is large enough for tooltips on android (#15555) <!-- Please submit this PR as a draft initially. Do not mark it as "Ready for review" until the template has been completely filled out, and PR status checks have passed at least once. --> ## **Description** On Android 15, the explicitly set height for the bottom modal wrapper is needed. <!-- Write a short description of the changes included in this pull request, also include relevant motivation and context. Have in mind the following questions: 1. What is the reason for the change? 2. What is the improvement/solution? --> ## **Related issues** Fixes: #15420 ## **Manual testing steps** 1. Go to this page... 2. 3. ## **Screenshots/Recordings** <!-- If applicable, add screenshots and/or recordings to visualize the before and after of your change. --> ### **Before** <!-- [screenshots/recordings] --> ### **After** <!-- [screenshots/recordings] --> ## **Pre-merge author checklist** - [ ] I’ve followed [MetaMask Contributor Docs](https://github.com/MetaMask/contributor-docs) and [MetaMask Mobile Coding Standards](https://github.com/MetaMask/metamask-mobile/blob/main/.github/guidelines/CODING_GUIDELINES.md). - [ ] I've completed the PR template to the best of my ability - [ ] I’ve included tests if applicable - [ ] I’ve documented my code using [JSDoc](https://jsdoc.app/) format if applicable - [ ] I’ve applied the right labels on the PR (see [labeling guidelines](https://github.com/MetaMask/metamask-mobile/blob/main/.github/guidelines/LABELING_GUIDELINES.md)). Not required for external contributors. ## **Pre-merge reviewer checklist** - [ ] I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed). - [ ] I confirm that this PR addresses all acceptance criteria described in the ticket it closes and includes the necessary testing evidence such as recordings and or screenshots. [0d6a5c4](0d6a5c4)
2 parents ff8604f + 144a028 commit 8c65a76

3 files changed

Lines changed: 8 additions & 3 deletions

File tree

app/components/Views/confirmations/components/UI/Tooltip/Tooltip.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ export const TooltipModal = ({
3838
const { styles } = useStyles(styleSheet, { title: title ?? '' });
3939

4040
return (
41-
<BottomModal visible={open} onClose={() => setOpen(false)}>
41+
<BottomModal visible={open} onClose={() => setOpen(false)} isTooltip>
4242
<View style={styles.modalView}>
4343
<View style={styles.modalHeader}>
4444
<ButtonIcon

app/components/Views/confirmations/components/UI/bottom-modal/bottom-modal.styles.ts

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,9 @@ import { StyleSheet } from 'react-native';
22

33
import { Theme } from '../../../../../../util/theme/models';
44

5-
const styleSheet = (params: { theme: Theme }) => {
5+
const styleSheet = (params: { theme: Theme, vars: { isTooltip: boolean } }) => {
66
const { theme } = params;
7+
const isTooltip = params.vars.isTooltip
78

89
return StyleSheet.create({
910
bottomModal: {
@@ -21,6 +22,8 @@ const styleSheet = (params: { theme: Theme }) => {
2122
},
2223
wrapper: {
2324
justifyContent: 'flex-end',
25+
// ensure the wrapper is big enough for tooltips on android 15
26+
...(isTooltip && { height: 400 }),
2427
},
2528
});
2629
};

app/components/Views/confirmations/components/UI/bottom-modal/bottom-modal.tsx

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ interface BottomModalProps {
1313
hideBackground?: boolean;
1414
testID?: string;
1515
visible?: boolean;
16+
isTooltip?: boolean;
1617
}
1718

1819
/**
@@ -25,9 +26,10 @@ const BottomModal = ({
2526
onClose,
2627
testID,
2728
visible = true,
29+
isTooltip = false,
2830
}: BottomModalProps) => {
2931
const { colors } = useTheme();
30-
const { styles } = useStyles(styleSheet, {});
32+
const { styles } = useStyles(styleSheet, { isTooltip });
3133

3234
return (
3335
<Modal

0 commit comments

Comments
 (0)