MD Bookmarks: Integrate new data store with UI elements

chrome/browser/resources/md_bookmarks/list.js

Index: chrome/browser/resources/md_bookmarks/list.js
diff --git a/chrome/browser/resources/md_bookmarks/list.js b/chrome/browser/resources/md_bookmarks/list.js
index 5d16af2d6a3883135262bbe9193dcf7b73b23c02..2c183e930875fb8b9105f0be772ab01dd48d0fb6 100644
--- a/chrome/browser/resources/md_bookmarks/list.js
+++ b/chrome/browser/resources/md_bookmarks/list.js
@@ -5,12 +5,21 @@
 Polymer({
   is: 'bookmarks-list',
 
+  behaviors: [
+    bookmarks.StoreClient,
+  ],
+
   properties: {
-    /** @type {BookmarkTreeNode} */
+    /** @type {BookmarkNode} */
     menuItem_: Object,
 
-    /** @type {Array<BookmarkTreeNode>} */
-    displayedList: Array,
+    /** @type {Array<string>} */
+    displayedList: {
+      type: Array,
+      value: function() {
+        return [];

[calamity, 2017/03/09 04:58:57]

Why is this necessary?

[tsergeant, 2017/03/09 06:27:54]

This is a little fix to prevent the flash of an empty card during startup.

Without it, displayedList is undefined during initialization and so the logic to
hide the list doesn't trigger:
    hidden$="[[isEmptyList_(displayedList.length)]]"

I've added a comment to the code to explain this.

[calamity, 2017/03/10 03:34:21]

Ah yeah, I thought it might be. Good riddance. I'm so sick of that flash.

+      },
+    },
 
     searchTerm: String,
   },
@@ -19,6 +28,13 @@ Polymer({
     'open-item-menu': 'onOpenItemMenu_',
   },
 
+  attached: function() {
+    this.watch('displayedList', function(state) {
+      return bookmarks.util.getDisplayedList(state);
+    });
+    this.updateFromStore();
+  },
+
   /**
    * @param {Event} e
    * @private