Fix/35368: Composer is not shrinked

src/components/Composer/index.native.tsx

@@ -27,6 +27,7 @@ function Composer(
         // user can read new chats without the keyboard in the way of the view.
         // On Android the selection prop is required on the TextInput but this prop has issues on IOS
         selection,
+        resetFullComposerSize = () => {},
         ...props
     }: ComposerProps,
     ref: ForwardedRef<TextInput>,
@@ -73,7 +74,9 @@ function Composer(
             autoComplete="off"
             placeholderTextColor={theme.placeholderText}
             ref={setTextInputRef}
-            onContentSizeChange={(e) => ComposerUtils.updateNumberOfLines({maxLines, isComposerFullSize, isDisabled, setIsFullComposerAvailable}, e, styles)}
+            onContentSizeChange={(e) =>
+                ComposerUtils.updateNumberOfLines({maxLines, isComposerFullSize, isDisabled, setIsFullComposerAvailable, resetFullComposerSize, value: props.value}, e, styles)
+            }
             rejectResponderTermination={false}
             smartInsertDelete={false}
             textAlignVertical="center"

src/components/Composer/index.tsx

@@ -19,6 +19,7 @@ import updateIsFullComposerAvailable from '@libs/ComposerUtils/updateIsFullCompo
 import * as FileUtils from '@libs/fileDownload/FileUtils';
 import isEnterWhileComposition from '@libs/KeyboardShortcut/isEnterWhileComposition';
 import ReportActionComposeFocusManager from '@libs/ReportActionComposeFocusManager';
+import * as ReportUtils from '@libs/ReportUtils';
 import CONST from '@src/CONST';
 import type {ComposerProps} from './types';
 
@@ -70,6 +71,7 @@ function Composer(
             start: 0,
             end: 0,
         },
+        resetFullComposerSize = () => {},
         isReportActionCompose = false,
         isComposerFullSize = false,
         shouldContainScroll = false,
@@ -248,6 +250,9 @@ function Composer(
         onNumberOfLinesChange(generalNumberOfLines);
         updateIsFullComposerAvailable({isFullComposerAvailable, setIsFullComposerAvailable}, generalNumberOfLines);
         setNumberOfLines(generalNumberOfLines);
+        if (generalNumberOfLines === 1 && ReportUtils.getCommentLength(value ?? '') === 0) {
+            resetFullComposerSize();
+        }
         textInput.current.style.height = 'auto';
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [value, maxLines, numberOfLinesProp, onNumberOfLinesChange, isFullComposerAvailable, setIsFullComposerAvailable, windowWidth]);

src/components/Composer/types.ts

@@ -80,6 +80,9 @@ type ComposerProps = {
 
     onBlur?: (event: NativeSyntheticEvent<TextInputFocusEventData>) => void;
 
+    /** Function to reset the full composer size */
+    resetFullComposerSize?: () => void;
+
     /** Should make the input only scroll inside the element avoid scroll out to parent */
     shouldContainScroll?: boolean;
 };

src/libs/ComposerUtils/updateNumberOfLines/index.native.ts

@@ -1,5 +1,6 @@
 import getNumberOfLines from '@libs/ComposerUtils/getNumberOfLines';
 import updateIsFullComposerAvailable from '@libs/ComposerUtils/updateIsFullComposerAvailable';
+import * as ReportUtils from '@libs/ReportUtils';
 import type UpdateNumberOfLines from './types';
 
 /**
@@ -14,6 +15,9 @@
         return;
     }
     const numberOfLines = getNumberOfLines(lineHeight, paddingTopAndBottom, inputHeight);
+    if (numberOfLines === 1) {
+        props.resetFullComposerSize?.();
+    }
     updateIsFullComposerAvailable(props, numberOfLines);
 };
 

src/pages/home/report/ReportActionCompose/ComposerWithSuggestions/ComposerWithSuggestions.js

@@ -100,6 +100,7 @@ function ComposerWithSuggestions({
     listHeight,
     isScrollLikelyLayoutTriggered,
     raiseIsScrollLikelyLayoutTriggered,
+    resetFullComposerSize,
     // Refs
     suggestionsRef,
     animatedRef,
@@ -624,6 +625,7 @@ function ComposerWithSuggestions({
                     onLayout={onLayout}
                     onScroll={hideSuggestionMenu}
                     shouldContainScroll={Browser.isMobileSafari()}
+                    resetFullComposerSize={resetFullComposerSize}
                 />
             </View>
 

src/pages/home/report/ReportActionCompose/ReportActionCompose.js

@@ -444,6 +444,7 @@ function ReportActionCompose({
                                         measureParentContainer={measureContainer}
                                         listHeight={listHeight}
                                         onValueChange={validateCommentMaxLength}
+                                        resetFullComposerSize={resetFullComposerSize}
                                     />
                                     <ReportDropUI
                                         onDrop={(e) => {