[CrOS PhoneHub] Update notification access settings flow

This CL adds support for a new state in the notification access opt-in
flow which displays an error when notification access is prohibited due
to a work profile on the user's phone.

This new state (NOTIFICATION_ACCESS_PROHIBITED) is not actually passed
to the settings app yet, but a follow-up CL provides this value when
appropriate.

Screenshot:
http://go/chrome-ss/2d53bf170afdbdbcc73d341c1e2fe774bfa30391

Bug: 1155151, 1106937
Change-Id: I00e852fc7b7c4281340fe7c8d02bcc6619f8862c
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2573887
Commit-Queue: Kyle Horimoto <khorimoto@chromium.org>
Reviewed-by: Jimmy Gong <jimmyxgong@chromium.org>
Cr-Commit-Position: refs/heads/master@{#834049}

chrome/app/os_settings_strings.grdp

@@ -2469,6 +2469,12 @@
   <message name="IDS_SETTINGS_MULTIDEVICE_NOTIFICATION_ACCESS_SETUP_DIALOG_CONNECTION_LOST_WITH_PHONE_SUMMARY" desc="The body text of the dialog containing the Phone Hub notification opt-in flow when the device loses its connection to the phone.">
     We were unable to maintain a connection with your phone. Make sure your phone is nearby, unlocked, and has Bluetooth and Wi-Fi turned on.
   </message>
+  <message name="IDS_SETTINGS_MULTIDEVICE_NOTIFICATION_ACCESS_SETUP_DIALOG_ACCESS_PROHIBITED_TITLE" desc="The title of the dialog containing the Phone Hub notification opt-in flow when access to notifications is prohibited because the user's phone has a work profile.">
+    Could not set up notifications syncing
+  </message>
+  <message name="IDS_SETTINGS_MULTIDEVICE_NOTIFICATION_ACCESS_SETUP_DIALOG_ACCESS_PROHIBITED_SUMMARY" desc="The title of the dialog containing the Phone Hub notification opt-in flow when access to notifications is prohibited because the user's phone has a work profile.">
+    Notification syncing is not supported for phones in a work profile. <ph name="LINK_BEGIN">&lt;a target="_blank" href="$1<ex>https://google.com/</ex>"&gt;</ph>Learn more<ph name="LINK_END">&lt;/a&gt;</ph>
+  </message>
   <message name="IDS_SETTINGS_MULTIDEVICE_NOTIFICATION_ACCESS_SETUP_DIALOG_GET_STARTED_BUTTON_LABEL" desc="The label to a button in the Phone Hub notification opt-in flow that appears when the dialog first opens. Clicking the button will allow the user to try enabling the feature.">
     Get started
   </message>

chrome/app/os_settings_strings_grdp/IDS_SETTINGS_MULTIDEVICE_NOTIFICATION_ACCESS_SETUP_DIALOG_ACCESS_PROHIBITED_SUMMARY.png.sha1

+2d53bf170afdbdbcc73d341c1e2fe774bfa30391
\ No newline at end of file

chrome/app/os_settings_strings_grdp/IDS_SETTINGS_MULTIDEVICE_NOTIFICATION_ACCESS_SETUP_DIALOG_ACCESS_PROHIBITED_TITLE.png.sha1

+2d53bf170afdbdbcc73d341c1e2fe774bfa30391
\ No newline at end of file

chrome/browser/resources/settings/chromeos/multidevice_page/multidevice_notification_access_setup_dialog.html

@@ -8,6 +8,7 @@
 <link rel="import" href="chrome://resources/cr_elements/shared_style_css.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/iron-icon/iron-icon.html">
 <link rel="import" href="multidevice_browser_proxy.html">
+<link rel="import" href="../localized_link/localized_link.html">
 <link rel="import" href="../os_icons.html">
 <link rel="import" href="../../settings_shared_css.html">
 
@@ -85,16 +86,18 @@
       <div id="dialogBody" slot="body">
         <div id="illustration"></div>
         <div id="description">
-          <div hidden="[[isSetupAttemptInProgress_]]">
-            [[description_]]
-          </div>
+          <template is="dom-if" if="[[description_]]" restamp>
+            <settings-localized-link localized-string="[[description_]]">
+            </settings-localized-link>
+          </template>
           <div hidden="[[!shouldShowSetupInstructionsSeparately_]]">
             $i18n{multideviceNotificationAccessSetupInstructions}
           </div>
         </div>
       </div>
       <div id="buttonContainer" slot="button-container">
-        <template is="dom-if" if="[[!hasCompletedSetupSuccessfully_]]" restamp>
+        <template is="dom-if" if="[[shouldShowCancelButton_(setupState_)]]"
+            restamp>
           <cr-button id="cancelButton" class="cancel-button"
               on-click="onCancelClicked_">
             $i18n{cancel}
@@ -102,17 +105,24 @@
         </template>
         <template is="dom-if" if="[[hasCompletedSetupSuccessfully_]]" restamp>
           <cr-button id="doneButton" class="action-button"
-              on-click="onDoneButtonClicked_">
+              on-click="onDoneOrCloseButtonClicked_">
             $i18n{done}
           </cr-button>
         </template>
+        <template is="dom-if" if="[[isNotificationAccessProhibited_]]" restamp>
+          <cr-button id="closeButton" class="action-button"
+              on-click="onDoneOrCloseButtonClicked_">
+            $i18n{close}
+          </cr-button>
+        </template>
         <template is="dom-if" if="[[hasNotStartedSetupAttempt_]]" restamp>
           <cr-button id="getStartedButton" class="action-button"
               on-click="attemptNotificationSetup_">
             $i18n{multideviceNotificationAccessSetupGetStarted}
           </cr-button>
         </template>
-        <template is="dom-if" if="[[didSetupAttemptFail_]]" restamp>
+        <template is="dom-if" if="[[shouldShowTryAgainButton_(setupState_)]]"
+            restamp>
           <cr-button id="tryAgainButton" class="action-button"
               on-click="attemptNotificationSetup_">
             $i18n{multideviceNotificationAccessSetupTryAgain}

chrome/browser/resources/settings/chromeos/multidevice_page/multidevice_notification_access_setup_dialog.js

@@ -22,6 +22,7 @@
   CONNECTION_DISCONNECTED: 3,
   SENT_MESSAGE_TO_PHONE_AND_WAITING_FOR_RESPONSE: 4,
   COMPLETED_SUCCESSFULLY: 5,
+  NOTIFICATION_ACCESS_PROHIBITED: 6,
 };
 
 Polymer({
@@ -82,6 +83,12 @@ Polymer({
       reflectToAttribute: true,
     },
 
+    /** @private */
+    isNotificationAccessProhibited_: {
+      type: Boolean,
+      computed: 'computeIsNotificationAccessProhibited_(setupState_)',
+    },
+
     /** @private */
     shouldShowSetupInstructionsSeparately_: {
       type: Boolean,
@@ -146,6 +153,15 @@ Polymer({
         NotificationAccessSetupOperationStatus.COMPLETED_SUCCESSFULLY;
   },
 
+  /**
+   * @return {boolean}
+   * @private
+   */
+  computeIsNotificationAccessProhibited_() {
+    return this.setupState_ ===
+        NotificationAccessSetupOperationStatus.NOTIFICATION_ACCESS_PROHIBITED;
+  },
+
   /**
    * @return {boolean}
    * @private
@@ -154,7 +170,9 @@ Polymer({
     return this.setupState_ ===
         NotificationAccessSetupOperationStatus.TIMED_OUT_CONNECTING ||
         this.setupState_ ===
-        NotificationAccessSetupOperationStatus.CONNECTION_DISCONNECTED;
+        NotificationAccessSetupOperationStatus.CONNECTION_DISCONNECTED ||
+        this.setupState_ ===
+        NotificationAccessSetupOperationStatus.NOTIFICATION_ACCESS_PROHIBITED;
   },
 
   /**
@@ -179,7 +197,7 @@ Polymer({
   },
 
   /** @private */
-  onDoneButtonClicked_() {
+  onDoneOrCloseButtonClicked_() {
     this.$.dialog.close();
   },
 
@@ -206,6 +224,9 @@ Polymer({
       case Status.CONNECTION_DISCONNECTED:
         return this.i18n(
             'multideviceNotificationAccessSetupConnectionLostWithPhoneTitle');
+      case Status.NOTIFICATION_ACCESS_PROHIBITED:
+        return this.i18n(
+            'multideviceNotificationAccessSetupAccessProhibitedTitle');
       default:
         return '';
     }
@@ -230,6 +251,9 @@ Polymer({
       case Status.CONNECTION_DISCONNECTED:
         return this.i18n(
             'multideviceNotificationAccessSetupMaintainFailureSummary');
+      case Status.NOTIFICATION_ACCESS_PROHIBITED:
+        return this.i18nAdvanced(
+            'multideviceNotificationAccessSetupAccessProhibitedSummary');
 
       // Only setup instructions will be shown.
       case Status.CONNECTION_REQUESTED:
@@ -239,4 +263,26 @@ Polymer({
         return '';
     }
   },
+
+  /**
+   * @return {boolean}
+   * @private
+   */
+  shouldShowCancelButton_() {
+    return this.setupState_ !==
+        NotificationAccessSetupOperationStatus.COMPLETED_SUCCESSFULLY &&
+        this.setupState_ !==
+        NotificationAccessSetupOperationStatus.NOTIFICATION_ACCESS_PROHIBITED;
+  },
+
+  /**
+   * @return {boolean}
+   * @private
+   */
+  shouldShowTryAgainButton_() {
+    return this.setupState_ ===
+        NotificationAccessSetupOperationStatus.TIMED_OUT_CONNECTING ||
+        this.setupState_ ===
+        NotificationAccessSetupOperationStatus.CONNECTION_DISCONNECTED;
+  },
 });

chrome/browser/ui/webui/settings/chromeos/multidevice_section.cc

@@ -301,6 +301,8 @@ void MultiDeviceSection::AddLoadTimeData(
        IDS_SETTINGS_MULTIDEVICE_NOTIFICATION_ACCESS_SETUP_DIALOG_CONNECTION_LOST_WITH_PHONE_SUMMARY},
       {"multideviceNotificationAccessSetupEstablishFailureSummary",
        IDS_SETTINGS_MULTIDEVICE_NOTIFICATION_ACCESS_SETUP_DIALOG_COULD_NOT_ESTABLISH_CONNECTION_SUMMARY},
+      {"multideviceNotificationAccessSetupAccessProhibitedTitle",
+       IDS_SETTINGS_MULTIDEVICE_NOTIFICATION_ACCESS_SETUP_DIALOG_ACCESS_PROHIBITED_TITLE},
       {"multideviceInstantTetheringItemTitle",
        IDS_SETTINGS_MULTIDEVICE_INSTANT_TETHERING},
       {"multideviceInstantTetheringItemSummary",
@@ -382,6 +384,15 @@ void MultiDeviceSection::AddLoadTimeData(
       l10n_util::GetStringFUTF16(
           IDS_SETTINGS_MULTIDEVICE_PHONE_HUB_NOTIFICATIONS_SUMMARY,
           ui::GetChromeOSDeviceName()));
+  // TODO(https://crbug.com/1144053): Replace with updated URL.
+  html_source->AddString(
+      "multideviceNotificationAccessSetupAccessProhibitedSummary",
+      l10n_util::GetStringFUTF16(
+          IDS_SETTINGS_MULTIDEVICE_NOTIFICATION_ACCESS_SETUP_DIALOG_ACCESS_PROHIBITED_SUMMARY,
+          base::UTF8ToUTF16(
+              multidevice_setup::
+                  GetBoardSpecificBetterTogetherSuiteLearnMoreUrl()
+                      .spec())));
   html_source->AddString(
       "multideviceWifiSyncItemSummary",
       l10n_util::GetStringFUTF16(

chrome/test/data/webui/settings/chromeos/multidevice_notification_access_setup_dialog_tests.js

@@ -146,4 +146,27 @@ suite('Multidevice', () => {
 
     assertFalse(notificationAccessSetupDialog.$$('#dialog').open);
   });
+
+  test('Test notification access prohibited', async () => {
+    assertTrue(!!buttonContainer.querySelector('#cancelButton'));
+    assertTrue(!!buttonContainer.querySelector('#getStartedButton'));
+    assertFalse(!!buttonContainer.querySelector('#doneButton'));
+    assertFalse(!!buttonContainer.querySelector('#tryAgainButton'));
+    assertFalse(!!buttonContainer.querySelector('#closeButton'));
+    buttonContainer.querySelector('#getStartedButton').click();
+    assertEquals(browserProxy.getCallCount('attemptNotificationSetup'), 1);
+
+    simulateStatusChanged(
+        NotificationAccessSetupOperationStatus.NOTIFICATION_ACCESS_PROHIBITED);
+
+    assertFalse(!!buttonContainer.querySelector('#cancelButton'));
+    assertFalse(!!buttonContainer.querySelector('#getStartedButton'));
+    assertFalse(!!buttonContainer.querySelector('#doneButton'));
+    assertFalse(!!buttonContainer.querySelector('#tryAgainButton'));
+    assertTrue(!!buttonContainer.querySelector('#closeButton'));
+
+    buttonContainer.querySelector('#closeButton').click();
+
+    assertFalse(notificationAccessSetupDialog.$$('#dialog').open);
+  });
 });