From ddd7cbb698cf63602c8a74f1fc1e5450e8a7d0c3 Mon Sep 17 00:00:00 2001
From: Chad Little <chad@phacility.com>
Date: Sun, 30 Jul 2017 12:21:36 -0700
Subject: [PATCH] Add setImage to PHUIActionPanelView

Summary: Additonal option to use newly made images in these views.

Test Plan:
Built an example in UIExamples.

{F5071682}

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: Korvin

Differential Revision: https://secure.phabricator.com/D18299
---
 resources/celerity/map.php                    |  4 ++--
 .../examples/PHUIActionPanelExample.php       |  7 ++++++-
 src/view/phui/PHUIActionPanelView.php         | 21 +++++++++++++++++++
 webroot/rsrc/css/phui/phui-action-panel.css   |  6 ++++++
 4 files changed, 35 insertions(+), 3 deletions(-)

diff --git a/resources/celerity/map.php b/resources/celerity/map.php
index 88f2db1eec..2437a1e4c2 100644
--- a/resources/celerity/map.php
+++ b/resources/celerity/map.php
@@ -139,7 +139,7 @@ return array(
     'rsrc/css/phui/object-item/phui-oi-list-view.css' => 'bf094950',
     'rsrc/css/phui/object-item/phui-oi-simple-ui.css' => 'a8beebea',
     'rsrc/css/phui/phui-action-list.css' => '6ee16164',
-    'rsrc/css/phui/phui-action-panel.css' => '91c7b835',
+    'rsrc/css/phui/phui-action-panel.css' => 'b4798122',
     'rsrc/css/phui/phui-badge.css' => '22c0cf4f',
     'rsrc/css/phui/phui-basic-nav-view.css' => 'a0705f53',
     'rsrc/css/phui/phui-big-info-view.css' => 'd13afcde',
@@ -818,7 +818,7 @@ return array(
     'phortune-invoice-css' => '476055e2',
     'phrequent-css' => 'ffc185ad',
     'phriction-document-css' => '4282e4ad',
-    'phui-action-panel-css' => '91c7b835',
+    'phui-action-panel-css' => 'b4798122',
     'phui-badge-view-css' => '22c0cf4f',
     'phui-basic-nav-view-css' => 'a0705f53',
     'phui-big-info-view-css' => 'd13afcde',
diff --git a/src/applications/uiexample/examples/PHUIActionPanelExample.php b/src/applications/uiexample/examples/PHUIActionPanelExample.php
index 9294dcbea6..e71f2ce846 100644
--- a/src/applications/uiexample/examples/PHUIActionPanelExample.php
+++ b/src/applications/uiexample/examples/PHUIActionPanelExample.php
@@ -11,10 +11,15 @@ final class PHUIActionPanelExample extends PhabricatorUIExample {
   }
 
   public function renderExample() {
+    $viewer = $this->getRequest()->getUser();
 
     $view = id(new AphrontMultiColumnView())
       ->setFluidLayout(true);
 
+    $credit = PhabricatorFile::loadBuiltin(
+      $viewer, 'projects/v3/creditcard.png');
+    $image = $credit->getBestURI();
+
     /* Action Panels */
     $panel1 = id(new PHUIActionPanelView())
       ->setIcon('fa-book')
@@ -53,7 +58,7 @@ final class PHUIActionPanelExample extends PhabricatorUIExample {
 
     /* Action Panels */
     $panel1 = id(new PHUIActionPanelView())
-      ->setIcon('fa-credit-card')
+      ->setImage($image)
       ->setHeader(pht('Account Balance'))
       ->setHref('#')
       ->setSubHeader(pht('You were last billed $2,245.12 on Dec 12, 2014.'))
diff --git a/src/view/phui/PHUIActionPanelView.php b/src/view/phui/PHUIActionPanelView.php
index f5f74b2807..8ced0a642b 100644
--- a/src/view/phui/PHUIActionPanelView.php
+++ b/src/view/phui/PHUIActionPanelView.php
@@ -4,6 +4,7 @@ final class PHUIActionPanelView extends AphrontTagView {
 
   private $href;
   private $fontIcon;
+  private $image;
   private $header;
   private $subHeader;
   private $bigText;
@@ -29,6 +30,11 @@ final class PHUIActionPanelView extends AphrontTagView {
     return $this;
   }
 
+  public function setImage($image) {
+    $this->image = $image;
+    return $this;
+  }
+
   public function setBigText($text) {
     $this->bigText = $text;
     return $this;
@@ -89,6 +95,21 @@ final class PHUIActionPanelView extends AphrontTagView {
         $fonticon);
     }
 
+    if ($this->image) {
+      $image = phutil_tag(
+        'img',
+        array(
+          'class' => 'phui-action-panel-image',
+          'src' => $this->image,
+        ));
+      $icon = phutil_tag(
+        'span',
+        array(
+          'class' => 'phui-action-panel-icon',
+        ),
+        $image);
+    }
+
     $header = null;
     if ($this->header) {
       $header = phutil_tag(
diff --git a/webroot/rsrc/css/phui/phui-action-panel.css b/webroot/rsrc/css/phui/phui-action-panel.css
index d52a1cbaae..63bd351807 100644
--- a/webroot/rsrc/css/phui/phui-action-panel.css
+++ b/webroot/rsrc/css/phui/phui-action-panel.css
@@ -47,6 +47,12 @@
   display: table-cell;
 }
 
+.phui-action-panel-image {
+  width: 48px;
+  height: 48px;
+  margin: 0 auto;
+}
+
 .phui-action-panel-icon a {
   display: block;
 }