Clean up AphrontError boxes, Diffusion Headers

Summary: Two basic changes here, first we fixed up the Diffusion headers to roll out more PHUIObjectBoxes. Second we added some specific styles for when Errors are inside an ObjectBox at the first position.

Test Plan: Tested a number of different layouts for browsing respositories as well as wherever I could find cases with PHUIObjectBox Form Errors (see images attached). Still some minor tightening due after this diff, but didnt want to overload it.

Reviewers: epriestley, btrahan

Reviewed By: epriestley

CC: Korvin, epriestley, aran

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

resources/celerity/map.php

@@ -7,7 +7,7 @@
 return array(
   'names' =>
   array(
-    'core.pkg.css' => '5ebae357',
+    'core.pkg.css' => '3c41daee',
     'core.pkg.js' => 'c907bd96',
     'darkconsole.pkg.js' => 'ca8671ce',
     'differential.pkg.css' => '827749c1',
@@ -23,7 +23,7 @@ return array(
     'rsrc/css/aphront/context-bar.css' => '1c3b0529',
     'rsrc/css/aphront/dark-console.css' => '6378ef3d',
     'rsrc/css/aphront/dialog-view.css' => 'dd9db96c',
-    'rsrc/css/aphront/error-view.css' => '3281a87d',
+    'rsrc/css/aphront/error-view.css' => '472968e0',
     'rsrc/css/aphront/lightbox-attachment.css' => '686f8885',
     'rsrc/css/aphront/list-filter-view.css' => '9577c6da',
     'rsrc/css/aphront/multi-column.css' => '05bbd016',
@@ -136,7 +136,7 @@ return array(
     'rsrc/css/phui/phui-icon.css' => '29e83226',
     'rsrc/css/phui/phui-info-panel.css' => '27ea50a1',
     'rsrc/css/phui/phui-list.css' => '2edb76cf',
-    'rsrc/css/phui/phui-object-box.css' => '90077bf8',
+    'rsrc/css/phui/phui-object-box.css' => '4f916b80',
     'rsrc/css/phui/phui-object-item-list-view.css' => 'd65c06e7',
     'rsrc/css/phui/phui-pinboard-view.css' => '53c5fca0',
     'rsrc/css/phui/phui-property-list-view.css' => '354465ae',
@@ -475,7 +475,7 @@ return array(
     'aphront-contextbar-view-css' => '1c3b0529',
     'aphront-dark-console-css' => '6378ef3d',
     'aphront-dialog-view-css' => 'dd9db96c',
-    'aphront-error-view-css' => '3281a87d',
+    'aphront-error-view-css' => '472968e0',
     'aphront-list-filter-view-css' => '9577c6da',
     'aphront-multi-column-view-css' => '05bbd016',
     'aphront-notes' => '6acadd3f',
@@ -740,7 +740,7 @@ return array(
     'phui-icon-view-css' => '29e83226',
     'phui-info-panel-css' => '27ea50a1',
     'phui-list-view-css' => '2edb76cf',
-    'phui-object-box-css' => '90077bf8',
+    'phui-object-box-css' => '4f916b80',
     'phui-object-item-list-view-css' => 'd65c06e7',
     'phui-pinboard-view-css' => '53c5fca0',
     'phui-property-list-view-css' => '354465ae',

src/applications/differential/controller/DifferentialDiffCreateController.php

@@ -84,17 +84,18 @@ final class DifferentialDiffCreateController extends DifferentialController {
 
     $form_box = id(new PHUIObjectBoxView())
       ->setHeaderText(pht('Create New Diff'))
-      ->setFormError($errors)
       ->setForm($form);
 
+    if ($errors) {
+      $error_view = id(new AphrontErrorView())
+        ->setSeverity(AphrontErrorView::SEVERITY_ERROR)
+        ->appendChild($errors);
+      $form_box->setFormError($error_view);
+    }
+
     $crumbs = $this->buildApplicationCrumbs();
     $crumbs->addTextCrumb(pht('Create Diff'));
 
-    if ($errors) {
-      $errors = id(new AphrontErrorView())
-        ->setErrors($errors);
-    }
-
     return $this->buildApplicationPage(
       array(
         $crumbs,

src/applications/diffusion/controller/DiffusionCommitController.php

@@ -247,17 +247,21 @@ final class DiffusionCommitController extends DiffusionController {
       // changes inline even if there are more than the soft limit.
       $show_all_details = $request->getBool('show_all');
 
-      $change_panel = new AphrontPanelView();
-      $change_panel->setHeader("Changes (".number_format($count).")");
+      $change_panel = new PHUIObjectBoxView();
+      $header = new PHUIHeaderView();
+      $header->setHeader("Changes (".number_format($count).")");
       $change_panel->setID('toc');
       if ($count > self::CHANGES_LIMIT && !$show_all_details) {
-        $show_all_button = phutil_tag(
-          'a',
-          array(
-            'class'   => 'button green',
-            'href'    => '?show_all=true',
-          ),
-          pht('Show All Changes'));
+
+        $icon = id(new PHUIIconView())
+          ->setSpriteSheet(PHUIIconView::SPRITE_ICONS)
+          ->setSpriteIcon('transcript');
+
+        $button = id(new PHUIButtonView())
+          ->setText(pht('Show All Changes'))
+          ->setHref('?show_all=true')
+          ->setTag('a')
+          ->setIcon($icon);
 
         $warning_view = id(new AphrontErrorView())
           ->setSeverity(AphrontErrorView::SEVERITY_WARNING)
@@ -265,12 +269,12 @@ final class DiffusionCommitController extends DiffusionController {
           ->appendChild(
             pht("This commit is very large. Load each file individually."));
 
-        $change_panel->appendChild($warning_view);
-        $change_panel->addButton($show_all_button);
+        $change_panel->setFormError($warning_view);
+        $header->addActionLink($button);
       }
 
       $change_panel->appendChild($change_table);
-      $change_panel->setNoBackground();
+      $change_panel->setHeader($header);
 
       $content[] = $change_panel;
 

src/applications/diffusion/controller/DiffusionRepositoryController.php

@@ -294,9 +294,14 @@ final class DiffusionRepositoryController extends DiffusionController {
       $header->setSubHeader(pht('Showing %d branches.', $limit));
     }
 
+    $icon = id(new PHUIIconView())
+      ->setSpriteSheet(PHUIIconView::SPRITE_ICONS)
+      ->setSpriteIcon('fork');
+
     $button = new PHUIButtonView();
     $button->setText(pht("Show All Branches"));
     $button->setTag('a');
+    $button->setIcon($icon);
     $button->setHref($drequest->generateURI(
             array(
               'action' => 'branches',
@@ -455,20 +460,26 @@ final class DiffusionRepositoryController extends DiffusionController {
     }
 
     $history_table->setIsHead(true);
-
     $callsign = $drequest->getRepository()->getCallsign();
-    $all = phutil_tag(
-      'a',
-      array(
-        'href' => $drequest->generateURI(
-          array(
-            'action' => 'history',
-          )),
-      ),
-      pht('View Full Commit History'));
+
+    $icon = id(new PHUIIconView())
+      ->setSpriteSheet(PHUIIconView::SPRITE_ICONS)
+      ->setSpriteIcon('transcript');
+
+    $button = id(new PHUIButtonView())
+      ->setText(pht('View Full History'))
+      ->setHref($drequest->generateURI(
+        array(
+          'action' => 'history',
+        )))
+      ->setTag('a')
+      ->setIcon($icon);
 
     $panel = new PHUIObjectBoxView();
-    $panel->setHeaderText(pht("Recent Commits · %s", $all));
+    $header = id(new PHUIHeaderView())
+      ->setHeader(pht('Recent Commits'))
+      ->addActionLink($button);
+    $panel->setHeader($header);
     $panel->appendChild($history_table);
 
     return $panel;
@@ -509,11 +520,21 @@ final class DiffusionRepositoryController extends DiffusionController {
     $browse_uri = $drequest->generateURI(array('action' => 'browse'));
 
     $browse_panel = new PHUIObjectBoxView();
-    $browse_panel->setHeaderText(
-      phutil_tag(
-        'a',
-        array('href' => $browse_uri),
-        pht('Browse Repository')));
+    $header = id(new PHUIHeaderView())
+      ->setHeader(pht('Repository'));
+
+    $icon = id(new PHUIIconView())
+      ->setSpriteSheet(PHUIIconView::SPRITE_ICONS)
+      ->setSpriteIcon('data');
+
+    $button = new PHUIButtonView();
+    $button->setText(pht('Browse Repository'));
+    $button->setTag('a');
+    $button->setIcon($icon);
+    $button->setHref($browse_uri);
+
+    $header->addActionLink($button);
+    $browse_panel->setHeader($header);
     $browse_panel->appendChild($browse_table);
 
     return $browse_panel;

src/view/phui/PHUIObjectBoxView.php

@@ -8,6 +8,7 @@ final class PHUIObjectBoxView extends AphrontView {
   private $validationException;
   private $header;
   private $flush;
+  private $id;
 
   private $tabs = array();
   private $propertyLists = array();
@@ -73,6 +74,11 @@ final class PHUIObjectBoxView extends AphrontView {
     return $this;
   }
 
+  public function setID($id) {
+    $this->id = $id;
+    return $this;
+  }
+
   public function setHeader(PHUIHeaderView $header) {
     $this->header = $header;
     return $this;
@@ -196,6 +202,7 @@ final class PHUIObjectBoxView extends AphrontView {
           $this->renderChildren(),
         ))
       ->setBorder(true)
+      ->setID($this->id)
       ->addMargin(PHUI::MARGIN_LARGE_TOP)
       ->addMargin(PHUI::MARGIN_LARGE_LEFT)
       ->addMargin(PHUI::MARGIN_LARGE_RIGHT)

webroot/rsrc/css/aphront/error-view.css

@@ -16,7 +16,7 @@ form.aphront-dialog-view .aphront-error-view {
   margin: 16px;
 }
 .aphront-error-view-dialogue {
-  margin: 0px 0px 16px 0px;
+  margin: 0 0 16px 0;
 }
 
 .device-phone .aphront-error-view {
@@ -33,8 +33,9 @@ form.aphront-dialog-view .aphront-error-view {
 }
 
 h1.aphront-error-view-head {
-  padding: 10px 10px 0 10px;
+  padding: 12px 8px 0 12px;
   font-weight: bold;
+  font-size: 15px;
   color: {$darkgreytext};
 }
 

webroot/rsrc/css/phui/phui-object-box.css

@@ -22,8 +22,10 @@
   padding: 8px 0;
 }
 
-.phui-object-box .aphront-error-view {
-  margin-bottom: 0;
+.phui-object-box .phui-header-shell + .aphront-error-view {
+  margin: 0;
+  border-width: 0;
+  border-bottom: 1px solid {$lightblueborder};
 }
 
 .device-phone .phui-object-box {