Display examples when editing configuratoin

Summary: Show example config values to the user when available.

Test Plan:
{F28465}
{F28466}

Reviewers: btrahan, codeblock

Reviewed By: btrahan

CC: aran

Maniphest Tasks: T2221, T2255

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

src/__celerity_resource_map__.php

@@ -725,6 +725,15 @@ celerity_register_resource_map(array(
     ),
     'disk' => '/rsrc/css/aphront/typeahead.css',
   ),
+  'config-options-css' =>
+  array(
+    'uri' => '/res/c67b0cbf/rsrc/css/application/config/config-options.css',
+    'type' => 'css',
+    'requires' =>
+    array(
+    ),
+    'disk' => '/rsrc/css/application/config/config-options.css',
+  ),
   'differential-changeset-view-css' =>
   array(
     'uri' => '/res/ea694162/rsrc/css/application/differential/changeset-view.css',

src/applications/config/controller/PhabricatorConfigEditController.php

@@ -106,7 +106,7 @@ final class PhabricatorConfigEditController
       ->addHiddenInput('issue', $request->getStr('issue'))
       ->appendChild(
         id(new AphrontFormMarkupControl())
-          ->setLabel('Description')
+          ->setLabel(pht('Description'))
           ->setValue($description))
       ->appendChild($control)
       ->appendChild(
@@ -114,6 +114,14 @@ final class PhabricatorConfigEditController
           ->addCancelButton($done_uri)
           ->setValue(pht('Save Config Entry')));
 
+    $examples = $this->renderExamples($option);
+    if ($examples) {
+      $form->appendChild(
+        id(new AphrontFormMarkupControl())
+          ->setLabel(pht('Examples'))
+          ->setValue($examples));
+    }
+
 
     // TODO: This isn't quite correct -- we should read from the entire
     // configuration stack, ignoring database configuration. For now, though,
@@ -287,4 +295,36 @@ final class PhabricatorConfigEditController
     return $control;
   }
 
+  private function renderExamples(PhabricatorConfigOption $option) {
+    $examples = $option->getExamples();
+    if (!$examples) {
+      return null;
+    }
+
+    $table = array();
+    foreach ($examples as $example) {
+      list($value, $description) = $example;
+
+      if ($value === null) {
+        $value = '<em>(empty)</em>';
+      } else {
+        $value = phutil_escape_html($value);
+      }
+
+      $table[] = '<tr>';
+      $table[] = '<th>'.$value.'</th>';
+      $table[] = '<td>'.phutil_escape_html($description).'</td>';
+      $table[] = '</tr>';
+    }
+
+    require_celerity_resource('config-options-css');
+
+    return phutil_render_tag(
+      'table',
+      array(
+        'class' => 'config-option-examples',
+      ),
+      implode("\n", $table));
+  }
+
 }

webroot/rsrc/css/application/config/config-options.css

@@ -0,0 +1,32 @@
+/**
+ * @provides config-options-css
+ */
+
+.config-option-examples {
+  width: 100%;
+  border-collapse: collapse;
+  border: 1px solid #cccccc;
+}
+
+.config-option-examples th,
+.config-option-examples td {
+  padding: 4px 6px;
+  border: 1px solid #cccccc;
+}
+
+.config-option-examples th {
+  background: #dfdfdf;
+  text-align: right;
+  font-weight: bold;
+}
+
+.config-option-examples th em {
+  font-weight: normal;
+  color: #666666;
+}
+
+.config-option-examples td {
+  color: #333333;
+}
+
+