fix: no letter headings in search results conversations and adjusted height

ts/components/leftpane/overlay/choose-action/ContactsListWithBreaks.tsx

@@ -14,6 +14,7 @@ import { StyledChooseActionTitle } from './ActionRow';
 import { ContactRow, ContactRowBreak } from './ContactRow';
 import { UserUtils } from '../../../../session/utils';
 import { getThemeValue, pxValueToNumber } from '../../../../themes/globals';
+import { SearchResultsMergedListItem } from '../../../../state/selectors/search';
 
 const StyledContactSection = styled.div`
   display: flex;
@@ -68,6 +69,19 @@ const renderRow = (props: ListRowProps) => {
   return <ContactRow style={style as CSSProperties} key={key} {...item} />;
 };
 
+export function calcContactRowHeight(
+  items: Array<SearchResultsMergedListItem | string | DirectContactsByNameType>,
+  params: Index,
+  overrides?: {
+    rowHeight?: number;
+    breakRowHeight?: number;
+  }
+) {
+  return isString(items[params.index])
+    ? overrides?.breakRowHeight || pxValueToNumber(getThemeValue('--contact-row-break-height'))
+    : overrides?.rowHeight || pxValueToNumber(getThemeValue('--contact-row-height'));
+}
+
 const unknownSection = 'unknown';
 
 const ContactListItemSection = () => {
@@ -99,12 +113,6 @@ const ContactListItemSection = () => {
 
   const length = Number(directContactsByNameWithBreaks.length);
 
-  const calcRowHeight = (params: Index) => {
-    return isString(directContactsByNameWithBreaks[params.index])
-      ? pxValueToNumber(getThemeValue('--contact-row-break-height'))
-      : pxValueToNumber(getThemeValue('--contact-row-height'));
-  };
-
   return (
     <StyledLeftPaneList key={0} style={{ width: '100%' }}>
       <AutoSizer>
@@ -114,7 +122,7 @@ const ContactListItemSection = () => {
               className="module-left-pane__virtual-list"
               height={height}
               rowCount={length}
-              rowHeight={calcRowHeight}
+              rowHeight={params => calcContactRowHeight(directContactsByNameWithBreaks, params)}
               directContactsByNameWithBreaks={directContactsByNameWithBreaks}
               rowRenderer={renderRow}
               width={leftPaneListWidth}

ts/components/search/SearchResults.tsx

@@ -12,6 +12,7 @@ import {
   getSearchResultsList,
   getSearchTerm,
 } from '../../state/selectors/search';
+import { calcContactRowHeight } from '../leftpane/overlay/choose-action/ContactsListWithBreaks';
 
 const StyledSeparatorSection = styled.div<{ isSubtitle: boolean }>`
   height: 36px;
@@ -63,15 +64,16 @@ function isContact(item: SearchResultsMergedListItem): item is { contactConvoId:
 
 const VirtualizedList = () => {
   const searchResultList = useSelector(getSearchResultsList);
+
   return (
     <AutoSizer>
       {({ height, width }) => (
         <List
           height={height}
           rowCount={searchResultList.length}
-          rowHeight={rowPos => {
+          rowHeight={params =>
-            return isString(searchResultList[rowPos.index]) ? 36 : 64;
+            calcContactRowHeight(searchResultList, params, { breakRowHeight: 36 })
-          }}
+          }
           rowRenderer={({ index, key, style }) => {
             const row = searchResultList[index];
             if (!row) {

ts/state/selectors/search.ts

@@ -99,21 +99,22 @@ export const getSearchResultsList = createSelector([getSearchResults], searchSta
     );
 
     // add a break wherever needed
-    let currentChar = '';
+    // let currentChar = '';
     for (let i = 0; i < idsWithNameAndType.length; i++) {
       const m = idsWithNameAndType[i];
       if (m.contactConvoId === us) {
         usIndex = i;
         continue;
       }
-      if (
+      // we might want breaks again in future
-        idsWithNameAndType.length > 1 &&
+      // if (
-        m.displayName &&
+      //   idsWithNameAndType.length > 1 &&
-        m.displayName[0].toLowerCase() !== currentChar
+      //   m.displayName &&
-      ) {
+      //   m.displayName[0].toLowerCase() !== currentChar
-        currentChar = m.displayName[0].toLowerCase();
+      // ) {
-        builtList.push(currentChar.toUpperCase());
+      //   currentChar = m.displayName[0].toLowerCase();
-      }
+      //   builtList.push(currentChar.toUpperCase());
+      // }
       builtList.push(m);
     }