Add a "Header" standard custom field

Summary: Ref T418. This is the last of the Maniphest field types, although I have a few more capabilities/options to port over.

Test Plan: See screenshots.

Reviewers: btrahan

Reviewed By: btrahan

CC: chad, aran

Maniphest Tasks: T418

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

Author: epriestley

src/__celerity_resource_map__.php

@@ -3765,7 +3765,7 @@
   ),
   'phui-form-view-css' =>
   array(
-    'uri' => '/res/ddb55dac/rsrc/css/phui/phui-form-view.css',
+    'uri' => '/res/5786628c/rsrc/css/phui/phui-form-view.css',
     'type' => 'css',
     'requires' =>
     array(
@@ -4171,7 +4171,7 @@
 ), array(
   'packages' =>
   array(
-    '2c60f04c' =>
+    'a9a10c76' =>
     array(
       'name' => 'core.pkg.css',
       'symbols' =>
@@ -4218,7 +4218,7 @@
         39 => 'phabricator-property-list-view-css',
         40 => 'phabricator-tag-view-css',
       ),
-      'uri' => '/res/pkg/2c60f04c/core.pkg.css',
+      'uri' => '/res/pkg/a9a10c76/core.pkg.css',
       'type' => 'css',
     ),
     '8977e356' =>
@@ -4409,15 +4409,15 @@
   ),
   'reverse' =>
   array(
-    'aphront-dialog-view-css' => '2c60f04c',
-    'aphront-error-view-css' => '2c60f04c',
-    'aphront-list-filter-view-css' => '2c60f04c',
-    'aphront-pager-view-css' => '2c60f04c',
-    'aphront-panel-view-css' => '2c60f04c',
-    'aphront-table-view-css' => '2c60f04c',
-    'aphront-tokenizer-control-css' => '2c60f04c',
-    'aphront-tooltip-css' => '2c60f04c',
-    'aphront-typeahead-control-css' => '2c60f04c',
+    'aphront-dialog-view-css' => 'a9a10c76',
+    'aphront-error-view-css' => 'a9a10c76',
+    'aphront-list-filter-view-css' => 'a9a10c76',
+    'aphront-pager-view-css' => 'a9a10c76',
+    'aphront-panel-view-css' => 'a9a10c76',
+    'aphront-table-view-css' => 'a9a10c76',
+    'aphront-tokenizer-control-css' => 'a9a10c76',
+    'aphront-tooltip-css' => 'a9a10c76',
+    'aphront-typeahead-control-css' => 'a9a10c76',
     'differential-changeset-view-css' => '44bfe40c',
     'differential-core-view-css' => '44bfe40c',
     'differential-inline-comment-editor' => '5e9e5c4e',
@@ -4431,7 +4431,7 @@
     'differential-table-of-contents-css' => '44bfe40c',
     'diffusion-commit-view-css' => 'c8ce2d88',
     'diffusion-icons-css' => 'c8ce2d88',
-    'global-drag-and-drop-css' => '2c60f04c',
+    'global-drag-and-drop-css' => 'a9a10c76',
     'inline-comment-summary-css' => '44bfe40c',
     'javelin-aphlict' => '8977e356',
     'javelin-behavior' => 'f32597c9',
@@ -4504,55 +4504,55 @@
     'javelin-util' => 'f32597c9',
     'javelin-vector' => 'f32597c9',
     'javelin-workflow' => 'f32597c9',
-    'lightbox-attachment-css' => '2c60f04c',
+    'lightbox-attachment-css' => 'a9a10c76',
     'maniphest-task-summary-css' => '36d5d071',
     'maniphest-transaction-detail-css' => '36d5d071',
-    'phabricator-action-list-view-css' => '2c60f04c',
-    'phabricator-application-launch-view-css' => '2c60f04c',
+    'phabricator-action-list-view-css' => 'a9a10c76',
+    'phabricator-application-launch-view-css' => 'a9a10c76',
     'phabricator-busy' => '8977e356',
     'phabricator-content-source-view-css' => '44bfe40c',
-    'phabricator-core-css' => '2c60f04c',
-    'phabricator-crumbs-view-css' => '2c60f04c',
+    'phabricator-core-css' => 'a9a10c76',
+    'phabricator-crumbs-view-css' => 'a9a10c76',
     'phabricator-drag-and-drop-file-upload' => '5e9e5c4e',
     'phabricator-dropdown-menu' => '8977e356',
     'phabricator-file-upload' => '8977e356',
-    'phabricator-filetree-view-css' => '2c60f04c',
-    'phabricator-flag-css' => '2c60f04c',
+    'phabricator-filetree-view-css' => 'a9a10c76',
+    'phabricator-flag-css' => 'a9a10c76',
     'phabricator-hovercard' => '8977e356',
-    'phabricator-jump-nav' => '2c60f04c',
+    'phabricator-jump-nav' => 'a9a10c76',
     'phabricator-keyboard-shortcut' => '8977e356',
     'phabricator-keyboard-shortcut-manager' => '8977e356',
-    'phabricator-main-menu-view' => '2c60f04c',
+    'phabricator-main-menu-view' => 'a9a10c76',
     'phabricator-menu-item' => '8977e356',
-    'phabricator-nav-view-css' => '2c60f04c',
+    'phabricator-nav-view-css' => 'a9a10c76',
     'phabricator-notification' => '8977e356',
-    'phabricator-notification-css' => '2c60f04c',
-    'phabricator-notification-menu-css' => '2c60f04c',
+    'phabricator-notification-css' => 'a9a10c76',
+    'phabricator-notification-menu-css' => 'a9a10c76',
     'phabricator-object-selector-css' => '44bfe40c',
     'phabricator-phtize' => '8977e356',
     'phabricator-prefab' => '8977e356',
     'phabricator-project-tag-css' => '36d5d071',
-    'phabricator-property-list-view-css' => '2c60f04c',
-    'phabricator-remarkup-css' => '2c60f04c',
+    'phabricator-property-list-view-css' => 'a9a10c76',
+    'phabricator-remarkup-css' => 'a9a10c76',
     'phabricator-shaped-request' => '5e9e5c4e',
-    'phabricator-side-menu-view-css' => '2c60f04c',
-    'phabricator-standard-page-view' => '2c60f04c',
-    'phabricator-tag-view-css' => '2c60f04c',
+    'phabricator-side-menu-view-css' => 'a9a10c76',
+    'phabricator-standard-page-view' => 'a9a10c76',
+    'phabricator-tag-view-css' => 'a9a10c76',
     'phabricator-textareautils' => '8977e356',
     'phabricator-tooltip' => '8977e356',
-    'phabricator-transaction-view-css' => '2c60f04c',
-    'phabricator-zindex-css' => '2c60f04c',
-    'phui-button-css' => '2c60f04c',
-    'phui-form-css' => '2c60f04c',
-    'phui-form-view-css' => '2c60f04c',
-    'phui-header-view-css' => '2c60f04c',
-    'phui-icon-view-css' => '2c60f04c',
-    'phui-object-item-list-view-css' => '2c60f04c',
-    'phui-spacing-css' => '2c60f04c',
-    'sprite-apps-large-css' => '2c60f04c',
-    'sprite-gradient-css' => '2c60f04c',
-    'sprite-icons-css' => '2c60f04c',
-    'sprite-menu-css' => '2c60f04c',
-    'syntax-highlighting-css' => '2c60f04c',
+    'phabricator-transaction-view-css' => 'a9a10c76',
+    'phabricator-zindex-css' => 'a9a10c76',
+    'phui-button-css' => 'a9a10c76',
+    'phui-form-css' => 'a9a10c76',
+    'phui-form-view-css' => 'a9a10c76',
+    'phui-header-view-css' => 'a9a10c76',
+    'phui-icon-view-css' => 'a9a10c76',
+    'phui-object-item-list-view-css' => 'a9a10c76',
+    'phui-spacing-css' => 'a9a10c76',
+    'sprite-apps-large-css' => 'a9a10c76',
+    'sprite-gradient-css' => 'a9a10c76',
+    'sprite-icons-css' => 'a9a10c76',
+    'sprite-menu-css' => 'a9a10c76',
+    'syntax-highlighting-css' => 'a9a10c76',
   ),
 ));

