hide models from sidebar and dim in DAG

src/app/docs/model.html

@@ -19,6 +19,12 @@
  <div class="app-links app-sticky">
  <div class="app-title">
  <div class="app-frame app-pad app-flush-bottom">
+ <h1 ng-if="model.docs.show === false">
+ <small class='text-bold text-right'>
+ <i data-icon="eye"></i>
+ This model is hidden
+ </small>
+ </h1>
  <h1>
  <span class="break">{{ model.name }}</span>
  <small>{{ model.config.materialized }}</small>

src/app/docs/seed.html

@@ -19,6 +19,12 @@
  <div class="app-links app-sticky">
  <div class="app-title">
  <div class="app-frame app-pad app-flush-bottom">
+ <h1 ng-if="model.docs.show === false">
+ <small class='text-bold text-right'>
+ <i data-icon="eye"></i>
+ This {{ model.resource_type }} is hidden
+ </small>
+ </h1>
  <h1>
  <span class="break">{{ model.name }}</span>
  <small>{{ model.config.materialized }}</small>

src/app/docs/snapshot.html

@@ -19,6 +19,12 @@
  <div class="app-links app-sticky">
  <div class="app-title">
  <div class="app-frame app-pad app-flush-bottom">
+ <h1 ng-if="model.docs.show === false">
+ <small class='text-bold text-right'>
+ <i data-icon="eye"></i>
+ This {{ model.resource_type }} is hidden
+ </small>
+ </h1>
  <h1>
  <span class="break">{{ model.name }}</span>
  <small>{{ model.config.materialized }}</small>

src/app/services/graph.service.js

@@ -195,7 +195,14 @@ angular
  style: {
  'background-color': '#919599',
  }
- }
+ },
+ {
+ selector: 'node[hidden=1]',
+ style: {
+ 'background-color': '#919599',
+ 'background-opacity': 0.5,
+ }
+ },
  ],
  ready: function(e) {
  console.log("graph ready");
@@ -269,6 +276,7 @@ angular
  _.each(service.graph.elements, function(el) {
  el.data['display'] = 'none';
  el.data['selected'] = 0;
+ el.data['hidden'] = 0;
  el.classes = classes;
  });
 
@@ -279,6 +287,10 @@ angular
  if (highlight && _.includes(highlight, el.data.unique_id)) {
  el.data['selected'] = 1;
  }
+
+ if (el.data.docs && el.data.docs.show === false) {
+ el.data['hidden'] = 1;
+ }
  });
  service.graph.elements = _.filter(elements, function(e) { return e.data.display == 'element'});
 

src/app/services/project_service.js

@@ -1,7 +1,6 @@
 
 const angular = require('angular');
 const $ = require('jquery');
-const _ = require('underscore');
 
 import merge from 'deepmerge';
 
@@ -476,9 +475,12 @@ angular
  var macros = macros || [];
 
  _.each(nodes.concat(macros), function(node) {
+ var show = _.get(node, ['docs', 'show'], true);
  if (node.resource_type == 'source') {
  // no sources in the model tree, sorry
  return;
+ } else if (!show) {
+ return;
  }
 
  if (node.original_file_path.indexOf("\\") != -1) {
@@ -530,7 +532,10 @@ angular
 
  var databases = {};
  var tree_nodes = _.select(nodes, function(node) {
- if (_.indexOf(['source', 'snapshot', 'seed'], node.resource_type) != -1) {
+ var show = _.get(node, ['docs', 'show'], true);
+ if (!show) { 
+ return false;
+ } else if (_.indexOf(['source', 'snapshot', 'seed'], node.resource_type) != -1) {
  return true;
  } else if (node.resource_type == 'model') {
  return node.config.materialized != 'ephemeral';