diff --git a/ts/components/leftpane/LeftPane.tsx b/ts/components/leftpane/LeftPane.tsx index caaad4db5..82fbef1d5 100644 --- a/ts/components/leftpane/LeftPane.tsx +++ b/ts/components/leftpane/LeftPane.tsx @@ -1,9 +1,7 @@ import { useSelector } from 'react-redux'; import styled from 'styled-components'; import { SectionType } from '../../state/ducks/section'; -import { getLeftPaneConversationIds } from '../../state/selectors/conversations'; -import { getHasSearchResults } from '../../state/selectors/search'; -import { getFocusedSection, getLeftOverlayMode } from '../../state/selectors/section'; +import { getFocusedSection } from '../../state/selectors/section'; import { SessionToastContainer } from '../SessionToastContainer'; import { CallInFullScreenContainer } from '../calling/CallInFullScreenContainer'; import { DraggableCallContainer } from '../calling/DraggableCallContainer'; @@ -18,25 +16,11 @@ const StyledLeftPane = styled.div` width: ${leftPaneListWidth}px; `; -const InnerLeftPaneMessageSection = () => { - const hasSearchResults = useSelector(getHasSearchResults); - const conversationIds = useSelector(getLeftPaneConversationIds); - const leftOverlayMode = useSelector(getLeftOverlayMode); - - return ( - - ); -}; - const LeftPaneSection = () => { const focusedSection = useSelector(getFocusedSection); if (focusedSection === SectionType.Message) { - return ; + return ; } if (focusedSection === SectionType.Settings) { diff --git a/ts/components/leftpane/LeftPaneMessageSection.tsx b/ts/components/leftpane/LeftPaneMessageSection.tsx index 700722565..0727d0565 100644 --- a/ts/components/leftpane/LeftPaneMessageSection.tsx +++ b/ts/components/leftpane/LeftPaneMessageSection.tsx @@ -1,3 +1,4 @@ +import { isEmpty } from 'lodash'; import { useSelector } from 'react-redux'; import { AutoSizer, List, ListRowProps } from 'react-virtualized'; import styled from 'styled-components'; @@ -5,7 +6,9 @@ import { SearchResults } from '../search/SearchResults'; import { LeftPaneSectionHeader } from './LeftPaneSectionHeader'; import { MessageRequestsBanner } from './MessageRequestsBanner'; -import { LeftOverlayMode, setLeftOverlayMode } from '../../state/ducks/section'; +import { setLeftOverlayMode } from '../../state/ducks/section'; +import { getLeftPaneConversationIds } from '../../state/selectors/conversations'; +import { getSearchTerm } from '../../state/selectors/search'; import { getLeftOverlayMode } from '../../state/selectors/section'; import { assertUnreachable } from '../../types/sqlSharedTypes'; import { SessionSearchInput } from '../SessionSearchInput'; @@ -18,12 +21,6 @@ import { OverlayMessage } from './overlay/OverlayMessage'; import { OverlayMessageRequest } from './overlay/OverlayMessageRequest'; import { OverlayChooseAction } from './overlay/choose-action/OverlayChooseAction'; -export interface Props { - conversationIds?: Array; - hasSearchResults: boolean; - leftOverlayMode: LeftOverlayMode | undefined; -} - const StyledLeftPaneContent = styled.div` display: flex; flex-direction: column; @@ -66,8 +63,10 @@ const ClosableOverlay = () => { } }; -export const LeftPaneMessageSection = (props: Props) => { - const { conversationIds, hasSearchResults, leftOverlayMode } = props; +export const LeftPaneMessageSection = () => { + const conversationIds = useSelector(getLeftPaneConversationIds); + const leftOverlayMode = useSelector(getLeftOverlayMode); + const searchTerm = useSelector(getSearchTerm); const renderRow = ({ index, key, style }: ListRowProps): JSX.Element | null => { // assume conversations that have been marked unapproved should be filtered out by selector. @@ -84,7 +83,7 @@ export const LeftPaneMessageSection = (props: Props) => { }; const renderList = () => { - if (hasSearchResults) { + if (!isEmpty(searchTerm)) { return ; } diff --git a/ts/components/search/SearchResults.tsx b/ts/components/search/SearchResults.tsx index 403087a43..dcd36d0a9 100644 --- a/ts/components/search/SearchResults.tsx +++ b/ts/components/search/SearchResults.tsx @@ -35,8 +35,8 @@ const SearchResultsContainer = styled.div` width: -webkit-fill-available; `; const NoResults = styled.div` - margin-top: 27px; width: 100%; + padding: var(--margins-xl) var(--margins-sm) 0; text-align: center; `; diff --git a/ts/state/selectors/search.ts b/ts/state/selectors/search.ts index 84e554200..37a7d8d1f 100644 --- a/ts/state/selectors/search.ts +++ b/ts/state/selectors/search.ts @@ -75,9 +75,6 @@ export type SearchResultsMergedListItem = export const getSearchResultsList = createSelector([getSearchResults], searchState => { const { contactsAndConversations, messages } = searchState; - window.log.debug( - `WIP: [getSearchResultsList] contactsAndConversations ${JSON.stringify(contactsAndConversations)}` - ); const builtList: Array = []; if (contactsAndConversations.length) {