Skip to content

Commit

Permalink
[CrOS Settings] Add confirmation code dialog from network settings page.
Browse files Browse the repository at this point in the history
Add dialog prompting the user for a confirmation code if required when
attempting to install an eSIM profile from the network settings page.

Screenshot:
https://screenshot.googleplex.com/4AkPWFzZhEYYGYJ.png

Bug: 1093185
Change-Id: If75f4751797d8b31eed6af5a5b0449e43f91a0bf
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2713887
Reviewed-by: Regan Hsu <hsuregan@chromium.org>
Reviewed-by: Azeem Arshad <azeemarshad@chromium.org>
Commit-Queue: Gordon Seto <gordonseto@google.com>
Cr-Commit-Position: refs/heads/master@{#857760}
  • Loading branch information
Gordon Seto authored and Chromium LUCI CQ committed Feb 25, 2021
1 parent 325f03f commit a7ba703
Show file tree
Hide file tree
Showing 16 changed files with 346 additions and 9 deletions.
9 changes: 9 additions & 0 deletions chrome/app/os_settings_strings.grdp
Expand Up @@ -2252,6 +2252,15 @@ Press an assigned switch to remove assignment.
<message name="IDS_SETTINGS_INTERNET_NETWORK_MENU_RENAME" desc="Settings > Internet > Network details > Dot menu: Label for the button to rename an eSIM cellular network">
Rename
</message>
<message name="IDS_SETTINGS_INTERNET_NETWORK_CONFIRMATION_CODE_DIALOG_TITLE" desc="Settings > Network > Mobile data > Download > Confirmation code dialog: Title for the dialog prompting the user to enter the confirmation code required to activate the eSIM profile they are attempting to install">
Set up new network
</message>
<message name="IDS_SETTINGS_INTERNET_NETWORK_CONFIRMATION_CODE_DIALOG_MESSAGE" desc="Settings > Network > Mobile data > Download > Confirmation code dialog: Message for the dialog prompting the user to enter the confirmation code required to activate the eSIM profile they are attempting to install">
Please enter your confirmation code.
</message>
<message name="IDS_CELLULAR_SETUP_ESIM_PAGE_CONFIRMATION_CODE_DIALOG_ERROR" desc="Settings > Network > Mobile data > Download > Confirmation code dialog: Error indicating that installing the eSIM profile was unsuccessful.">
Unable to connect to this profile. For technical support, please contact your carrier.
</message>
<message name="IDS_SETTINGS_INTERNET_NETWORK_RENAME_DIALOG_RENAME_PROFILE" desc="Settings > Internet > Network details > Rename profile dialog: Label for the dialog informing the user to rename an eSIM cellular network">
Rename Profile
</message>
Expand Down
@@ -0,0 +1 @@
08db40e7f3e6345e3c590672152e1e086228a680
@@ -0,0 +1 @@
790bed005fbbd794ae50b9341c97da187cda6b74
@@ -0,0 +1 @@
790bed005fbbd794ae50b9341c97da187cda6b74
3 changes: 3 additions & 0 deletions chrome/browser/resources/settings/chromeos/BUILD.gn
Expand Up @@ -348,6 +348,7 @@ preprocess_if_expr("preprocess_gen_v3") {
"chromeos/guest_os/guest_os_browser_proxy.m.js",
"chromeos/guest_os/guest_os_shared_paths.m.js",
"chromeos/guest_os/guest_os_shared_usb_devices.m.js",
"chromeos/internet_page/esim_confirmation_code_dialog.m.js",
"chromeos/internet_page/esim_remove_profile_dialog.m.js",
"chromeos/internet_page/esim_rename_dialog.m.js",
"chromeos/internet_page/cellular_networks_list.m.js",
Expand Down Expand Up @@ -686,6 +687,8 @@ preprocess_if_expr("preprocess_v2") {
"chromeos/guest_os/guest_os_shared_paths.js",
"chromeos/guest_os/guest_os_shared_usb_devices.html",
"chromeos/guest_os/guest_os_shared_usb_devices.js",
"chromeos/internet_page/esim_confirmation_code_dialog.js",
"chromeos/internet_page/esim_confirmation_code_dialog.html",
"chromeos/internet_page/esim_remove_profile_dialog.js",
"chromeos/internet_page/esim_remove_profile_dialog.html",
"chromeos/internet_page/esim_rename_dialog.js",
Expand Down
23 changes: 23 additions & 0 deletions chrome/browser/resources/settings/chromeos/internet_page/BUILD.gn
Expand Up @@ -13,6 +13,7 @@ js_type_check("closure_compile_module") {
":cellular_networks_list.m",
":cellular_setup_dialog.m",
":cellular_setup_settings_delegate.m",
":esim_confirmation_code_dialog.m",
":esim_remove_profile_dialog.m",
":esim_rename_dialog.m",
":internet_config.m",
Expand Down Expand Up @@ -291,6 +292,7 @@ js_library("tether_connection_dialog.m") {
js_library("cellular_networks_list.m") {
sources = [ "$root_gen_dir/chrome/browser/resources/settings/chromeos/internet_page/cellular_networks_list.m.js" ]
deps = [
":esim_confirmation_code_dialog.m",
"//chrome/browser/resources/settings/chromeos/localized_link:localized_link.m",
"//third_party/polymer/v3_0/components-chromium/polymer:polymer_bundled",
"//ui/webui/resources/cr_components/chromeos/cellular_setup:cellular_types.m",
Expand All @@ -303,6 +305,18 @@ js_library("cellular_networks_list.m") {
extra_deps = [ ":cellular_networks_list_module" ]
}

js_library("esim_confirmation_code_dialog.m") {
sources = [ "$root_gen_dir/chrome/browser/resources/settings/chromeos/internet_page/esim_confirmation_code_dialog.m.js" ]
deps = [
"//third_party/polymer/v3_0/components-chromium/paper-spinner:paper-spinner-lite",
"//ui/webui/resources/cr_components/chromeos/cellular_setup:esim_manager_utils.m",
"//ui/webui/resources/cr_elements/cr_dialog:cr_dialog.m",
"//ui/webui/resources/cr_elements/cr_input:cr_input.m",
"//ui/webui/resources/js:i18n_behavior.m",
]
extra_deps = [ ":esim_confirmation_code_dialog_module" ]
}

js_library("esim_rename_dialog.m") {
sources = [ "$root_gen_dir/chrome/browser/resources/settings/chromeos/internet_page/esim_rename_dialog.m.js" ]
deps = [
Expand All @@ -329,6 +343,7 @@ group("polymer3_elements") {
public_deps = [
":cellular_networks_list_module",
":cellular_setup_dialog_module",
":esim_confirmation_code_dialog_module",
":esim_remove_profile_dialog_module",
":esim_rename_dialog_module",
":internet_config_module",
Expand Down Expand Up @@ -449,6 +464,14 @@ polymer_modulizer("cellular_networks_list") {
namespace_rewrites = os_settings_namespace_rewrites
}

polymer_modulizer("esim_confirmation_code_dialog") {
js_file = "esim_confirmation_code_dialog.js"
html_file = "esim_confirmation_code_dialog.html"
html_type = "dom-module"
auto_imports = os_settings_auto_imports
namespace_rewrites = os_settings_namespace_rewrites
}

polymer_modulizer("esim_rename_dialog") {
js_file = "esim_rename_dialog.js"
html_file = "esim_rename_dialog.html"
Expand Down
Expand Up @@ -15,6 +15,7 @@
<link rel="import" href="chrome://resources/cr_elements/shared_style_css.html">
<link rel="import" href="chrome://resources/cr_elements/shared_vars_css.html">
<link rel="import" href="../../chromeos/os_settings_icons_css.html">
<link rel="import" href="esim_confirmation_code_dialog.html">

<dom-module id="cellular-networks-list">
<template>
Expand Down Expand Up @@ -152,6 +153,13 @@
</settings-localized-link>
</div>
</template>

<template is="dom-if" if="[[shouldShowConfirmationCodeDialog_]]" restamp>
<esim-confirmation-code-dialog id="confirmationCodeDialog"
on-close="onCloseConfirmationCodeDialog_"
profile="[[installingESimProfile_]]">
</esim-confirmation-code-dialog>
</template>
</template>
<script src="cellular_networks_list.js"></script>
</dom-module>
Expand Up @@ -106,14 +106,30 @@ Polymer({
value: false,
},

/** @private {boolean} */
shouldShowConfirmationCodeDialog_: {
type: Boolean,
value: false,
},

/**
* Euicc object representing the active euicc_ module on the device
* @private {?chromeos.cellularSetup.mojom.EuiccRemote}
*/
euicc_: {
type: Object,
value: null,
}
},

/**
* The current eSIM profile being installed.
* @type {?chromeos.cellularSetup.mojom.ESimProfileRemote}
* @private
*/
installingESimProfile_: {
type: Object,
value: null,
},
},

listeners: {
Expand Down Expand Up @@ -316,12 +332,24 @@ Polymer({
* @private
*/
installProfile_(event) {
const profileIccid = event.detail.iccid;
const profile = this.profilesMap_.get(profileIccid);
profile.installProfile('').then(
() => {
// TODO(crbug.com/1093185) Show error if install fails.
// Show confirmation code page if required.
});
this.installingESimProfile_ = this.profilesMap_.get(event.detail.iccid);
this.installingESimProfile_.installProfile('').then((response) => {
// TODO(crbug.com/1093185) Show error if install fails.
if (response.result ===
chromeos.cellularSetup.mojom.ProfileInstallResult
.kErrorNeedsConfirmationCode) {
this.showConfirmationCodeDialog_();
}
});
},

/** @private */
showConfirmationCodeDialog_() {
this.shouldShowConfirmationCodeDialog_ = true;
},

/** @private */
onCloseConfirmationCodeDialog_() {
this.shouldShowConfirmationCodeDialog_ = false;
},
});
@@ -0,0 +1,67 @@
<link rel="import" href="chrome://resources/html/polymer.html">

<link rel="import" href="chrome://resources/cr_components/chromeos/cellular_setup/esim_manager_utils.html">
<link rel="import" href="chrome://resources/cr_elements/cr_dialog/cr_dialog.html">
<link rel="import" href="chrome://resources/cr_elements/cr_input/cr_input.html">
<link rel="import" href="chrome://resources/html/i18n_behavior.html">
<link rel="import" href="chrome://resources/polymer/v1_0/iron-flex-layout/iron-flex-layout-classes.html">

<dom-module id="esim-confirmation-code-dialog">
<template>
<style include="iron-flex iron-positioning">
:host {
--cr-dialog-width: 480px;
}

paper-spinner-lite {
height: 20px;
position: absolute;
right: 16px;
top: 6px;
width: 20px;
}

#message {
margin-bottom: 40px;
}

#cancel {
margin-inline-end: 8px;
}
</style>
<cr-dialog id="confirmationCodeDialog" show-on-attach>
<div slot="title">$i18n{eSimConfirmationCodeDialogTitle}</div>
<div slot="body">
<div id="message">
$i18n{eSimConfirmationCodeDialogMessage}
</div>
<div class="relative">
<cr-input id="confirmationCode"
value="{{confirmationCode_}}"
spellcheck="false"
disabled="[[isInstallInProgress_]]"
error-message="$i18n{eSimConfirmationCodeDialogError}"
invalid="[[showError_]]">
</cr-input>
<paper-spinner-lite active
hidden$="[[!isInstallInProgress_]]">
</paper-spinner-lite>
</div>
</div>
<div slot="button-container">
<cr-button id="cancel"
on-click="onCancelClicked_"
class="cancel-button">
$i18n{eSimRenameProfileDialogCancel}
</cr-button>
<cr-button id="done"
on-click="onDoneClicked_"
disabled="[[isDoneButtonDisabled_(confirmationCode_, isInstallInProgress_)]]"
class="action-button">
$i18n{eSimRenameProfileDialogDone}
</cr-button>
</div>
</cr-dialog>
</template>
<script src="esim_confirmation_code_dialog.js"></script>
</dom-module>
@@ -0,0 +1,80 @@
// Copyright 2021 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 Polymer element to enter a confirmation code if required when
* installing an eSIM profile.
*/

Polymer({
is: 'esim-confirmation-code-dialog',

behaviors: [
I18nBehavior,
],

properties: {
/** @type {?chromeos.cellularSetup.mojom.ESimProfileRemote} */
profile: {
type: Object,
value: null,
},

/** @private {string} */
confirmationCode_: {
type: String,
value: '',
observer: 'onConfirmationCodeChanged_',
},

/** @private {boolean} */
isInstallInProgress_: {
type: Boolean,
value: false,
},

/** @private {boolean} */
showError_: {
type: Boolean,
value: false,
},
},

/** @private */
onConfirmationCodeChanged_() {
this.showError_ = false;
},

/**
* @param {Event} event
* @private
*/
onDoneClicked_(event) {
this.isInstallInProgress_ = true;
this.showError_ = false;

this.profile.installProfile(this.confirmationCode_).then((response) => {
this.isInstallInProgress_ = false;
if (response.result ===
chromeos.cellularSetup.mojom.ESimOperationResult.kSuccess) {
this.$.confirmationCodeDialog.close();
return;
}
this.showError_ = true;
});
},

/**
* @param {Event} event
* @private
*/
onCancelClicked_(event) {
this.$.confirmationCodeDialog.close();
},

/** @private */
isDoneButtonDisabled_() {
return !this.confirmationCode_ || this.isInstallInProgress_;
},
});
6 changes: 6 additions & 0 deletions chrome/browser/ui/webui/settings/chromeos/internet_section.cc
Expand Up @@ -704,6 +704,12 @@ void InternetSection::AddLoadTimeData(content::WebUIDataSource* html_source) {
{"cellularNetworkTetherLabel", IDS_SETTINGS_INTERNET_TETHER_LABEL},
{"showEidPopupButtonLabel",
IDS_SETTINGS_INTERNET_SHOW_EID_POPUP_BUTTON_LABEL},
{"eSimConfirmationCodeDialogTitle",
IDS_SETTINGS_INTERNET_NETWORK_CONFIRMATION_CODE_DIALOG_TITLE},
{"eSimConfirmationCodeDialogMessage",
IDS_SETTINGS_INTERNET_NETWORK_CONFIRMATION_CODE_DIALOG_MESSAGE},
{"eSimConfirmationCodeDialogError",
IDS_CELLULAR_SETUP_ESIM_PAGE_CONFIRMATION_CODE_DIALOG_ERROR},
{"eSimRenameProfileDialogLabel",
IDS_SETTINGS_INTERNET_NETWORK_RENAME_DIALOG_RENAME_PROFILE},
{"eSimRenameProfileDialogDone",
Expand Down
1 change: 1 addition & 0 deletions chrome/test/data/webui/BUILD.gn
Expand Up @@ -335,6 +335,7 @@ if (include_js_tests) {
"$root_gen_dir/chrome/test/data/webui/settings/chromeos/cups_printer_entry_tests.m.js",
"$root_gen_dir/chrome/test/data/webui/settings/chromeos/date_time_page_tests.m.js",
"$root_gen_dir/chrome/test/data/webui/settings/chromeos/device_page_tests.m.js",
"$root_gen_dir/chrome/test/data/webui/settings/chromeos/esim_confirmation_code_dialog_test.m.js",
"$root_gen_dir/chrome/test/data/webui/settings/chromeos/esim_remove_profile_dialog_test.m.js",
"$root_gen_dir/chrome/test/data/webui/settings/chromeos/esim_rename_dialog_test.m.js",
"$root_gen_dir/chrome/test/data/webui/settings/chromeos/fake_bluetooth_private.m.js",
Expand Down
Expand Up @@ -44,7 +44,12 @@ cr.define('cellular_setup', function() {
* chromeos.cellularSetup.mojom.ProfileInstallResult},}>}
*/
installProfile(confirmationCode) {
this.properties.state = chromeos.cellularSetup.mojom.ProfileState.kActive;
if (!this.profileInstallResult_ ||
this.profileInstallResult_ ===
chromeos.cellularSetup.mojom.ProfileInstallResult.kSuccess) {
this.properties.state =
chromeos.cellularSetup.mojom.ProfileState.kActive;
}
this.fakeEuicc_.notifyProfileChangedForTest(this);
this.fakeEuicc_.notifyProfileListChangedForTest();
return Promise.resolve({
Expand Down
1 change: 1 addition & 0 deletions chrome/test/data/webui/settings/chromeos/BUILD.gn
Expand Up @@ -64,6 +64,7 @@ js_modulizer("modulize") {
"cups_printer_test_utils.js",
"date_time_page_tests.js",
"device_page_tests.js",
"esim_confirmation_code_dialog_test.js",
"esim_remove_profile_dialog_test.js",
"esim_rename_dialog_test.js",
"fake_bluetooth.js",
Expand Down

0 comments on commit a7ba703

Please sign in to comment.