render triple dots menu on header only when not on default viewmode

stylesheets/_session_conversation.scss

@@ -157,6 +157,9 @@
 
     &.show {
       display: flex;
+      @include themify($themes) {
+        background: themed('inboxBackground');
+      }
     }
   }
 }

ts/components/conversation/ConversationHeader.tsx

@@ -270,12 +270,7 @@ class ConversationHeader extends React.Component<Props> {
           {this.renderBackButton()}
           <div className="module-conversation-header__title-container">
             <div className="module-conversation-header__title-flex">
-              <MenuProvider id={triggerId} event="onClick">
-                <SessionIconButton
-                  iconType={SessionIconType.Ellipses}
-                  iconSize={SessionIconSize.Medium}
-                />
-              </MenuProvider>
+              {this.renderTripleDotsMenu(triggerId)}
               {this.renderTitle()}
             </div>
           </div>
@@ -309,6 +304,21 @@ class ConversationHeader extends React.Component<Props> {
       ...this.props,
     };
   }
+
+  private renderTripleDotsMenu(triggerId: string) {
+    const { showBackButton } = this.props;
+    if (showBackButton) {
+      return <></>;
+    }
+    return (
+      <MenuProvider id={triggerId} event="onClick">
+        <SessionIconButton
+          iconType={SessionIconType.Ellipses}
+          iconSize={SessionIconSize.Medium}
+        />
+      </MenuProvider>
+    );
+  }
 }
 
 export const ConversationHeaderWithDetails = usingClosedConversationDetails(