diff --git a/web/chat/sidebar-item.react.js b/web/chat/sidebar-item.react.js
index 51e6cfc1e..00c019c02 100644
--- a/web/chat/sidebar-item.react.js
+++ b/web/chat/sidebar-item.react.js
@@ -1,55 +1,56 @@
 // @flow
 
 import classNames from 'classnames';
 import * as React from 'react';
 
 import type { SidebarInfo } from 'lib/types/thread-types';
+import { useResolvedThreadInfo } from 'lib/utils/entity-helpers';
 
 import { useOnClickThread } from '../selectors/thread-selectors';
 import css from './chat-thread-list.css';
 
 type Props = {
   +sidebarInfo: SidebarInfo,
   +extendArrow?: boolean,
 };
 function SidebarItem(props: Props): React.Node {
   const {
     sidebarInfo: { threadInfo },
     extendArrow = false,
   } = props;
   const {
     currentUser: { unread },
   } = threadInfo;
 
   const onClick = useOnClickThread(threadInfo);
 
   const unreadCls = classNames(css.sidebarTitle, { [css.unread]: unread });
   let arrow;
   if (extendArrow) {
     arrow = (
       <img
         className={css.longArrow}
         src="images/long_arrow.svg"
         alt="thread arrow"
       />
     );
   } else {
     arrow = (
       <img src="images/arrow.svg" className={css.arrow} alt="thread arrow" />
     );
   }
-
+  const { uiName } = useResolvedThreadInfo(threadInfo);
   return (
     <>
       {arrow}
       <div className={css.spacer} />
       <a className={css.threadButtonSidebar} onClick={onClick}>
         <div className={css.threadRow}>
-          <div className={unreadCls}>{threadInfo.uiName}</div>
+          <div className={unreadCls}>{uiName}</div>
         </div>
       </a>
     </>
   );
 }
 
 export default SidebarItem;