MD Bookmarks: Integrate new data store with UI elements

chrome/browser/resources/md_bookmarks/list.js

 // Copyright 2016 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 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,
   },
 
   listeners: {
     'open-item-menu': 'onOpenItemMenu_',
   },
 
+  attached: function() {
+    this.watch('displayedList', function(state) {
+      return bookmarks.util.getDisplayedList(state);
+    });
+    this.updateFromStore();
+  },
+
   /**
    * @param {Event} e
    * @private
    */
   onOpenItemMenu_: function(e) {
     this.menuItem_ = e.detail.item;
     var menu = /** @type {!CrActionMenuElement} */ (
         this.$.dropdown);
     menu.showAt(/** @type {!Element} */ (e.detail.target));
   },
@@ skipping 65 matching lines @@
   emptyListMessage_: function() {
     var emptyListMessage = this.searchTerm ? 'noSearchResults' : 'emptyList';
     return loadTimeData.getString(emptyListMessage);
   },
 
   /** @private */
   isEmptyList_: function() {
     return this.displayedList.length == 0;
   },
 });