src/__phutil_library_map__.php

@@ -1639,6 +1639,7 @@
     'PhabricatorStandardCustomField' => 'infrastructure/customfield/standard/PhabricatorStandardCustomField.php',
     'PhabricatorStandardCustomFieldBool' => 'infrastructure/customfield/standard/PhabricatorStandardCustomFieldBool.php',
     'PhabricatorStandardCustomFieldDate' => 'infrastructure/customfield/standard/PhabricatorStandardCustomFieldDate.php',
+    'PhabricatorStandardCustomFieldHeader' => 'infrastructure/customfield/standard/PhabricatorStandardCustomFieldHeader.php',
     'PhabricatorStandardCustomFieldInt' => 'infrastructure/customfield/standard/PhabricatorStandardCustomFieldInt.php',
     'PhabricatorStandardCustomFieldInterface' => 'infrastructure/customfield/interface/PhabricatorStandardCustomFieldInterface.php',
     'PhabricatorStandardCustomFieldPHIDs' => 'infrastructure/customfield/standard/PhabricatorStandardCustomFieldPHIDs.php',
@@ -3795,6 +3796,7 @@
     'PhabricatorStandardCustomField' => 'PhabricatorCustomField',
     'PhabricatorStandardCustomFieldBool' => 'PhabricatorStandardCustomField',
     'PhabricatorStandardCustomFieldDate' => 'PhabricatorStandardCustomField',
