diff --git a/web/modals/search/message-search-modal.react.js b/web/modals/search/message-search-modal.react.js
index ab382edef..c155c03c0 100644
--- a/web/modals/search/message-search-modal.react.js
+++ b/web/modals/search/message-search-modal.react.js
@@ -1,158 +1,158 @@
// @flow
import * as React from 'react';
import { useModalContext } from 'lib/components/modal-provider.react.js';
import type { ThreadInfo } from 'lib/types/thread-types.js';
import { useResolvedThreadInfo } from 'lib/utils/entity-helpers.js';
import css from './message-search-modal.css';
import { useParseSearchResults } from './message-search-utils.react.js';
import { useTooltipContext } from '../../chat/tooltip-provider.js';
import Button from '../../components/button.react.js';
import MessageResult from '../../components/message-result.react.js';
import Search from '../../components/search.react.js';
import LoadingIndicator from '../../loading-indicator.react.js';
import { useMessageSearchContext } from '../../search/message-search-state-provider.react.js';
import Modal from '../modal.react.js';
type ContentProps = {
+threadInfo: ThreadInfo,
};
function MessageSearchModal(props: ContentProps): React.Node {
const { threadInfo } = props;
const {
getQuery,
setQuery,
clearQuery,
searchMessages,
getSearchResults,
getEndReached,
} = useMessageSearchContext();
const [input, setInput] = React.useState(getQuery(threadInfo.id));
const onPressSearch = React.useCallback(() => {
setQuery(input, threadInfo.id);
searchMessages(threadInfo.id);
}, [setQuery, input, searchMessages, threadInfo.id]);
const onKeyDown = React.useCallback(
event => {
if (event.key === 'Enter') {
onPressSearch();
}
},
[onPressSearch],
);
const modifiedItems = useParseSearchResults(
threadInfo,
getSearchResults(threadInfo.id),
);
const { clearTooltip } = useTooltipContext();
const messageContainer = React.useRef(null);
const possiblyLoadMoreMessages = React.useCallback(() => {
if (!messageContainer.current) {
return;
}
const loaderTopOffset = 32;
const { scrollTop, scrollHeight, clientHeight } = messageContainer.current;
if (Math.abs(scrollTop) + clientHeight + loaderTopOffset < scrollHeight) {
return;
}
searchMessages(threadInfo.id);
}, [searchMessages, threadInfo.id]);
const onScroll = React.useCallback(() => {
clearTooltip();
possiblyLoadMoreMessages();
}, [clearTooltip, possiblyLoadMoreMessages]);
const renderItem = React.useCallback(
item => (