--WIP-- add faves/starred things to /welcome

caravel/assets/javascripts/welcome.js

@@ -1,3 +1,7 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+import FavesTable from './welcome/components/FavesTable.jsx';
+
 const $ = window.$ = require('jquery');
 /* eslint no-unused-vars: 0 */
 const jQuery = window.jQuery = $;
@@ -36,6 +40,7 @@ function modelViewTable(selector, modelView, orderCol, order) {
     });
     // Hack to move the searchbox in the right spot
     const search = panel.find('.dataTables_filter input');
+    search.attr('placeholder', 'Start typing to filter dashboards');
     search.addClass('form-control').detach();
     search.appendTo(panel.find('.search'));
     panel.find('.dataTables_filter').remove();
@@ -48,6 +53,21 @@ function modelViewTable(selector, modelView, orderCol, order) {
     $('[data-toggle="tooltip"]').tooltip({ container: 'body' });
   });
 }
+
+function renderFaveTable() {
+  const favesEl = document.getElementById('js-faves-table');
+  $.get('/caravel/fav_dashboards_list/', function(data) {
+    console.log('data', data);
+  });
+  ReactDOM.render(
+    <FavesTable
+      faves={[]}
+    />,
+    favesEl
+  );
+}
+
 $(document).ready(function () {
   modelViewTable('#dash_table', 'DashboardModelViewAsync', 'changed_on', 'desc');
+  renderFaveTable();
 });

caravel/assets/javascripts/welcome/components/FavesTable.jsx

@@ -0,0 +1,34 @@
+import React, { PropTypes } from 'react';
+
+const propTypes = {
+  faves: PropTypes.array.isRequired,
+};
+
+export default function FavesTable ({ faves }) {
+  const rows = faves.map((fave) => {
+    const url = `/caravel/${fave.class_name}/${fave.obj_id}`;
+    return (
+      <tr key={fave.class_name + fave.obj_id}>
+        <td><a href={url}>{fave.class_name} {fave.obj_id}</a></td>
+      </tr>
+    );
+  });
+  const hasFaves = faves.length > 0;
+
+  return (
+    <div>
+      <table className="table" style={{display: 'table', width: '100%'}}>
+        <tbody>
+          {!hasFaves &&
+            <tr>
+              <td>You don't have any favorites yet.</td>
+            </tr>
+          }
+          {rows}
+        </tbody>
+      </table>
+    </div>
+  );
+}
+
+FavesTable.propTypes = propTypes;

caravel/assets/stylesheets/welcome.css

@@ -25,7 +25,10 @@ input {
   background-color: #fff;
 }
 .search input {
-  width: 400px;
+  width: 200px;
+}
+.search-container {
+  margin-top: -16px;
 }
 .search-container .fa-search {
   float: left;

caravel/models.py

@@ -1918,6 +1918,13 @@ class FavStar(Model):
     obj_id = Column(Integer)
     dttm = Column(DateTime, default=func.now())
 
+    def serialize(self):
+        return {
+            'user_id': self.user_id,
+            'class_name': self.class_name,
+            'obj_id': self.obj_id
+        }
+
 
 class QueryStatus:
     CANCELLED = 'cancelled'

caravel/templates/caravel/welcome.html

@@ -10,28 +10,42 @@
 {% block title %}{{ _("Welcome!") }}{% endblock %}
 
 {% block body %}
-<div class="container welcome">
+<div class="container-fluid">
   {% include 'caravel/flash_wrapper.html' %}
-  <div class="panel panel-default">
-    <div class="panel-heading">
-      <div class="panel-title">
-        <div class="row">
-          <div class="col-md-6">
-            <h2>{{ _("Dashboards") }}</h2>
-          </div>
-          <div class="col-md-6">
-            <div class="search-container pull-right">
-              <i class="fa fa-search"></i>
-              <span class="search"></span>
+  <div class="row">
+    <div class="col-md-6">
+      <div class="panel panel-default">
+        <div class="panel-heading">
+          <div class="panel-title">Your Favorites</div>
+        </div>
+        <div class="panel-body">
+          <div id="js-faves-table"></div>
+        </div>
+      </div>
+    </div>
+    <div class="col-md-6">
+      <div class="panel panel-default">
+        <div class="panel-heading">
+          <div class="panel-title">
+            <div class="row">
+              <div class="col-md-4">
+                {{ _("All Dashboards") }}
+              </div>
+              <div class="col-md-8">
+                <div class="search-container pull-right">
+                  <i class="fa fa-search"></i>
+                  <span class="search"></span>
+                </div>
+              </div>
             </div>
           </div>
         </div>
+        <div class="panel-body">
+          <img class="loading" src="/static/assets/images/loading.gif"/>
+          <table id="dash_table" class="table" width="100%"></table>
+        </div>
       </div>
     </div>
-    <div class="panel-body">
-      <img class="loading" src="/static/assets/images/loading.gif"/>
-      <table id="dash_table" class="table" width="100%"></table>
-    </div>
   </div>
 </div>
 {% endblock %}

caravel/views.py

@@ -16,7 +16,7 @@
 import sqlalchemy as sqla
 
 from flask import (
-    g, request, redirect, flash, Response, render_template, Markup)
+    g, request, redirect, flash, Response, render_template, Markup, jsonify)
 from flask_appbuilder import ModelView, CompactCRUDMixin, BaseView, expose
 from flask_appbuilder.actions import action
 from flask_appbuilder.models.sqla.interface import SQLAInterface
@@ -1337,6 +1337,35 @@ def warm_up_cache(self):
             status=200,
             mimetype="application/json")
 
+    @api
+    @has_access_api
+    @expose("/fav_dashboards_list/",  methods=["GET"])
+    def fav_dashboards_list(self):
+        session = db.session()
+        FavStar = models.FavStar  # noqa
+        faves = session.query(FavStar).filter_by(user_id=g.user.get_id()).all()
+
+        # for f in faves:
+        #     return f.serialize()
+
+        # for f in faves:
+        #     if f.class_name == "Dashboard":
+        #         dashboard = session.query(Dashboard).filter_by(id=f.obj_id).first()
+        #         f.dashboard_title = dashboard.dashboard_title
+        #         f.description = dashboard.description
+
+        # json.dumps(
+        #     [{"slice_id": session.id, "slice_name": session.slice_name}
+        #     for session in slices])
+
+        session.close()
+
+        return Response(
+            jsonify({"faves": faves}),
+            status=200,
+            mimetype="application/json")
+
+
     @expose("/favstar/<class_name>/<obj_id>/<action>/")
     def favstar(self, class_name, obj_id, action):
         session = db.session()
@@ -1754,7 +1783,10 @@ def show_traceback(self):
     @expose("/welcome")
     def welcome(self):
         """Personalized welcome page"""
-        return self.render_template('caravel/welcome.html', utils=utils)
+
+        return self.render_template(
+            'caravel/welcome.html',
+            utils=utils)
 
     @has_access
     @expose("/sqllab")