+    'PhabricatorStandardCustomFieldHeader' => 'PhabricatorStandardCustomField',
     'PhabricatorStandardCustomFieldInt' => 'PhabricatorStandardCustomField',
     'PhabricatorStandardCustomFieldPHIDs' => 'PhabricatorStandardCustomField',
     'PhabricatorStandardCustomFieldRemarkup' => 'PhabricatorStandardCustomField',

src/infrastructure/customfield/field/PhabricatorCustomFieldList.php

@@ -100,6 +100,7 @@ public function appendFieldsToPropertyList(
       $style = $field->getStyleForPropertyView();
       switch ($style) {
         case 'property':
+        case 'header':
           $head[$key] = $field;
           break;
         case 'block':
@@ -113,12 +114,39 @@ public function appendFieldsToPropertyList(
     }
     $fields = $head + $tail;
 
+    $add_header = null;
+
     foreach ($fields as $field) {
       $label = $field->renderPropertyViewLabel();
       $value = $field->renderPropertyViewValue();
       if ($value !== null) {
         switch ($field->getStyleForPropertyView()) {
+          case 'header':
+            // We want to hide headers if the fields the're assciated with
+            // don't actually produce any visible properties. For example, in a
+            // list like this:
+            //
+            //   Header A
+            //   Prop A: Value A
+            //   Header B
+            //   Prop B: Value B
+            //
+            // ...if the "Prop A" field returns `null` when rendering its
+            // property value and we rendered naively, we'd get this:
+            //
+            //   Header A
+            //   Header B
+            //   Prop B: Value B
+            //
+            // This is silly. Instead, we hide "Header A".
+            $add_header = $value;
+            break;
           case 'property':
+            if ($add_header !== null) {
+              // Add the most recently seen header.
+              $view->addSectionHeader($add_header);
+              $add_header = null;
+            }
             $view->addProperty($label, $value);
             break;
           case 'block':

src/infrastructure/customfield/standard/PhabricatorStandardCustomFieldHeader.php

@@ -0,0 +1,33 @@
+<?php
+
+final class PhabricatorStandardCustomFieldHeader
+  extends PhabricatorStandardCustomField {
+
+  public function getFieldType() {
+    return 'header';
+  }
+
+  public function renderEditControl() {
+    $header = phutil_tag(
+      'div',
+      array(
+        'class' => 'phabricator-standard-custom-field-header',
+      ),
+      $this->getFieldName());
+    return id(new AphrontFormStaticControl())
+      ->setValue($header);
+  }
+
+  public function shouldUseStorage() {
+    return false;
+  }
+
+  public function getStyleForPropertyView() {
+    return 'header';
+  }
+
+  public function renderPropertyViewValue() {
+    return $this->getFieldName();
+  }
+
+}

webroot/rsrc/css/phui/phui-form-view.css

@@ -439,3 +439,11 @@ table.aphront-form-control-checkbox-layout th {
 .phui-form-box .aphront-error-view {
   margin-bottom: 0;
 }
+
+.phabricator-standard-custom-field-header {
+  font-size: 16px;
+  color: {$bluetext};
+  border-bottom: 1px solid {$lightbluetext};
+  padding: 16px 0 4px;
+  margin-bottom: 4px;
+}