From 92d252d2317e91af564de6f19a1d78145de4a5b1 Mon Sep 17 00:00:00 2001
From: Blazej Kustra <blazej.kustra@swmansion.com>
Date: Mon, 28 Aug 2023 18:35:28 +0200
Subject: [PATCH] [TS migration] Migrate 'getModalStyles' style to TypeScript

---
 ...etBaseModalStyles.js => getModalStyles.ts} | 65 ++++++++++++++-----
 src/styles/getModalStyles/index.js            |  3 -
 2 files changed, 50 insertions(+), 18 deletions(-)
 rename src/styles/{getModalStyles/getBaseModalStyles.js => getModalStyles.ts} (82%)
 delete mode 100644 src/styles/getModalStyles/index.js

diff --git a/src/styles/getModalStyles/getBaseModalStyles.js b/src/styles/getModalStyles.ts
similarity index 82%
rename from src/styles/getModalStyles/getBaseModalStyles.js
rename to src/styles/getModalStyles.ts
index c7697b1de6ea..32e6cf6f98e7 100644
--- a/src/styles/getModalStyles/getBaseModalStyles.js
+++ b/src/styles/getModalStyles.ts
@@ -1,25 +1,60 @@
-import CONST from '../../CONST';
-import variables from '../variables';
-import themeColors from '../themes/default';
-import styles from '../styles';
+import {CSSProperties} from 'react';
+import {ViewStyle} from 'react-native';
+import {ValueOf} from 'type-fest';
+import {ModalProps} from 'react-native-modal';
+import CONST from '../CONST';
+import variables from './variables';
+import themeColors from './themes/default';
+import styles from './styles';
 
-const getCenteredModalStyles = (windowWidth, isSmallScreenWidth, isFullScreenWhenSmall = false) => ({
-    borderWidth: styles.centeredModalStyles(isSmallScreenWidth, isFullScreenWhenSmall).borderWidth,
-    width: isSmallScreenWidth ? '100%' : windowWidth - styles.centeredModalStyles(isSmallScreenWidth, isFullScreenWhenSmall).marginHorizontal * 2,
-});
+function getCenteredModalStyles(windowWidth: number, isSmallScreenWidth: boolean, isFullScreenWhenSmall = false): ViewStyle {
+    return {
+        borderWidth: styles.centeredModalStyles(isSmallScreenWidth, isFullScreenWhenSmall).borderWidth,
+        width: isSmallScreenWidth ? '100%' : windowWidth - styles.centeredModalStyles(isSmallScreenWidth, isFullScreenWhenSmall).marginHorizontal * 2,
+    };
+}
+
+type ModalType = ValueOf<typeof CONST.MODAL.MODAL_TYPE>;
+
+type WindowDimensions = {
+    windowWidth: number;
+    windowHeight: number;
+    isSmallScreenWidth: boolean;
+    isMediumScreenWidth: boolean;
+    isLargeScreenWidth: boolean;
+};
+
+type GetModalStyles = {
+    modalStyle: ViewStyle;
+    modalContainerStyle: ViewStyle | Pick<CSSProperties, 'boxShadow'>;
+    swipeDirection: ModalProps['swipeDirection'];
+    animationIn: ModalProps['animationIn'];
+    animationOut: ModalProps['animationOut'];
+    hideBackdrop: boolean;
+    shouldAddTopSafeAreaMargin: boolean;
+    shouldAddBottomSafeAreaMargin: boolean;
+    shouldAddBottomSafeAreaPadding: boolean;
+    shouldAddTopSafeAreaPadding: boolean;
+};
 
-export default (type, windowDimensions, popoverAnchorPosition = {}, innerContainerStyle = {}, outerStyle = {}) => {
+export default function getModalStyles(
+    type: ModalType,
+    windowDimensions: WindowDimensions,
+    popoverAnchorPosition: ViewStyle = {},
+    innerContainerStyle: ViewStyle = {},
+    outerStyle: ViewStyle = {},
+): GetModalStyles {
     const {isSmallScreenWidth, windowWidth} = windowDimensions;
 
-    let modalStyle = {
+    let modalStyle: GetModalStyles['modalStyle'] = {
         margin: 0,
         ...outerStyle,
     };
 
-    let modalContainerStyle;
-    let swipeDirection;
-    let animationIn;
-    let animationOut;
+    let modalContainerStyle: GetModalStyles['modalContainerStyle'];
+    let swipeDirection: GetModalStyles['swipeDirection'];
+    let animationIn: GetModalStyles['animationIn'];
+    let animationOut: GetModalStyles['animationOut'];
     let hideBackdrop = false;
     let shouldAddBottomSafeAreaMargin = false;
     let shouldAddTopSafeAreaMargin = false;
@@ -264,4 +299,4 @@ export default (type, windowDimensions, popoverAnchorPosition = {}, innerContain
         shouldAddBottomSafeAreaPadding,
         shouldAddTopSafeAreaPadding,
     };
-};
+}
diff --git a/src/styles/getModalStyles/index.js b/src/styles/getModalStyles/index.js
deleted file mode 100644
index 4e35fa589119..000000000000
--- a/src/styles/getModalStyles/index.js
+++ /dev/null
@@ -1,3 +0,0 @@
-import getBaseModalStyles from './getBaseModalStyles';
-
-export default getBaseModalStyles;