refactor: simplify MessageComposer

app/containers/MessageComposer/MessageComposer.tsx

@@ -85,7 +85,7 @@ export const MessageComposer = ({
 
 	const closeEmojiKeyboardAndAction = (onClosed?: Function, params?: any) => {
 		resetKeyboard();
-		onClosed && onClosed(params);
+		onClosed?.(params);
 	};
 
 	useImperativeHandle(forwardedRef, () => ({

app/containers/MessageComposer/MessageComposerContainer.tsx

@@ -6,8 +6,10 @@ import { MessageComposer } from './MessageComposer';
 import { EmojiKeyboardProvider } from './hooks/useEmojiKeyboard';
 import { ComposerAttachments } from './components/Attachments/ComposerAttachments';
 
+const defaultChildren = <ComposerAttachments />;
+
 export const MessageComposerContainer = forwardRef<IMessageComposerRef, IMessageComposerContainerProps>(
-	({ children = <ComposerAttachments /> }, ref): ReactElement => {
+	({ children = defaultChildren }, ref): ReactElement => {
 		return (
 			<MessageComposerProvider>
 				<EmojiKeyboardProvider>

app/containers/MessageComposer/components/Autocomplete/useAutocompleteA11yAnnounce.ts

@@ -4,6 +4,8 @@ import { AccessibilityInfo } from 'react-native';
 import I18n from '../../../../i18n';
 import { useIsAutocompleteVisible } from '../../../../views/RoomView/stores/ComposerStore';
 
+const DELAY_TO_AVOID_KEYBOARD_ANNOUNCEMENT_CONFLICT = 800;
+
 export const useAutocompleteA11yAnnounce = (): void => {
 	const isAutocompleteVisible = useIsAutocompleteVisible();
 
@@ -12,10 +14,9 @@ export const useAutocompleteA11yAnnounce = (): void => {
 			return;
 		}
 
-		// timeout to prevent conflict with default keyboard announcement.
 		const timeout = setTimeout(() => {
 			AccessibilityInfo.announceForAccessibility(I18n.t('The_autocomplete_options_are_available_above_the_input_composer'));
-		}, 800);
+		}, DELAY_TO_AVOID_KEYBOARD_ANNOUNCEMENT_CONFLICT);
 
 		return () => clearTimeout(timeout);
 	}, [isAutocompleteVisible]);

app/containers/MessageComposer/components/CancelEdit.tsx

@@ -1,13 +1,13 @@
 import { BaseButton } from './Buttons';
 import { useEditCancel } from '../../../views/RoomView/stores/ComposerStore';
-import { useMessageAction } from '../../message/stores/MessageActionStore';
+import { useMessageActionKind } from '../../message/stores/MessageActionStore';
 import { Gap } from './Gap';
 
 export const CancelEdit = () => {
 	const editCancel = useEditCancel();
-	const action = useMessageAction();
+	const actionKind = useMessageActionKind();
 
-	if (action?.kind !== 'edit') {
+	if (actionKind !== 'edit') {
 		return null;
 	}
 	return (