From 02acb5e3e582560068d8c48e7331a2bd643d6515 Mon Sep 17 00:00:00 2001
From: Pete Bacon Darwin <pete@bacondarwin.com>
Date: Sat, 12 May 2018 13:30:19 +0100
Subject: [PATCH] build(aio): improve `enum` API rendering (#23872)

* The member details section is now called "Members", rather
than "Properties".
* The property table now displays appropriate table headings:
"Member", "Value", "Description".
* The "Value" column is not shown if none of the members have
a value.

Closes #22678

PR Close #23872
---
 .../rendering/hasValues.js                    |  9 +++++++++
 .../rendering/hasValues.spec.js               | 19 +++++++++++++++++++
 .../templates/api/enum.template.html          | 15 ++++++++++++++-
 .../templates/api/lib/memberHelpers.html      | 11 ++++++++---
 4 files changed, 50 insertions(+), 4 deletions(-)
 create mode 100644 aio/tools/transforms/angular-base-package/rendering/hasValues.js
 create mode 100644 aio/tools/transforms/angular-base-package/rendering/hasValues.spec.js

diff --git a/aio/tools/transforms/angular-base-package/rendering/hasValues.js b/aio/tools/transforms/angular-base-package/rendering/hasValues.js
new file mode 100644
index 0000000000..7b15501fa2
--- /dev/null
+++ b/aio/tools/transforms/angular-base-package/rendering/hasValues.js
@@ -0,0 +1,9 @@
+module.exports = function hasValues() {
+  return {
+    name: 'hasValues',
+    process: function(list, property) {
+      if (!list || !Array.isArray(list)) return false;
+      return list.some(item => item[property]);
+    }
+  };
+};
\ No newline at end of file
diff --git a/aio/tools/transforms/angular-base-package/rendering/hasValues.spec.js b/aio/tools/transforms/angular-base-package/rendering/hasValues.spec.js
new file mode 100644
index 0000000000..7f22c93e9d
--- /dev/null
+++ b/aio/tools/transforms/angular-base-package/rendering/hasValues.spec.js
@@ -0,0 +1,19 @@
+const factory = require('./hasValues');
+
+describe('hasValues filter', () => {
+  let filter;
+
+  beforeEach(function() { filter = factory(); });
+
+  it('should be called "hasValues"', function() { expect(filter.name).toEqual('hasValues'); });
+
+  it('should return true if the specified property is truthy on any item in the list', function() {
+    expect(filter.process([], 'a')).toEqual(false);
+    expect(filter.process(0), 'a').toEqual(false);
+    expect(filter.process({}, 'a')).toEqual(false);
+    expect(filter.process([{a: 1}], 'a')).toEqual(true);
+    expect(filter.process([{b: 2}], 'a')).toEqual(false);
+    expect(filter.process([{a: 1, b: 2}], 'a')).toEqual(true);
+    expect(filter.process([{b: 2}, {a: 1}], 'a')).toEqual(true);
+  });
+});
\ No newline at end of file
diff --git a/aio/tools/transforms/templates/api/enum.template.html b/aio/tools/transforms/templates/api/enum.template.html
index 9c59159b29..0f07f88cbc 100644
--- a/aio/tools/transforms/templates/api/enum.template.html
+++ b/aio/tools/transforms/templates/api/enum.template.html
@@ -1 +1,14 @@
-{% extends 'class.template.html' -%}
\ No newline at end of file
+{% import "lib/memberHelpers.html" as memberHelpers -%}
+{% extends 'export-base.template.html' -%}
+
+{% block details %}
+<section class="enum-overview">
+<code-example language="ts" hideCopy="true">
+enum {$ doc.name $} {{$ memberHelpers.renderMembers(doc) $}
+}
+</code-example>
+</section>
+
+{% include "includes/description.html" %}
+{$ memberHelpers.renderProperties(doc.properties, 'members', 'member', 'Members', ['Member', 'Value']) $}
+{% endblock %}
\ No newline at end of file
diff --git a/aio/tools/transforms/templates/api/lib/memberHelpers.html b/aio/tools/transforms/templates/api/lib/memberHelpers.html
index c278c3c3fc..2fdfb3b6e4 100644
--- a/aio/tools/transforms/templates/api/lib/memberHelpers.html
+++ b/aio/tools/transforms/templates/api/lib/memberHelpers.html
@@ -135,20 +135,25 @@
 {%- endmacro -%}
 
 
-{%- macro renderProperties(properties, containerClass, propertyClass, headingText) -%}
+{%- macro renderProperties(properties, containerClass, propertyClass, headingText, headings) -%}
 {% set nonInternalProperties = properties | filterByPropertyValue('internal', undefined) %}
+{% set hasTypes = properties | hasValues('type') %}
 {% if nonInternalProperties.length -%}
 <section class="{$ containerClass $}">
   <h2>{$ headingText $}</h2>
   <table class="is-full-width list-table properties-table">
     <thead>
-      <tr><th>Property</th><th>Type</th><th>Description</th></tr>
+      <tr>
+        <th>{$ headings[0] or 'Property' $}</th>
+        {% if hasTypes %}<th>{$ headings[1] or 'Type' $}</th>{% endif %}
+        <th>{$ headings[2] or 'Description' $}</th>
+      </tr>
     </thead>
     <tbody>
     {% for property in nonInternalProperties %}
       <tr class="{$ propertyClass $}">
         <td><a id="{$ property.anchor $}"></a>{$ property.name $}</td>
-        <td><label class="property-type-label"><code>{$ property.type | escape $}</code></label></td>
+        {% if hasTypes %}<td><label class="property-type-label"><code>{$ property.type | escape $}</code></label></td>{% endif %}
         <td>
           {%- if (property.isGetAccessor or property.isReadonly) and not property.isSetAccessor %}<span class='read-only-property'>Read-only.</span>{% endif %}
           {% if property.shortDescription %}{$ property.shortDescription | marked $}{% endif %}