Skip to content

Commit 06c212e

Browse files
committed
More review fixes
1 parent 28d15a3 commit 06c212e

4 files changed

Lines changed: 25 additions & 41 deletions

File tree

src/components/Modal/ReanimatedModal/Container/index.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,7 @@ function Container({
4646

4747
return (
4848
<View
49-
style={[style, styles.modalContainer]}
49+
style={style}
5050
// eslint-disable-next-line react/jsx-props-no-spreading
5151
{...props}
5252
>

src/components/Modal/ReanimatedModal/Container/index.web.tsx

Lines changed: 1 addition & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -46,12 +46,7 @@ function Container({
4646

4747
return (
4848
<Animated.View
49-
style={[
50-
style,
51-
type !== CONST.MODAL.MODAL_TYPE.RIGHT_DOCKED && type !== CONST.MODAL.MODAL_TYPE.POPOVER && [styles.modalContainer, styles.modalAnimatedContainer],
52-
animatedStyles,
53-
{zIndex: 1},
54-
]}
49+
style={[style, type !== CONST.MODAL.MODAL_TYPE.RIGHT_DOCKED && type !== CONST.MODAL.MODAL_TYPE.POPOVER && styles.modalAnimatedContainer, animatedStyles, {zIndex: 1}]}
5550
exiting={Exiting}
5651
// eslint-disable-next-line react/jsx-props-no-spreading
5752
{...props}

src/styles/index.ts

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2687,8 +2687,6 @@ const styles = (theme: ThemeColors) =>
26872687
borderColor: theme.transparent,
26882688
},
26892689

2690-
modalContainer: {height: '100%'},
2691-
26922690
modalAnimatedContainer: {width: '100%'},
26932691

26942692
modalContainerBox: {

src/styles/utils/generators/ModalStyleUtils.ts

Lines changed: 23 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -93,9 +93,8 @@ const createModalStyleUtils: StyleUtilGenerator<GetModalStylesStyleUtil> = ({the
9393
// and can be dismissed by clicking outside of the modal.
9494
modalStyle = {
9595
...modalStyle,
96-
...{
97-
alignItems: 'center',
98-
},
96+
alignItems: 'center',
97+
height: '100%',
9998
};
10099
modalContainerStyle = {
101100
boxShadow: theme.shadow,
@@ -117,9 +116,8 @@ const createModalStyleUtils: StyleUtilGenerator<GetModalStylesStyleUtil> = ({the
117116
// viewed on a smaller device (e.g. mobile or mobile web).
118117
modalStyle = {
119118
...modalStyle,
120-
...{
121-
alignItems: 'center',
122-
},
119+
alignItems: 'center',
120+
height: '100%',
123121
};
124122
modalContainerStyle = {
125123
boxShadow: theme.shadow,
@@ -147,9 +145,8 @@ const createModalStyleUtils: StyleUtilGenerator<GetModalStylesStyleUtil> = ({the
147145
// viewed on a smaller device (e.g. mobile or mobile web).
148146
modalStyle = {
149147
...modalStyle,
150-
...{
151-
alignItems: 'center',
152-
},
148+
alignItems: 'center',
149+
height: '100%',
153150
};
154151
modalContainerStyle = {
155152
boxShadow: theme.shadow,
@@ -174,10 +171,9 @@ const createModalStyleUtils: StyleUtilGenerator<GetModalStylesStyleUtil> = ({the
174171
// A centered modal that cannot be dismissed with a swipe.
175172
modalStyle = {
176173
...modalStyle,
177-
...{
178-
alignItems: 'center',
179-
justifyContent: 'center',
180-
},
174+
alignItems: 'center',
175+
justifyContent: 'center',
176+
height: '100%',
181177
};
182178
modalContainerStyle = {
183179
boxShadow: theme.shadow,
@@ -200,9 +196,8 @@ const createModalStyleUtils: StyleUtilGenerator<GetModalStylesStyleUtil> = ({the
200196
// A centered modal that takes up the minimum possible screen space on all devices
201197
modalStyle = {
202198
...modalStyle,
203-
...{
204-
alignItems: 'center',
205-
},
199+
alignItems: 'center',
200+
height: '100%',
206201
};
207202
modalContainerStyle = {
208203
boxShadow: theme.shadow,
@@ -224,10 +219,9 @@ const createModalStyleUtils: StyleUtilGenerator<GetModalStylesStyleUtil> = ({the
224219
case CONST.MODAL.MODAL_TYPE.BOTTOM_DOCKED:
225220
modalStyle = {
226221
...modalStyle,
227-
...{
228-
alignItems: 'center',
229-
justifyContent: 'flex-end',
230-
},
222+
alignItems: 'center',
223+
justifyContent: 'flex-end',
224+
height: '100%',
231225
};
232226
modalContainerStyle = {
233227
width: '100%',
@@ -257,11 +251,9 @@ const createModalStyleUtils: StyleUtilGenerator<GetModalStylesStyleUtil> = ({the
257251
modalStyle = {
258252
...modalStyle,
259253
...popoverAnchorPosition,
260-
...{
261-
position: 'absolute',
262-
alignItems: 'center',
263-
justifyContent: 'flex-end',
264-
},
254+
position: 'absolute',
255+
alignItems: 'center',
256+
justifyContent: 'flex-end',
265257
};
266258
modalContainerStyle = {
267259
borderRadius: variables.componentBorderRadiusLarge,
@@ -280,12 +272,11 @@ const createModalStyleUtils: StyleUtilGenerator<GetModalStylesStyleUtil> = ({the
280272
case CONST.MODAL.MODAL_TYPE.RIGHT_DOCKED:
281273
modalStyle = {
282274
...modalStyle,
283-
...{
284-
marginLeft: isSmallScreenWidth ? 0 : windowWidth - variables.sideBarWidth,
285-
width: isSmallScreenWidth ? '100%' : variables.sideBarWidth,
286-
flexDirection: 'row',
287-
justifyContent: 'flex-end',
288-
},
275+
marginLeft: isSmallScreenWidth ? 0 : windowWidth - variables.sideBarWidth,
276+
width: isSmallScreenWidth ? '100%' : variables.sideBarWidth,
277+
flexDirection: 'row',
278+
justifyContent: 'flex-end',
279+
height: '100%',
289280
};
290281
modalContainerStyle = {
291282
width: isSmallScreenWidth ? '100%' : variables.sideBarWidth,
@@ -320,7 +311,7 @@ const createModalStyleUtils: StyleUtilGenerator<GetModalStylesStyleUtil> = ({the
320311
shouldAddTopSafeAreaPadding = true;
321312
break;
322313
default:
323-
modalStyle = {};
314+
modalStyle = {height: '100%'};
324315
modalContainerStyle = {};
325316
swipeDirection = 'down';
326317
animationIn = 'slideInUp';

0 commit comments

Comments
 (0)