From ae73880b2b8eb2432e53e5f140714c2bd67c3256 Mon Sep 17 00:00:00 2001
From: Evan Morikawa <evan@evanmorikawa.com>
Date: Tue, 10 Mar 2015 13:27:21 -0700
Subject: [PATCH] feat(messages): add bcc label to message headers

---
 internal_packages/message-list/lib/message-item.cjsx   |  1 +
 .../message-list/lib/message-participants.cjsx         | 10 ++++++++++
 .../message-list/stylesheets/message-list.less         |  7 ++++---
 3 files changed, 15 insertions(+), 3 deletions(-)

diff --git a/internal_packages/message-list/lib/message-item.cjsx b/internal_packages/message-list/lib/message-item.cjsx
index b1dce5110..86bae8b3d 100644
--- a/internal_packages/message-list/lib/message-item.cjsx
+++ b/internal_packages/message-list/lib/message-item.cjsx
@@ -54,6 +54,7 @@ MessageItem = React.createClass
 
         <MessageParticipants to={@props.message.to}
                              cc={@props.message.cc}
+                             bcc={@props.message.bcc}
                              from={@props.message.from}
                              onClick={=> @setState detailedHeaders: true}
                              thread_participants={@props.thread_participants}
diff --git a/internal_packages/message-list/lib/message-participants.cjsx b/internal_packages/message-list/lib/message-participants.cjsx
index 5eae77e92..9b5619cfb 100644
--- a/internal_packages/message-list/lib/message-participants.cjsx
+++ b/internal_packages/message-list/lib/message-participants.cjsx
@@ -24,6 +24,10 @@ MessageParticipants = React.createClass
         <span className="participant-label cc-label">Cc:&nbsp;</span>
         <span className="participant-name cc-contact">{@_shortNames(@props.cc)}</span>
       </span>
+      <span style={if @props.bcc.length > 0 then display:"inline" else display:"none"}>
+        <span className="participant-label bcc-label">Bcc:&nbsp;</span>
+        <span className="participant-name cc-contact">{@_shortNames(@props.bcc)}</span>
+      </span>
     </span>
 
   _renderExpanded: ->
@@ -43,6 +47,12 @@ MessageParticipants = React.createClass
         <div className="participant-label cc-label">Cc:&nbsp;</div>
         <div className="participant-name cc-contact">{@_fullContact(@props.cc)}</div>
       </div>
+
+      <div className="participant-type"
+           style={if @props.bcc.length > 0 then display:"block" else display:"none"}>
+        <div className="participant-label bcc-label">Bcc:&nbsp;</div>
+        <div className="participant-name cc-contact">{@_fullContact(@props.bcc)}</div>
+      </div>
     </div>
 
   _shortNames: (contacts=[]) ->
diff --git a/internal_packages/message-list/stylesheets/message-list.less b/internal_packages/message-list/stylesheets/message-list.less
index a4898ff5c..0aa0a8f99 100644
--- a/internal_packages/message-list/stylesheets/message-list.less
+++ b/internal_packages/message-list/stylesheets/message-list.less
@@ -153,11 +153,11 @@
     font-weight: @headings-font-weight;
     color: @text-color;
   }
-  .from-label, .to-label, .cc-label {
+  .from-label, .to-label, .cc-label, .bcc-label {
     color: @text-color-very-subtle;
   }
   .to-label { font-weight: 600; }
-  .cc-label { margin-left: @spacing-standard; }
+  .cc-label, .bcc-label { margin-left: @spacing-standard; }
   .to-contact, .cc-contact, .to-everyone {
     color: @text-color-very-subtle;
   }
@@ -171,7 +171,7 @@
       &:first-child {margin-top: 0;}
     }
 
-    .from-label, .to-label, .cc-label {
+    .from-label, .to-label, .cc-label, .bcc-label {
       float: left;
       display: block;
       font-weight: 400;
@@ -185,6 +185,7 @@
 
     .from-label { margin-right: 1em; }
     .to-label, .cc-label { margin-right: 2.15em; }
+    .bcc-label { margin-right: 1.7em; }
 
     .participant-primary {
       color: @text-color;