INT-556 - "Zero state" guidance message

src/home/index.jade

@@ -1,4 +1,7 @@
 .page
   .content.with-sidebar
     div(data-hook='collection-subview')
+    div.report-zero-state(data-hook='report-zero-state')
+      img(src='images/zero-state-arrow-collections.png', width="110")
+      span Choose a collection to analyze
   div(data-hook='sidebar')

src/home/index.js

@@ -15,6 +15,17 @@ var HomeView = View.extend({
       type: 'string',
       allowNull: true,
       default: null
+    },
+    showZeroState: {
+      type: 'boolean',
+      default: true
+    }
+  },
+  bindings: {
+    showZeroState: {
+      hook: 'report-zero-state',
+      type: 'booleanClass',
+      no: 'hidden'
     }
   },
   initialize: function() {
@@ -46,6 +57,7 @@ var HomeView = View.extend({
 
     this.ns = model.getId();
     this.updateTitle(model);
+    this.showZeroState = false;
     app.navigate(format('schema/%s', model.getId()), {
       silent: true
     });

src/home/index.less

@@ -52,6 +52,20 @@
   border-bottom: @caret-width-base solid transparent;
 }
 
+.report-zero-state {
+  margin: 124px 0 0 20px;
+
+  img {
+    margin-bottom: 7px;
+  }
+  span {
+    font-size: 24px;
+    color: @gray4;
+    font-weight: 200;
+    margin-left: 15px;
+  }
+}
+
 .collection-view {
   header {
     padding: 12px 20px;