Empty states for servers

ui/app/templates/servers.hbs

@@ -1,6 +1,6 @@
 <div class="page-layout">
   {{#global-header class="page-header"}}
-    Nodes
+    Servers
   {{/global-header}}
   {{#gutter-menu class="page-body"}}
     <section class="section">
@@ -35,6 +35,17 @@
             <ul class="pagination-list"></ul>
           </nav>
         </div>
+      {{else}}
+        <div class="empty-message">
+          <h3 class="empty-message-headline">Invalid Permissions</h3>
+          <p class="empty-message-body">
+            {{#if token.secret}}
+              Your ACL token does not grant access to see servers.
+            {{else}}
+              You have no ACL token set. {{#link-to "settings.tokens"}}Provide a token{{/link-to}} with the appropriate permissions to see servers.
+            {{/if}}
+          </p>
+        </div>
       {{/list-pagination}}
       {{outlet}}
     </section>

ui/tests/acceptance/nodes-list-test.js

@@ -170,3 +170,24 @@ test('each server should link to the server detail page', function(assert) {
     assert.equal(currentURL(), `/servers/${agent.name}`);
   });
 });
+
+test('when the API returns no agents, show an empty message', function(assert) {
+  minimumSetup();
+
+  // Override the members handler to act as if server-side permissions
+  // are preventing a qualified response.
+  server.pretender.get('/v1/agent/members', () => [
+    200,
+    {},
+    JSON.stringify({
+      Members: [],
+    }),
+  ]);
+
+  visit('/servers');
+
+  andThen(() => {
+    assert.ok(find('.empty-message'));
+    assert.equal(find('.empty-message-headline').textContent, 'Invalid Permissions');
+  });
+});