bluetooth: Add service list to DeviceDetailsPage in internals page.

chrome/browser/resources/bluetooth_internals/device_details_page.js

Index: chrome/browser/resources/bluetooth_internals/device_details_page.js
diff --git a/chrome/browser/resources/bluetooth_internals/device_details_page.js b/chrome/browser/resources/bluetooth_internals/device_details_page.js
index c50f65771fe0a40d81e9da428287a5aead87de62..6112bf011f7e995996efe0ce5fe0e1aa178dee14 100644
--- a/chrome/browser/resources/bluetooth_internals/device_details_page.js
+++ b/chrome/browser/resources/bluetooth_internals/device_details_page.js
@@ -9,6 +9,7 @@
  */
 
 cr.define('device_details_page', function() {
+  /** @const */ var ArrayDataModel = cr.ui.ArrayDataModel;
   /** @const */ var Page = cr.ui.pageManager.Page;
   /** @const */ var Snackbar = snackbar.Snackbar;
   /** @const */ var SnackbarType = snackbar.SnackbarType;
@@ -42,13 +43,17 @@ cr.define('device_details_page', function() {
     /** @type {interfaces.BluetoothDevice.DeviceInfo} */
     this.deviceInfo = deviceInfo;
 
-    /** @type {interfaces.BluetoothDevice.Device.ptrClass} */
+    /** @type {?interfaces.BluetoothDevice.Device.ptrClass} */
     this.devicePtr = null;
 
     /** @type {!object_fieldset.ObjectFieldSet} */
     this.deviceFieldSet = new object_fieldset.ObjectFieldSet();
     this.deviceFieldSet.setPropertyDisplayNames(PROPERTY_NAMES);
 
+    /** @type {!service_list.ServiceList} */
+    this.serviceList = new service_list.ServiceList();
+    this.serviceList.setLoading(true);
+
     /** @private {!device_collection.ConnectionStatus} */
     this.status_ = device_collection.ConnectionStatus.DISCONNECTED;
 
@@ -61,6 +66,7 @@ cr.define('device_details_page', function() {
 
     this.pageDiv.querySelector('.device-details').appendChild(
         this.deviceFieldSet);
+    this.pageDiv.querySelector('.services').appendChild(this.serviceList);
 
     this.pageDiv.querySelector('.forget').addEventListener(
         'click', function() {
@@ -102,7 +108,10 @@ cr.define('device_details_page', function() {
         // Fetch services asynchronously.
         return this.devicePtr.getServices();
       }.bind(this)).then(function(response) {
-        this.deviceInfo.services = response.services;
+        this.serviceList.setData(new ArrayDataModel(response.services));
+        this.deviceInfo.services = this.serviceList.dataModel;
+        this.serviceList.setLoading(false);
+
         this.redraw();
         this.fireDeviceInfoChanged_();
       }.bind(this)).catch(function(error) {
@@ -160,6 +169,7 @@ cr.define('device_details_page', function() {
       };
 
       this.deviceFieldSet.setObject(deviceViewObj);
+      this.serviceList.redraw();
     },
 
     /**