From 20e80d13a434ac8bc2876394a92cf3c54f557e3a Mon Sep 17 00:00:00 2001
From: Julian Kobrynski <julian.kobrynski@callstack.com>
Date: Mon, 13 Nov 2023 09:28:17 +0100
Subject: [PATCH] destructure props in Modal

---
 src/components/Modal/index.ios.tsx |  6 +++---
 src/components/Modal/index.tsx     | 17 +++++++++--------
 2 files changed, 12 insertions(+), 11 deletions(-)

diff --git a/src/components/Modal/index.ios.tsx b/src/components/Modal/index.ios.tsx
index 6952392a6326..f780775ec216 100644
--- a/src/components/Modal/index.ios.tsx
+++ b/src/components/Modal/index.ios.tsx
@@ -3,13 +3,13 @@ import withWindowDimensions from '@components/withWindowDimensions';
 import BaseModal from './BaseModal';
 import BaseModalProps from './types';
 
-function Modal(props: BaseModalProps) {
+function Modal({children, ...rest}: BaseModalProps) {
     return (
         <BaseModal
             // eslint-disable-next-line react/jsx-props-no-spreading
-            {...props}
+            {...rest}
         >
-            {props.children}
+            {children}
         </BaseModal>
     );
 }
diff --git a/src/components/Modal/index.tsx b/src/components/Modal/index.tsx
index 3d8a30ba3e2a..a3d21d67b9af 100644
--- a/src/components/Modal/index.tsx
+++ b/src/components/Modal/index.tsx
@@ -7,11 +7,11 @@ import CONST from '@src/CONST';
 import BaseModal from './BaseModal';
 import BaseModalProps from './types';
 
-function Modal(props: BaseModalProps) {
+function Modal({fullscreen, onModalHide, type, onModalShow, children, ...rest}: BaseModalProps) {
     const [previousStatusBarColor, setPreviousStatusBarColor] = useState<string>();
 
     const setStatusBarColor = (color = themeColors.appBG) => {
-        if (!props.fullscreen) {
+        if (!fullscreen) {
             return;
         }
 
@@ -20,14 +20,13 @@ function Modal(props: BaseModalProps) {
 
     const hideModal = () => {
         setStatusBarColor(previousStatusBarColor);
-        props.onModalHide();
+        onModalHide();
     };
 
     const showModal = () => {
         const statusBarColor = StatusBar.getBackgroundColor();
 
-        const isFullScreenModal =
-            props.type === CONST.MODAL.MODAL_TYPE.CENTERED || props.type === CONST.MODAL.MODAL_TYPE.CENTERED_UNSWIPEABLE || props.type === CONST.MODAL.MODAL_TYPE.RIGHT_DOCKED;
+        const isFullScreenModal = type === CONST.MODAL.MODAL_TYPE.CENTERED || type === CONST.MODAL.MODAL_TYPE.CENTERED_UNSWIPEABLE || type === CONST.MODAL.MODAL_TYPE.RIGHT_DOCKED;
 
         if (statusBarColor) {
             setPreviousStatusBarColor(statusBarColor);
@@ -35,18 +34,20 @@ function Modal(props: BaseModalProps) {
             setStatusBarColor(isFullScreenModal ? themeColors.appBG : StyleUtils.getThemeBackgroundColor(statusBarColor));
         }
 
-        props.onModalShow?.();
+        onModalShow?.();
     };
 
     return (
         <BaseModal
             // eslint-disable-next-line react/jsx-props-no-spreading
-            {...props}
+            {...rest}
             onModalHide={hideModal}
             onModalShow={showModal}
             avoidKeyboard={false}
+            fullscreen={fullscreen}
+            type={type}
         >
-            {props.children}
+            {children}
         </BaseModal>
     );
 }