nearby: high visibility receive page time out

http://screen/9giUqca89s2rTHh

Bug: 1156229
Test: browser_tests --gtest_filter=*NearbySh*
Change-Id: Iccf9a78133a5face8c66518659ab1d941ff9a203
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2587491
Commit-Queue: Joon Ahn <joonbug@chromium.org>
Reviewed-by: Kyle Horimoto <khorimoto@chromium.org>
Reviewed-by: James Vecore <vecore@google.com>
Auto-Submit: Joon Ahn <joonbug@chromium.org>
Cr-Commit-Position: refs/heads/master@{#836639}

chrome/app/nearby_share_strings.grdp

@@ -196,6 +196,9 @@
   <message name="IDS_NEARBY_HIGH_VISIBILITY_HELP_TEXT" desc="Describes to the user that their device is visible to nearby devices with a specific device name. This is used on the sub-title of the of high visibility receive dialog for the Nearby Share feature.">
     Make sure both devices are unlocked, close together, and have Bluetooth turned on. <ph name="LINK_BEGIN">&lt;a&gt;</ph>Learn more<ph name="LINK_END">&lt;/a&gt;</ph>
   </message>
+  <message name="IDS_NEARBY_HIGH_VISIBILITY_TIMEOUT_TEXT" desc="Describes to the user that their device is visible to nearby devices with a specific device name. This is used on the sub-title of the of high visibility receive dialog for the Nearby Share feature.">
+    No available devices sharing nearby. <ph name="LINK_BEGIN">&lt;a&gt;</ph>Learn more<ph name="LINK_END">&lt;/a&gt;</ph>
+  </message>
 
   <!-- Receive Confirmation Page Strings -->
   <message name="IDS_NEARBY_RECEIVE_CONFIRM_PAGE_TITLE" desc="The title of the recieve confirmation page which askign the user to confirm receving a share from a specific device.">

chrome/app/nearby_share_strings_grdp/IDS_NEARBY_HIGH_VISIBILITY_TIMEOUT_TEXT.png.sha1

+9eaf162a75776698929e5b5b731f1d6e2b5ce9bc
\ No newline at end of file

chrome/browser/resources/settings/chromeos/nearby_share_page/nearby_share_high_visibility_page.html

@@ -43,6 +43,22 @@
         width: 20px;
       }
 
+      .icon-error-state {
+        fill: var(--google-red-600);
+      }
+
+      #error {
+        align-items: flex-start;
+        display: flex;
+        flex-direction: column;
+        font-size: 12px;
+      }
+
+      #errorTitle {
+        color: var(--google-red-600);
+        font-weight: bold;
+        margin-bottom: 3px;
+      }
       cr-lottie {
         bottom: 0;
         height: 100px;
@@ -55,14 +71,35 @@
         cancel-button-label="$i18n{cancel}">
       <div id="content" slot="content">
         <div id="help">
-          <iron-icon id="infoIcon" icon="nearby20:info"></iron-icon>
-          <div id="helpText">
-            <!-- TODO(crbug.com/1157108): add correct learn more url -->
-            <settings-localized-link
-                localized-string="$i18n{nearbyShareHighVisibilityHelpText}"
-                link-url="https://google.com">
-            </settings-localized-link>
-          </div>
+          <template is="dom-if" if="[[!highVisibilityTimedOut_(
+              remainingTimeInSeconds_, shutoffTimestamp)]]">
+            <iron-icon id="infoIcon" icon="nearby20:info"></iron-icon>
+            <div id="helpText">
+              <!-- TODO(crbug.com/1157108): add correct learn more url -->
+              <settings-localized-link
+                  localized-string="$i18n{nearbyShareHighVisibilityHelpText}"
+                  link-url="https://google.com">
+              </settings-localized-link>
+            </div>
+          </template>
+          <template is="dom-if" if="[[highVisibilityTimedOut_(
+              remainingTimeInSeconds_, shutoffTimestamp)]]">
+            <iron-icon id="infoIcon" icon="nearby20:info"
+              class="icon-error-state">
+            </iron-icon>
+            <div id="error" role="alert" aria-labelledby="errorTitle"
+                aria-describedby="errorDescription">
+              <div id="errorTitle" aria-hidden="true">
+                $i18n{nearbyShareErrorTimeOut}
+              </div>
+              <!-- TODO(crbug.com/1157108): add correct learn more url -->
+              <settings-localized-link
+                  localized-string="$i18n{nearbyShareHighVisibilityTimeoutText}"
+                  link-url="https://google.com">
+              </settings-localized-link>
+              </div>
+            </div>
+          </template>
         </div>
         <cr-lottie animation-url="nearby_share_pulse_animation.json"
             autoplay="true">

