MD History: add sign in promo in synced tabs when user isn't logged in

chrome/browser/resources/md_history/synced_device_manager.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.
 
 /**
  * @typedef {{device: string,
  *           lastUpdateTime: string,
  *           separatorIndexes: !Array<number>,
  *           timestamp: number,
  *           tabs: !Array<!ForeignSessionTab>,
@@ skipping 18 matching lines @@
       observer: 'searchTermChanged'
     },
 
     /**
      * An array of synced devices with synced tab data.
      * @type {!Array<!ForeignDeviceInternal>}
      */
     syncedDevices_: {
       type: Array,
       value: function() { return []; }
+    },
+
+    signInState_: {
+      type: Boolean,
+      value: loadTimeData.getBoolean('isUserSignedIn'),
+    },
+
+    fetchingSyncedTabs_: {
+      type: Boolean,
+      value: false,
     }
   },
 
   /**
    * @param {!ForeignSession} session
    * @return {!ForeignDeviceInternal}
    */
   createInternalDevice_: function(session) {
     var tabs = [];
     var separatorIndexes = [];
@@ skipping 25 matching lines @@
     return {
       device: session.name,
       lastUpdateTime: '– ' + session.modifiedTime,
       separatorIndexes: separatorIndexes,
       timestamp: session.timestamp,
       tabs: tabs,
       tag: session.tag,
     };
   },
 
+
+  onSignInTap_: function() {
+    chrome.send('SyncSetupShowSetupUI');
+    chrome.send('SyncSetupStartSignIn', [false]);
+  },
+
+  clearDisplayedSyncedDevices: function() {
+    this.syncedDevices_ = [];
+  },
+
+  /**
+   * Decide whether or not should display no synced tabs message.
+   * @param {boolean} signInState
+   * @param {number} syncedDevicesLength

[tsergeant, 2016/06/21 04:33:51]

Add an @return

[lshang, 2016/06/21 05:40:00]

Done.

+   */
+  showNoSyncedMessage: function(signInState, syncedDevicesLength) {
+    return signInState && syncedDevicesLength == 0;
+  },
+
+  /**
+   * Decide what message should be diaplayed when user is logged in and there is

[tsergeant, 2016/06/21 04:33:51]

Minor nit: typo in "displayed"

also, 

"there are no synced tabs"

[lshang, 2016/06/21 05:40:00]

Done.

+   * no synced tabs.
+   * @param {boolean} fetchingSyncedTabs

[tsergeant, 2016/06/21 04:33:51]

Add an @return as well

[lshang, 2016/06/21 05:40:00]

Done.

+   */
+  noSyncedTabsMessage: function(fetchingSyncedTabs) {
+    return loadTimeData.getString(
+        fetchingSyncedTabs ? 'loading' : 'noSyncedResults');
+  },
+
   /**
    * Replaces the currently displayed synced tabs with |sessionList|. It is
    * common for only a single session within the list to have changed, We try to
    * avoid doing extra work in this case. The logic could be more intelligent
    * about updating individual tabs rather than replacing whole sessions, but
    * this approach seems to have acceptable performance.
    * @param {?Array<!ForeignSession>} sessionList
    */
   updateSyncedDevices: function(sessionList) {
-    if (!sessionList)
+    if (!sessionList) {
+      this.fetchingSyncedTabs_ = false;

[tsergeant, 2016/06/21 04:33:51]

Just put this once at the very start of the method. Then you'll be able to
remove the duplicate line below.

[lshang, 2016/06/21 05:40:00]

Done.

       return;
+    }
 
     // First, update any existing devices that have changed.
     var updateCount = Math.min(sessionList.length, this.syncedDevices_.length);
     for (var i = 0; i < updateCount; i++) {
       var oldDevice = this.syncedDevices_[i];
       if (oldDevice.tag != sessionList[i].tag ||
           oldDevice.timestamp != sessionList[i].timestamp) {
         this.splice(
             'syncedDevices_', i, 1, this.createInternalDevice_(sessionList[i]));
       }
     }
 
     // Then, append any new devices.
     for (var i = updateCount; i < sessionList.length; i++) {
       this.push('syncedDevices_', this.createInternalDevice_(sessionList[i]));
     }
+
+    this.fetchingSyncedTabs_ = false;
+  },
+
+  /**
+   * Get called when user's sign in state changes, this will affect UI of synced
+   * tabs page. Sign in promo gets displayed when user is signed out, and
+   * different messages are shown when there is no synced tabs.
+   * @param {boolean} isUserSignedIn
+   */
+  updateSignInState: function(isUserSignedIn) {
+    // If user's sign in state didn't change, then don't change message or
+    // update UI.
+    if (this.signInState_ == isUserSignedIn)
+      return;
+    this.signInState_ = isUserSignedIn;
+
+    // User signed out, clear synced device list and show the sign in promo.
+    if (!isUserSignedIn) {
+      this.clearDisplayedSyncedDevices();
+    } else {
+      // User signed in, show the loading message when querying for synced
+      // devices.
+      this.fetchingSyncedTabs_ = true;
+    }
   },
 
   searchTermChanged: function(searchedTerm) {
-    this.syncedDevices_ = [];
+    this.clearDisplayedSyncedDevices();
     this.updateSyncedDevices(this.sessionList);
   }
 });