Front-end support for CC

Feature: Issue 13773
Change-Id: Iadfa230f747b27c623224306cc43010c6783c040
diff --git a/rv-reviewers/rv-edit-screen.js b/rv-reviewers/rv-edit-screen.js
index 0c692f5..b0419bf 100644
--- a/rv-reviewers/rv-edit-screen.js
+++ b/rv-reviewers/rv-edit-screen.js
@@ -65,7 +65,7 @@
   }
 
   _handleCreateSection() {
-    const section = {filter: '', reviewers: [], editing: true};
+    const section = {filter: '', reviewers: [], ccs: [], editing: true};
     this._editingFilter = true;
     this.push('_filterSections', section);
   }
diff --git a/rv-reviewers/rv-edit-screen_html.js b/rv-reviewers/rv-edit-screen_html.js
index 63ea346..954d46c 100644
--- a/rv-reviewers/rv-edit-screen_html.js
+++ b/rv-reviewers/rv-edit-screen_html.js
@@ -56,6 +56,7 @@
               <rv-filter-section
                   filter="[[section.filter]]"
                   reviewers="[[section.reviewers]]"
+                  ccs="[[section.ccs]]"
                   editing="[[section.editing]]"
                   reviewers-url="[[_getReviewersUrl(repoName)]]"
                   repo-name="[[repoName]]"
diff --git a/rv-reviewers/rv-filter-section.js b/rv-reviewers/rv-filter-section.js
index fab5420..e2e1b20 100644
--- a/rv-reviewers/rv-filter-section.js
+++ b/rv-reviewers/rv-filter-section.js
@@ -33,6 +33,7 @@
       pluginRestApi: Object,
       repoName: String,
       reviewers: Array,
+      ccs: Array,
       filter: String,
       canModifyConfig: Boolean,
       _originalFilter: String,
@@ -77,19 +78,24 @@
   }
 
   _handleReviewerDeleted(e) {
+    const type = e.detail.type;
     if (e.detail.editing) {
-      this.reviewers.pop();
+      if (type === "CC") {
+        this.ccs.pop();
+      } else {
+        this.reviewers.pop();
+      }
       this._editingReviewer = false;
     } else {
       const index = e.model.index;
-      const deleted = this.reviewers[index];
-      this._putReviewer(deleted, 'REMOVE');
+      const deleted = type === 'CC' ? this.ccs[index] : this.reviewers[index];
+      this._putReviewer(deleted, 'REMOVE', type);
     }
   }
 
   _handleReviewerAdded(e) {
     this._editingReviewer = false;
-    this._putReviewer(e.detail.reviewer, 'ADD').catch(err => {
+    this._putReviewer(e.detail.reviewer, 'ADD', e.detail.type).catch(err => {
       this.dispatchEvent(new CustomEvent('show-alert', {
         detail: {
           message: err,
@@ -100,10 +106,11 @@
     });
   }
 
-  _putReviewer(reviewer, action) {
+  _putReviewer(reviewer, action, type) {
     return this.pluginRestApi.put(this.reviewersUrl, {
       action,
       reviewer,
+      type,
       filter: this.filter,
     }).then(result => {
       const detail = {result};
@@ -116,6 +123,11 @@
     this.push('reviewers', '');
     this._editingReviewer = true;
   }
+
+  _handleAddCc() {
+    this.push('ccs', '');
+    this._editingReviewer = true;
+  }
 }
 
 customElements.define(RvFilterSection.is, RvFilterSection);
diff --git a/rv-reviewers/rv-filter-section_html.js b/rv-reviewers/rv-filter-section_html.js
index b4a72e4..87cc7a3 100644
--- a/rv-reviewers/rv-filter-section_html.js
+++ b/rv-reviewers/rv-filter-section_html.js
@@ -84,6 +84,7 @@
               items="{{reviewers}}">
             <rv-reviewer
                 reviewer="{{item}}"
+                type="REVIEWER"
                 can-modify-config="[[canModifyConfig]]"
                 plugin-rest-api="[[pluginRestApi]]"
                 repo-name="[[repoName]]"
@@ -91,12 +92,30 @@
                 on-reviewer-added="_handleReviewerAdded">
             </rv-reviewer>
           </template>
+          <template
+          is="dom-repeat"
+          items="{{ccs}}">
+            <rv-reviewer
+                reviewer="{{item}}"
+                type="CC"
+                can-modify-config="[[canModifyConfig]]"
+                plugin-rest-api="[[pluginRestApi]]"
+                repo-name="[[repoName]]"
+                on-reviewer-deleted="_handleReviewerDeleted"
+                on-reviewer-added="_handleReviewerAdded">
+        </rv-reviewer>
+      </template>
           <div id="addReviewer">
             <gr-button
                 link
-                id="addBtn"
+                id="addRevBtn"
                 on-tap="_handleAddReviewer"
                 hidden="[[_computeAddBtnHidden(canModifyConfig, _editingReviewer)]]">Add Reviewer</gr-button>
+            <gr-button
+                link
+                id="addCcBtn"
+                on-tap="_handleAddCc"
+                hidden="[[_computeAddBtnHidden(canModifyConfig, _editingReviewer)]]">Add Cc</gr-button>
           </div><!-- addReviewer -->
         </div><!-- reviewers -->
       </div>
diff --git a/rv-reviewers/rv-reviewer.js b/rv-reviewers/rv-reviewer.js
index dd516c4..f748b51 100644
--- a/rv-reviewers/rv-reviewer.js
+++ b/rv-reviewers/rv-reviewer.js
@@ -34,6 +34,11 @@
       pluginRestAPi: Object,
       repoName: String,
       reviewer: String,
+      type: String,
+      _header: {
+        type: String,
+        computed: '_computeHeader(type)',
+      },
       _reviewerSearchId: String,
       _queryReviewers: {
         type: Function,
@@ -55,6 +60,13 @@
     this._originalReviewer = this.reviewer;
   }
 
+  _computeHeader(type) {
+    if (type === 'CC') {
+      return 'Cc';
+    }
+    return 'Reviewer';
+  }
+
   _computeEditing(reviewer, _originalReviewer) {
     if (_originalReviewer === '') {
       return true;
@@ -134,7 +146,7 @@
   }
 
   _handleDeleteCancel() {
-    const detail = {editing: this._editing};
+    const detail = {editing: this._editing, type: this.type};
     if (this._editing) {
       this.remove();
     }
@@ -143,7 +155,7 @@
   }
 
   _handleAddReviewer() {
-    const detail = {reviewer: this._reviewerSearchId};
+    const detail = {reviewer: this._reviewerSearchId, type: this.type};
     this._originalReviewer = this.reviewer;
     this.dispatchEvent(
         new CustomEvent('reviewer-added', {detail, bubbles: true}));
diff --git a/rv-reviewers/rv-reviewer_html.js b/rv-reviewers/rv-reviewer_html.js
index 0e9becb..29b22de 100644
--- a/rv-reviewers/rv-reviewer_html.js
+++ b/rv-reviewers/rv-reviewer_html.js
@@ -43,7 +43,7 @@
     </style>
     <style include="gr-form-styles"></style>
     <div class="reviewerRow">
-      <h4 id="reviewerHeader">Reviewer:</h4>
+      <h4 id="reviewerHeader">[[_header]]:</h4>
       <template is="dom-if" if="[[_computeEditing(reviewer, _originalReviewer)]]">
         <span class="value">
             <!--