[Fast Pair] Add forget bluetooth device dialog

Add a dialog for the user to confirm that they want to forget a bluetooth device. Change-Id: I4a42514a56ae7616fa7e8513979cff629b1c2844 Fixed: b/238808809 Tested: Manually tested and updated unit tests Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/3756863 Reviewed-by: Jimmy Gong <jimmyxgong@chromium.org> Reviewed-by: Juliet Lévesque <julietlevesque@google.com> Commit-Queue: Alex Kingsborough <akingsb@google.com> Cr-Commit-Position: refs/heads/main@{#1028576}
chromium · Jul 27, 2022 · 8d58a31 · 8d58a31
1 parent 2c9c30a
commit 8d58a31
Show file tree

Hide file tree

Showing 14 changed files with 189 additions and 11 deletions.
diff --git a/chrome/app/os_settings_strings.grdp b/chrome/app/os_settings_strings.grdp
@@ -2261,6 +2261,18 @@ Press an assigned switch or key to remove assignment.
   <message name="IDS_SETTINGS_REMOVE_SAVED_DEVICE_DIALOG_TITLE" desc="Bluetooth saved devices subpage > Remove device dialog: Title for dialog that removes the device.">
     Remove device
   </message>
+  <message name="IDS_SETTINGS_FORGET_DEVICE_DIALOG_CANCEL" desc="Bluetooth device details page > Forget device dialog: Label for button that cancels forgetting the device.">
+    Cancel
+  </message>
+  <message name="IDS_SETTINGS_FORGET_DEVICE_DIALOG_FORGET" desc="Bluetooth device details page > Forget device dialog: Label for button that forgets the device.">
+    Forget
+  </message>
+  <message name="IDS_SETTINGS_FORGET_DEVICE_DIALOG_LABEL" desc="Bluetooth device details page > Forget device dialog: Label for dialog that forgets the device.">
+    <ph name="DEVICE">$1<ex>Beats</ex></ph> will be removed from <ph name="PRIMARY_EMAIL">$2<ex>john@google.com</ex></ph> and unpaired with this Chromebook.
+  </message>
+  <message name="IDS_SETTINGS_FORGET_DEVICE_DIALOG_TITLE" desc="Bluetooth device details page > Forget device dialog: Title for dialog that forgets the device.">
+    Forget device
+  </message>
   <message name="IDS_SETTINGS_BLUETOOTH_PAIR_DEVICE_TITLE" desc="Title of the settings dialog for adding or pairing Bluetooth a device.">
     Connect to Bluetooth device
   </message>

diff --git a/chrome/app/os_settings_strings_grdp/IDS_SETTINGS_FORGET_DEVICE_DIALOG_CANCEL.png.sha1 b/chrome/app/os_settings_strings_grdp/IDS_SETTINGS_FORGET_DEVICE_DIALOG_CANCEL.png.sha1
@@ -0,0 +1 @@
+969c3368b8521354024d12604361539d80c83fc5
diff --git a/chrome/app/os_settings_strings_grdp/IDS_SETTINGS_FORGET_DEVICE_DIALOG_FORGET.png.sha1 b/chrome/app/os_settings_strings_grdp/IDS_SETTINGS_FORGET_DEVICE_DIALOG_FORGET.png.sha1
@@ -0,0 +1 @@
+969c3368b8521354024d12604361539d80c83fc5
diff --git a/chrome/app/os_settings_strings_grdp/IDS_SETTINGS_FORGET_DEVICE_DIALOG_LABEL.png.sha1 b/chrome/app/os_settings_strings_grdp/IDS_SETTINGS_FORGET_DEVICE_DIALOG_LABEL.png.sha1
@@ -0,0 +1 @@
+1b88c0708fce8891f89d94201891dc924dd3feaf
diff --git a/chrome/app/os_settings_strings_grdp/IDS_SETTINGS_FORGET_DEVICE_DIALOG_TITLE.png.sha1 b/chrome/app/os_settings_strings_grdp/IDS_SETTINGS_FORGET_DEVICE_DIALOG_TITLE.png.sha1
@@ -0,0 +1 @@
+969c3368b8521354024d12604361539d80c83fc5
diff --git a/chrome/browser/resources/settings/chromeos/BUILD.gn b/chrome/browser/resources/settings/chromeos/BUILD.gn
@@ -615,6 +615,7 @@ preprocess_if_expr("preprocess_web_components") {
     "chromeos/os_bluetooth_page/os_saved_devices_list.js",
     "chromeos/os_bluetooth_page/os_saved_devices_list_item.js",
     "chromeos/os_bluetooth_page/os_remove_saved_device_dialog.js",
+    "chromeos/os_bluetooth_page/os_bluetooth_forget_device_dialog.js",
     "chromeos/os_bluetooth_page/settings_fast_pair_toggle.js",
     "chromeos/os_files_page/os_files_page.js",
     "chromeos/os_files_page/smb_shares_page.js",

diff --git a/chrome/browser/resources/settings/chromeos/os_bluetooth_page/BUILD.gn b/chrome/browser/resources/settings/chromeos/os_bluetooth_page/BUILD.gn
@@ -113,6 +113,7 @@ js_library("os_bluetooth_true_wireless_images") {
 js_library("os_bluetooth_device_detail_subpage") {
   deps = [
     ":os_bluetooth_change_device_name_dialog",
+    ":os_bluetooth_forget_device_dialog",
     ":os_bluetooth_true_wireless_images",
     "..:os_route",
     "..:route_observer_behavior",
@@ -172,6 +173,13 @@ js_library("os_remove_saved_device_dialog") {
   ]
 }
 
+js_library("os_bluetooth_forget_device_dialog") {
+  deps = [
+    "//third_party/polymer/v3_0/components-chromium/polymer:polymer_bundled",
+    "//ui/webui/resources/cr_elements/cr_dialog:cr_dialog.m",
+  ]
+}
+
 js_library("settings_fast_pair_constants") {
 }
 
@@ -208,6 +216,7 @@ html_to_js("web_components") {
   js_files = [
     "os_paired_bluetooth_list_item.js",
     "os_remove_saved_device_dialog.js",
+    "os_bluetooth_forget_device_dialog.js",
     "os_paired_bluetooth_list.js",
     "os_saved_devices_list_item.js",
     "os_saved_devices_list.js",

diff --git a/...ser/resources/settings/chromeos/os_bluetooth_page/os_bluetooth_device_detail_subpage.html b/...ser/resources/settings/chromeos/os_bluetooth_page/os_bluetooth_device_detail_subpage.html
@@ -70,7 +70,7 @@
         <cr-button id="forgetBtn"
             class="cancel-button"
             aria-label$="[[getForgetA11yLabel_(device_.*)]]"
-            on-click="onForgetBtnClick_">
+            on-click="onForgetButtonClicked_">
           $i18n{bluetoothDeviceDetailForget}
         </cr-button>
       </template>
@@ -145,3 +145,11 @@
       on-close="onCloseChangeDeviceNameDialog_">
   </os-settings-bluetooth-change-device-name-dialog>
 </template>
+
+<template is="dom-if" if="[[shouldShowForgetDeviceDialog_]]" restamp>
+  <os-settings-bluetooth-forget-device-dialog
+      id="forgetDeviceDialog"
+      device_="[[device_]]"
+      on-close="onCloseForgetDeviceDialog_">
+  </os-settings-bluetooth-forget-device-dialog>
+</template>
diff --git a/...owser/resources/settings/chromeos/os_bluetooth_page/os_bluetooth_device_detail_subpage.js b/...owser/resources/settings/chromeos/os_bluetooth_page/os_bluetooth_device_detail_subpage.js
@@ -21,6 +21,7 @@ import {getBatteryPercentage, getDeviceName, hasAnyDetailedBatteryInfo, hasDefau
 import {getBluetoothConfig} from 'chrome://resources/cr_components/chromeos/bluetooth/cros_bluetooth_config.js';
 import {assertNotReached} from 'chrome://resources/js/assert.m.js';
 import {I18nBehavior, I18nBehaviorInterface} from 'chrome://resources/js/i18n_behavior.m.js';
+import {WebUIListenerBehavior, WebUIListenerBehaviorInterface} from 'chrome://resources/js/web_ui_listener_behavior.m.js';
 import {AudioOutputCapability, BluetoothSystemProperties, DeviceConnectionState, DeviceType, PairedBluetoothDeviceProperties} from 'chrome://resources/mojo/chromeos/services/bluetooth_config/public/mojom/cros_bluetooth_config.mojom-webui.js';
 import {html, mixinBehaviors, PolymerElement} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';
 
@@ -44,9 +45,16 @@ const PageState = {
  * @implements {RouteObserverBehaviorInterface}
  * @implements {RouteOriginBehaviorInterface}
  * @implements {I18nBehaviorInterface}
+ * @implements {WebUIListenerBehaviorInterface}
  */
 const SettingsBluetoothDeviceDetailSubpageElementBase = mixinBehaviors(
-    [RouteObserverBehavior, RouteOriginBehavior, I18nBehavior], PolymerElement);
+    [
+      RouteObserverBehavior,
+      RouteOriginBehavior,
+      I18nBehavior,
+      WebUIListenerBehavior,
+    ],
+    PolymerElement);
 
 /** @polymer */
 class SettingsBluetoothDeviceDetailSubpageElement extends
@@ -104,6 +112,12 @@ class SettingsBluetoothDeviceDetailSubpageElement extends
         type: Object,
         value: PageState.DISCONNECTED,
       },
+
+      /** @protected */
+      shouldShowForgetDeviceDialog_: {
+        type: Boolean,
+        value: false,
+      },
     };
   }
 
@@ -124,6 +138,9 @@ class SettingsBluetoothDeviceDetailSubpageElement extends
   ready() {
     super.ready();
 
+    this.addEventListener(
+        'forget-bluetooth-device', this.forgetDeviceConfirmed_);
+
     this.addFocusConfig(routes.POINTERS, '#changeMouseSettings');
     this.addFocusConfig(routes.KEYBOARD, '#changeKeyboardSettings');
   }
@@ -568,15 +585,6 @@ class SettingsBluetoothDeviceDetailSubpageElement extends
     }
   }
 
-  /**
-   * @param {!Event} event
-   * @private
-   */
-  onForgetBtnClick_(event) {
-    event.stopPropagation();
-    getBluetoothConfig().forget(this.deviceId_);
-  }
-
   /**
    * @return {boolean}
    * @private
@@ -631,6 +639,21 @@ class SettingsBluetoothDeviceDetailSubpageElement extends
     return this.i18n(
         'bluetoothDeviceDetailForgetA11yLabel', this.getDeviceName_());
   }
+
+  /** @private */
+  onForgetButtonClicked_() {
+    this.shouldShowForgetDeviceDialog_ = true;
+  }
+
+  /** @private */
+  onCloseForgetDeviceDialog_() {
+    this.shouldShowForgetDeviceDialog_ = false;
+  }
+
+  /** @private */
+  forgetDeviceConfirmed_() {
+    getBluetoothConfig().forget(this.deviceId_);
+  }
 }
 
 customElements.define(

diff --git a/...wser/resources/settings/chromeos/os_bluetooth_page/os_bluetooth_forget_device_dialog.html b/...wser/resources/settings/chromeos/os_bluetooth_page/os_bluetooth_forget_device_dialog.html
@@ -0,0 +1,30 @@
+<style include="settings-shared">
+:host {
+  --cr-dialog-width: 320px;
+}
+[slot='button-container'] {
+  display: flex;
+  justify-content: flex-end;
+  margin: 40px 0 20px 0;
+  padding-bottom: 0;
+  padding-top: 0;
+  }
+</style>
+<cr-dialog id="dialog" show-on-attach>
+  <div id="title" slot="title">
+    $i18n{bluetoothDevicesDialogTitle}
+  </div>
+  <div slot="body">
+    [[getForgetDeviceDialogBodyText_()]]
+  </div>
+  <div slot="button-container">
+    <cr-button id="cancel" class="cancel-button"
+        on-click="onCancelClick_">
+      $i18n{bluetoothDevicesDialogCancel}
+    </cr-button>
+    <cr-button id="forget" class="action-button"
+        on-click="onForgetTap_">
+      $i18n{bluetoothDevicesDialogForget}
+    </cr-button>
+  </div>
+</cr-dialog>
diff --git a/...rowser/resources/settings/chromeos/os_bluetooth_page/os_bluetooth_forget_device_dialog.js b/...rowser/resources/settings/chromeos/os_bluetooth_page/os_bluetooth_forget_device_dialog.js
@@ -0,0 +1,81 @@
+// Copyright 2022 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.
+
+/**
+ * @fileoverview
+ * Forget dialog is used to forget a Bluetooth device.
+ */
+import '../../settings_shared.css.js';
+import 'chrome://resources/cr_elements/cr_input/cr_input.m.js';
+
+import {getDeviceName} from 'chrome://resources/cr_components/chromeos/bluetooth/bluetooth_utils.js';
+import {I18nBehavior, I18nBehaviorInterface} from 'chrome://resources/js/i18n_behavior.m.js';
+import {PairedBluetoothDeviceProperties} from 'chrome://resources/mojo/chromeos/services/bluetooth_config/public/mojom/cros_bluetooth_config.mojom-webui.js';
+import {html, mixinBehaviors, PolymerElement} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';
+
+import {loadTimeData} from '../../i18n_setup.js';
+
+/**
+ * @constructor
+ * @extends {PolymerElement}
+ * @implements {I18nBehaviorInterface}
+ */
+const SettingsBluetoothForgetDeviceDialogElementBase =
+    mixinBehaviors([I18nBehavior], PolymerElement);
+/** @polymer */
+class SettingsBluetoothForgetDeviceDialogElement extends
+    SettingsBluetoothForgetDeviceDialogElementBase {
+  static get is() {
+    return 'os-settings-bluetooth-forget-device-dialog';
+  }
+  static get template() {
+    return html`{__html_template__}`;
+  }
+  static get properties() {
+    return {
+      /**
+       * @private {!PairedBluetoothDeviceProperties}
+       */
+      device_: {
+        type: Object,
+      },
+    };
+  }
+  /**
+   * @private
+   */
+  getForgetDeviceDialogBodyText_() {
+    return this.i18n(
+        'bluetoothDevicesDialogLabel', this.getDeviceName_(),
+        loadTimeData.getString('primaryUserEmail'));
+  }
+
+  /**
+   * @return {string}
+   * @private
+   */
+  getDeviceName_() {
+    return getDeviceName(this.device_);
+  }
+
+  /**
+   * @param {!Event} event
+   * @private
+   */
+  onForgetTap_(event) {
+    const fireEvent = new CustomEvent(
+        'forget-bluetooth-device', {bubbles: true, composed: true});
+    this.dispatchEvent(fireEvent);
+    this.$.dialog.close();
+    event.stopPropagation();
+  }
+
+  /** @private */
+  onCancelClick_(event) {
+    this.$.dialog.close();
+  }
+}
+customElements.define(
+    SettingsBluetoothForgetDeviceDialogElement.is,
+    SettingsBluetoothForgetDeviceDialogElement);
diff --git a/chrome/browser/resources/settings/chromeos/os_settings.js b/chrome/browser/resources/settings/chromeos/os_settings.js
@@ -74,6 +74,7 @@ import './os_bluetooth_page/os_bluetooth_devices_subpage.js';
 import './os_bluetooth_page/os_bluetooth_device_detail_subpage.js';
 import './os_bluetooth_page/os_bluetooth_saved_devices_subpage.js';
 import './os_bluetooth_page/os_remove_saved_device_dialog.js';
+import './os_bluetooth_page/os_bluetooth_forget_device_dialog.js';
 import './os_bluetooth_page/os_bluetooth_true_wireless_images.js';
 import './os_bluetooth_page/os_bluetooth_change_device_name_dialog.js';
 import './os_bluetooth_page/os_bluetooth_pairing_dialog.js';

diff --git a/chrome/browser/ui/webui/settings/chromeos/bluetooth_section.cc b/chrome/browser/ui/webui/settings/chromeos/bluetooth_section.cc
@@ -329,6 +329,12 @@ void BluetoothSection::AddLoadTimeData(content::WebUIDataSource* html_source) {
        IDS_SETTINGS_REMOVE_SAVED_DEVICE_DIALOG_LABEL},
       {"savedDevicesDialogTitle",
        IDS_SETTINGS_REMOVE_SAVED_DEVICE_DIALOG_TITLE},
+      {"bluetoothDevicesDialogForget",
+       IDS_SETTINGS_FORGET_DEVICE_DIALOG_FORGET},
+      {"bluetoothDevicesDialogCancel",
+       IDS_SETTINGS_FORGET_DEVICE_DIALOG_CANCEL},
+      {"bluetoothDevicesDialogLabel", IDS_SETTINGS_FORGET_DEVICE_DIALOG_LABEL},
+      {"bluetoothDevicesDialogTitle", IDS_SETTINGS_FORGET_DEVICE_DIALOG_TITLE},
       {"bluetoothPrimaryUserControlled",
        IDS_SETTINGS_BLUETOOTH_PRIMARY_USER_CONTROLLED},
       {"bluetoothDeviceWithConnectionStatus",

diff --git a/chrome/test/data/webui/settings/chromeos/os_bluetooth_device_detail_subpage_tests.js b/chrome/test/data/webui/settings/chromeos/os_bluetooth_device_detail_subpage_tests.js
@@ -825,6 +825,9 @@ suite('OsBluetoothDeviceDetailPageTest', function() {
 
     // Forget device.
     getBluetoothForgetBtn().click();
+    await flushAsync();
+    bluetoothDeviceDetailPage.$$('#forgetDeviceDialog').$$('#forget').click();
+
     await flushAsync();
     bluetoothConfig.completeForget(/*success=*/ true);
     await windowPopstatePromise;