diff --git a/app/components/post_draft/post_input/post_input.tsx b/app/components/post_draft/post_input/post_input.tsx index b04a79986..a82022d65 100644 --- a/app/components/post_draft/post_input/post_input.tsx +++ b/app/components/post_draft/post_input/post_input.tsx @@ -220,7 +220,7 @@ export default function PostInput({ addFiles(await extractFileInfo(files)); }, [addFiles, intl]); - const handleHardwareEnterPress = () => { + const handleHardwareEnterPress = useCallback(() => { const topScreen = NavigationStore.getVisibleScreen(); let sourceScreen: AvailableScreens = Screens.CHANNEL; if (rootId) { @@ -231,9 +231,9 @@ export default function PostInput({ if (topScreen === sourceScreen) { sendMessage(); } - }; + }, [sendMessage, rootId, isTablet]); - const handleHardwareShiftEnter = () => { + const handleHardwareShiftEnter = useCallback(() => { const topScreen = NavigationStore.getVisibleScreen(); let sourceScreen: AvailableScreens = Screens.CHANNEL; if (rootId) { @@ -251,7 +251,7 @@ export default function PostInput({ updateCursorPosition((pos) => pos + 1); propagateValue(newValue!); } - }; + }, [rootId, isTablet, updateValue, updateCursorPosition, cursorPosition, propagateValue]); const onAppStateChange = useCallback((appState: AppStateStatus) => { if (appState !== 'active' && previousAppState.current === 'active') { @@ -307,10 +307,11 @@ export default function PostInput({ } }, [value]); - useHardwareKeyboardEvents({ + const events = useMemo(() => ({ onEnterPressed: handleHardwareEnterPress, onShiftEnterPressed: handleHardwareShiftEnter, - }); + }), [handleHardwareEnterPress, handleHardwareShiftEnter]); + useHardwareKeyboardEvents(events); return ( { + const handleFindChannels = useCallback(() => { if (!NavigationStore.getScreensInStack().includes(Screens.FIND_CHANNELS)) { findChannels( intl.formatMessage({id: 'find_channels.title', defaultMessage: 'Find Channels'}), theme, ); } - }; + }, [intl, theme]); - useHardwareKeyboardEvents({onFindChannels: handleFindChannels}); + const events = useMemo(() => ({onFindChannels: handleFindChannels}), [handleFindChannels]); + useHardwareKeyboardEvents(events); useEffect(() => { const listener = DeviceEventEmitter.addListener(Events.NOTIFICATION_ERROR, (value: 'Team' | 'Channel' | 'Post' | 'Connection') => { diff --git a/app/screens/home/search/search.tsx b/app/screens/home/search/search.tsx index fc16c9946..48c6463b3 100644 --- a/app/screens/home/search/search.tsx +++ b/app/screens/home/search/search.tsx @@ -324,15 +324,16 @@ const SearchScreen = ({teamId, teams}: Props) => { } }, [isFocused]); - const handleEnterPressed = () => { + const handleEnterPressed = useCallback(() => { const topScreen = NavigationStore.getVisibleScreen(); if (topScreen === Screens.HOME && isFocused) { searchRef.current?.blur(); onSubmit(); } - }; + }, [isFocused, onSubmit]); - useHardwareKeyboardEvents({onEnterPressed: handleEnterPressed}); + const events = useMemo(() => ({onEnterPressed: handleEnterPressed}), [handleEnterPressed]); + useHardwareKeyboardEvents(events); return ( diff --git a/libraries/@mattermost/hardware-keyboard/src/index.tsx b/libraries/@mattermost/hardware-keyboard/src/index.tsx index 76986af97..b8747c4c6 100644 --- a/libraries/@mattermost/hardware-keyboard/src/index.tsx +++ b/libraries/@mattermost/hardware-keyboard/src/index.tsx @@ -1,7 +1,7 @@ // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. // See LICENSE.txt for license information. -import {useEffect} from 'react'; +import {useCallback, useEffect} from 'react'; import {NativeEventEmitter, NativeModules, Platform} from 'react-native'; const LINKING_ERROR = @@ -37,7 +37,7 @@ type Events = { } export function useHardwareKeyboardEvents(events: Events) { - const handleEvent = (e: Event) => { + const handleEvent = useCallback((e: Event) => { switch (e.action) { case 'enter': events.onEnterPressed?.(); @@ -49,11 +49,11 @@ export function useHardwareKeyboardEvents(events: Events) { events.onFindChannels?.(); break; } - }; + }, [events]); useEffect(() => { const listener = emitter.addListener('mmHardwareKeyboardEvent', handleEvent); return () => listener.remove(); - }, []); + }, [handleEvent]); }