diff --git a/web/chat/message-preview.react.js b/web/chat/message-preview.react.js
--- a/web/chat/message-preview.react.js
+++ b/web/chat/message-preview.react.js
@@ -25,6 +25,8 @@
   const { messageInfo: messageInfoProps, threadInfo } = props;
   const { unread } = threadInfo.currentUser;
 
+  const colorStyle = unread ? css.white : css.light;
+
   if (!messageInfoProps) {
     return (
       <div className={classNames(css.lastMessage, css.dark, css.italic)}>
@@ -36,6 +38,7 @@
     messageInfoProps.type === messageTypes.SIDEBAR_SOURCE
       ? messageInfoProps.sourceMessage
       : messageInfoProps;
+
   const messageTitle = getMessageTitle(
     messageInfo,
     threadInfo,
@@ -50,10 +53,8 @@
     ) {
       const userString = stringForUser(messageInfo.creator);
       const username = `${userString}: `;
-      const usernameStyle = unread ? css.white : css.light;
-      usernameText = <span className={usernameStyle}>{username}</span>;
+      usernameText = <span className={colorStyle}>{username}</span>;
     }
-    const colorStyle = unread ? css.white : css.light;
     return (
       <div className={classNames(css.lastMessage, colorStyle)}>
         {usernameText}
@@ -61,9 +62,8 @@
       </div>
     );
   } else {
-    const colorStyle = unread ? css.white : css.light;
     return (
-      <div className={classNames([css.lastMessage, colorStyle])}>
+      <div className={classNames(css.lastMessage, colorStyle)}>
         {messageTitle}
       </div>
     );