chrome/browser/resources/settings/chromeos/nearby_share_page/nearby_share_high_visibility_page.js

@@ -31,13 +31,17 @@ Polymer({
       type: Number,
       value: 0,
     },
-  },
 
-  /**
-   * Calculated value of remaining seconds of high visibility mode.
-   * @private {number}
-   */
-  remainingTimeInSeconds_: 0,
+    /**
+     * Calculated value of remaining seconds of high visibility mode.
+     * Initialized to -1 to differentiate it from timed out state.
+     * @private {number}
+     */
+    remainingTimeInSeconds_: {
+      type: Number,
+      value: -1,
+    },
+  },
 
   /** @private {number} */
   remainingTimeIntervalId_: -1,
@@ -61,11 +65,23 @@ Polymer({
   /** @private */
   calculateRemainingTime_() {
     const now = new Date().getTime();
+
     const remainingTimeInMs =
         this.shutoffTimestamp > now ? this.shutoffTimestamp - now : 0;
     this.remainingTimeInSeconds_ = Math.trunc(remainingTimeInMs / 1000);
   },
 
+  /**
+   * @return {boolean}
+   * @protected
+   */
+  highVisibilityTimedOut_() {
+    // High visibility session is timed out only if remaining seconds is 0 AND
+    // timestamp is also set.
+    return (this.remainingTimeInSeconds_ === 0) &&
+        (this.shutoffTimestamp !== 0);
+  },
+
   /**
    * @return {string} localized string
    * @protected

chrome/browser/resources/settings/chromeos/nearby_share_page/nearby_share_receive_dialog.js

@@ -126,11 +126,13 @@ Polymer({
 
   /**
    * Mojo callback when high visibility changes. If high visibility is false
-   * we force this dialog to close as well.
+   * due to a user cancel, we force this dialog to close as well.
    * @param {boolean} inHighVisibility
    */
   onHighVisibilityChanged(inHighVisibility) {
-    if (inHighVisibility === false) {
+    const now = new Date().getTime();
+    if (inHighVisibility === false &&
+        now < this.highVisibilityShutoffTimestamp_) {
       // TODO(crbug/1134745): Exiting high visibility can happen for multiple
       // reasons (timeout, user cancel, etc). During a receive transfer, it
       // happens before we start connecting (because we need to stop

chrome/browser/ui/webui/nearby_share/shared_resources.cc

@@ -102,6 +102,8 @@ void RegisterNearbySharedStrings(content::WebUIDataSource* data_source) {
        IDS_NEARBY_HIGH_VISIBILITY_SUB_TITLE_SECONDS},
       {"nearbyShareHighVisibilityHelpText",
        IDS_NEARBY_HIGH_VISIBILITY_HELP_TEXT},
+      {"nearbyShareHighVisibilityTimeoutText",
+       IDS_NEARBY_HIGH_VISIBILITY_TIMEOUT_TEXT},
       {"nearbyShareReceiveConfirmPageTitle",
        IDS_NEARBY_RECEIVE_CONFIRM_PAGE_TITLE},
       {"nearbyShareReceiveConfirmPageConnectionId",