refactor: remove redundant extra component

Author: chrispader

src/pages/inbox/report/ReportActionCompose/ComposerInputArea.tsx

@@ -1,21 +1,45 @@
 import React from 'react';
+import {View} from 'react-native';
+import useOnyx from '@hooks/useOnyx';
+import useThemeStyles from '@hooks/useThemeStyles';
+import CONST from '@src/CONST';
+import ONYXKEYS from '@src/ONYXKEYS';
 import ComposerActionButton from './ComposerActionButton';
 import ComposerBox from './ComposerBox';
+import ComposerContainer from './ComposerContainer';
+import {useComposerState} from './ComposerContext';
 import ComposerDropZone from './ComposerDropZone';
 import ComposerEmojiPicker from './ComposerEmojiPicker';
+import ComposerImportedState from './ComposerImportedState';
 import ComposerInput from './ComposerInput';
+import ComposerLocalTime from './ComposerLocalTime';
 import ComposerSendButton from './ComposerSendButton';
 
 function ComposerInputArea() {
+    const {reportID} = useComposerState();
+    const styles = useThemeStyles();
+    const [isComposerFullSize = false] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT_IS_COMPOSER_FULL_SIZE}${reportID}`);
+
     return (
-        <ComposerDropZone>
-            <ComposerBox>
-                <ComposerActionButton />
-                <ComposerInput />
-                <ComposerEmojiPicker />
-                <ComposerSendButton />
-            </ComposerBox>
-        </ComposerDropZone>
+        <View
+            testID={CONST.COMPOSER.TEST_ID.REPORT_ACTION_COMPOSE}
+            style={[isComposerFullSize && styles.chatItemFullComposeRow]}
+        >
+            <ComposerLocalTime />
+            <View style={isComposerFullSize ? styles.flex1 : {}}>
+                <ComposerContainer>
+                    <ComposerDropZone>
+                        <ComposerBox>
+                            <ComposerActionButton />
+                            <ComposerInput />
+                            <ComposerEmojiPicker />
+                            <ComposerSendButton />
+                        </ComposerBox>
+                    </ComposerDropZone>
+                </ComposerContainer>
+                <ComposerImportedState />
+            </View>
+        </View>
     );
 }
 

src/pages/inbox/report/ReportActionCompose/ComposerLayout.tsx

@@ -12,25 +12,33 @@ import ComposerFooter from './ComposerFooter';
 import ComposerImportedState from './ComposerImportedState';
 import ComposerInput from './ComposerInput';
 import ComposerInputArea from './ComposerInputArea';
-import ComposerLayout from './ComposerLayout';
 import ComposerLocalTime from './ComposerLocalTime';
 import ComposerProvider from './ComposerProvider';
 import ComposerSendButton from './ComposerSendButton';
 import ComposerTypingIndicator from './ComposerTypingIndicator';
-import EditOnlyReportActionCompose from './EditOnlyReportActionCompose';
-import type ReportActionComposeProps from './types';
+
+type ReportActionComposeProps = {
+    /** Report ID */
+    reportID: string;
+};
 
 function ReportActionCompose({reportID}: ReportActionComposeProps) {
     return (
         <ComposerProvider reportID={reportID}>
-            <ComposerLayout>
-                <ComposerInputArea />
-            </ComposerLayout>
+            <ComposerInputArea />
             <ComposerDefaultFooter />
         </ComposerProvider>
     );
 }
 
+function EditOnlyReportActionCompose({reportID}: ReportActionComposeProps) {
+    return (
+        <ComposerProvider reportID={reportID}>
+            <ComposerInputArea />
+        </ComposerProvider>
+    );
+}
+
 ReportActionCompose.LocalTime = ComposerLocalTime;
 ReportActionCompose.Container = ComposerContainer;
 ReportActionCompose.ImportedState = ComposerImportedState;
@@ -44,7 +52,7 @@ ReportActionCompose.EditingButtons = ComposerEditingButtons;
 ReportActionCompose.Footer = ComposerFooter;
 ReportActionCompose.TypingIndicator = ComposerTypingIndicator;
 ReportActionCompose.ExceededLength = ComposerExceededLength;
-ReportActionCompose.Layout = ComposerLayout;
+ReportActionCompose.Layout = ComposerInputArea;
 ReportActionCompose.InputArea = ComposerInputArea;
 ReportActionCompose.DefaultFooter = ComposerDefaultFooter;
 ReportActionCompose.EditOnly = EditOnlyReportActionCompose;