Make default and hidden columns in Workboards more clear

Summary: Fixes T6469. Changes the default icon into text instead. Added the text to hidden boards and now display when reordering as well.

Test Plan:
Moved a bunch of columns, tested reordering. Seems more clear.

{F229626}

{F229627}

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: Korvin, epriestley

Maniphest Tasks: T6469

Differential Revision: https://secure.phabricator.com/D10784

Author: chadlittle

resources/celerity/map.php

@@ -7,7 +7,7 @@
  */
 return array(
   'names' => array(
-    'core.pkg.css' => '74d50c3d',
+    'core.pkg.css' => '810e8b13',
     'core.pkg.js' => 'cbdbd552',
     'darkconsole.pkg.js' => 'df001cab',
     'differential.pkg.css' => '8af45893',
@@ -110,7 +110,6 @@
     'rsrc/css/font/font-awesome.css' => '327559dd',
     'rsrc/css/font/font-source-sans-pro.css' => '91d53463',
     'rsrc/css/font/phui-font-icon-base.css' => '3dad2ae3',
-    'rsrc/css/layout/phabricator-action-header-view.css' => '83e2cc86',
     'rsrc/css/layout/phabricator-crumbs-view.css' => 'a49339de',
     'rsrc/css/layout/phabricator-filetree-view.css' => 'fccf9f82',
     'rsrc/css/layout/phabricator-hovercard-view.css' => '893f4783',
@@ -120,6 +119,7 @@
     'rsrc/css/phui/calendar/phui-calendar-list.css' => 'c1d0ca59',
     'rsrc/css/phui/calendar/phui-calendar-month.css' => 'a92e47d2',
     'rsrc/css/phui/calendar/phui-calendar.css' => '8675968e',
+    'rsrc/css/phui/phui-action-header-view.css' => '89c497e7',
     'rsrc/css/phui/phui-action-list.css' => '9ee9910a',
     'rsrc/css/phui/phui-box.css' => '7b3a2eed',
     'rsrc/css/phui/phui-button.css' => 'c7412aa1',
@@ -134,7 +134,7 @@
     'rsrc/css/phui/phui-info-panel.css' => '27ea50a1',
     'rsrc/css/phui/phui-list.css' => '43ed2d93',
     'rsrc/css/phui/phui-object-box.css' => 'e9f7e938',
-    'rsrc/css/phui/phui-object-item-list-view.css' => '5053dee8',
+    'rsrc/css/phui/phui-object-item-list-view.css' => '1f710f4e',
     'rsrc/css/phui/phui-pinboard-view.css' => '3dd4a269',
     'rsrc/css/phui/phui-property-list-view.css' => '86f9df88',
     'rsrc/css/phui/phui-remarkup-preview.css' => '19ad512b',
@@ -758,7 +758,7 @@
     'phortune-css' => '9149f103',
     'phrequent-css' => 'ffc185ad',
     'phriction-document-css' => '7d7f0071',
-    'phui-action-header-view-css' => '83e2cc86',
+    'phui-action-header-view-css' => '89c497e7',
     'phui-box-css' => '7b3a2eed',
     'phui-button-css' => 'c7412aa1',
     'phui-calendar-css' => '8675968e',
@@ -777,7 +777,7 @@
     'phui-info-panel-css' => '27ea50a1',
     'phui-list-view-css' => '43ed2d93',
     'phui-object-box-css' => 'e9f7e938',
-    'phui-object-item-list-view-css' => '5053dee8',
+    'phui-object-item-list-view-css' => '1f710f4e',
     'phui-pinboard-view-css' => '3dd4a269',
     'phui-property-list-view-css' => '86f9df88',
     'phui-remarkup-preview-css' => '19ad512b',

src/applications/project/controller/PhabricatorProjectBoardReorderController.php

@@ -107,7 +107,8 @@ public function processRequest() {
 
     foreach ($columns as $column) {
       $item = id(new PHUIObjectItemView())
-        ->setHeader($column->getDisplayName());
+        ->setHeader($column->getDisplayName())
+        ->addIcon('none', $column->getDisplayType());
 
       if ($column->isHidden()) {
         $item->setDisabled(true);

src/applications/project/controller/PhabricatorProjectBoardViewController.php

@@ -227,6 +227,7 @@ public function processRequest() {
 
       $panel = id(new PHUIWorkpanelView())
         ->setHeader($column->getDisplayName())
+        ->setSubHeader($column->getDisplayType())
         ->addSigil('workpanel');
 
       $header_icon = $column->getHeaderIcon();

src/applications/project/storage/PhabricatorProjectColumn.php

@@ -84,6 +84,17 @@ public function getDisplayName() {
     return pht('Unnamed Column');
   }
 
+  public function getDisplayType() {
+    if ($this->isDefaultColumn()) {
+      return pht('(Default)');
+    }
+    if ($this->isHidden()) {
+      return pht('(Hidden)');
+    }
+
+    return null;
+  }
+
   public function getHeaderIcon() {
     $icon = null;
 
@@ -92,11 +103,6 @@ public function getHeaderIcon() {
       $text = pht('Hidden');
     }
 
-    if ($this->isDefaultColumn()) {
-      $icon = 'fa-archive';
-      $text = pht('Default');
-    }
-
     if ($icon) {
       return id(new PHUIIconView())
         ->setIconFont($icon)

src/view/phui/PHUIActionHeaderView.php

@@ -11,6 +11,7 @@ final class PHUIActionHeaderView extends AphrontView {
   const HEADER_WHITE = 'white';
 
   private $headerTitle;
+  private $headerSubtitle;
   private $headerHref;
   private $headerIcon;
   private $headerSigils = array();
@@ -39,6 +40,11 @@ public function setHeaderTitle($header) {
     return $this;
   }
 
+  public function setHeaderSubtitle($subtitle) {
+    $this->headerSubtitle = $subtitle;
+    return $this;
+  }
+
   public function setHeaderHref($href) {
     $this->headerHref = $href;
     return $this;
@@ -131,6 +137,16 @@ public function render() {
           $this->headerTitle);
     }
 
+    $header_subtitle = null;
+    if ($this->headerSubtitle) {
+      $header_subtitle = phutil_tag(
+        'span',
+          array(
+            'class' => 'phui-action-header-subtitle',
+          ),
+          $this->headerSubtitle);
+    }
+
     $header = phutil_tag(
       'h3',
         array(
@@ -139,6 +155,7 @@ public function render() {
       array(
         $header_icon,
         $header_title,
+        $header_subtitle,
       ));
 
     $icons = '';

src/view/phui/PHUIWorkpanelView.php

@@ -4,6 +4,7 @@ final class PHUIWorkpanelView extends AphrontTagView {
 
   private $cards = array();
   private $header;
+  private $subheader = null;
   private $footerAction;
   private $headerColor = PHUIActionHeaderView::HEADER_GREY;
   private $headerActions = array();
@@ -29,6 +30,11 @@ public function setHeader($header) {
     return $this;
   }
 
+  public function setSubheader($subheader) {
+    $this->subheader = $subheader;
+    return $this;
+  }
+
   public function setFooterAction(PHUIListItemView $footer_action) {
     $this->footerAction = $footer_action;
     return $this;
@@ -73,6 +79,7 @@ public function getTagContent() {
 
     $header = id(new PHUIActionHeaderView())
       ->setHeaderTitle($this->header)
+      ->setHeaderSubtitle($this->subheader)
       ->setHeaderColor($this->headerColor);
 
     if ($this->headerIcon) {

webroot/rsrc/css/layout/phabricator-action-header-view.css renamed to webroot/rsrc/css/phui/phui-action-header-view.css

@@ -72,13 +72,19 @@
   font-weight: normal;
 }
 
-.phui-action-header-title span {
+.phui-action-header-title .phui-icon-view {
   float: left;
   height: 16px;
   width: 16px;
   margin-right: 4px;
 }
 
+.phui-action-header-title .phui-action-header-subtitle {
+  margin-left: 4px;
+  font-weight: normal;
+  color: {$lightgreytext};
+}
+
 /* - Dashboards ------------------------------------------------------------ */
 
 .dashboard-panel .phui-action-header.gradient-grey-header,

webroot/rsrc/css/phui/phui-object-item-list-view.css

@@ -271,6 +271,10 @@
   padding: 0 10px;
 }
 
+ul.phui-object-item-icons {
+  margin: 0;
+}
+
 /* NOTE: The main content is an "overflow: hidden" div which we give a right
    margin so it doesn't overlap the icons. The margin is slightly larger than
    the width + padding of the icon div, so the icons have some space even if