[App Management] Add a back button to the main view of App Management.

This CL adds a back button to the main view of App Management which leads to
the settings page and removes the referrer field when opening App Management.

Bug: 958733, 966359
Change-Id: Ib579af755eb785c1415f1ad9ebc6844d3ff446bb
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1626924
Commit-Queue: Jeevan Shikaram <jshikaram@chromium.org>
Reviewed-by: calamity <calamity@chromium.org>
Cr-Commit-Position: refs/heads/master@{#664219}

chrome/browser/resources/app_management/expandable_app_list.html

@@ -11,8 +11,19 @@
 <dom-module id="app-management-expandable-app-list">
   <template>
     <style include="app-management-shared-css">
+      #app-list-header {
+        align-items: center;
+        display: flex;
+        padding: 16px 12px;
+      }
+
       #app-list-title {
-        padding: 16px 24px;
+        font-size: var(--cr-title-text_-_font-size);
+        margin-inline-start: 12px;
+      }
+
+      #back-button {
+        margin-inline-start: 0;
       }
 
       #collapse {
@@ -22,7 +33,12 @@
       }
     </style>
     <div class="card-container">
-      <div id="app-list-title" class="header-text">[[listTitle]]</div>
+      <div id="app-list-header">
+        <cr-icon-button class="icon-arrow-back" id="back-button"
+          on-click="onClickBack_" aria-label="$i18n{back}">
+        </cr-icon-button>
+        <div id="app-list-title" class="header-text">[[listTitle]]</div>
+      </div>
       <iron-collapse id="collapse">
         <slot></slot>
       </iron-collapse>

chrome/browser/resources/app_management/expandable_app_list.js

@@ -133,4 +133,11 @@ Polymer({
         loadTimeData.getString('lessApps') :
         loadTimeData.getStringF('moreApps', numApps - this.collapsedSize);
   },
+
+  onClickBack_: function() {
+    this.dispatchEvent(new CustomEvent('click-back-button', {
+      bubbles: true,
+      composed: true,
+    }));
+  }
 });

chrome/browser/resources/app_management/main_view.js

@@ -37,6 +37,10 @@ Polymer({
     },
   },
 
+  listeners: {
+    'click-back-button': 'onClickBackButton',
+  },
+
   attached: function() {
     this.watch('apps_', state => state.apps);
     this.watch('notificationAppIds_', state => state.notifications.allowedIds);
@@ -54,6 +58,11 @@ Polymer({
                                 assert(a.title), assert(b.title)));
   },
 
+  /** @private */
+  onClickBackButton: function() {
+    window.location.href = `chrome://settings`;
+  },
+
   /** @private */
   onClickNotificationSublabel_: function() {
     this.dispatch(app_management.actions.changePage(PageType.NOTIFICATIONS));

chrome/browser/resources/settings/app_management_page/app_management_page.js

@@ -12,11 +12,6 @@ Polymer({
 
   /** @private */
   onManageAppsClick_: function() {
-    const host = window.location.hostname;
-    if (host.includes('settings')) {
-      window.location.href = `chrome://app-management?ref=${host}`;
-    } else {
-      window.location.href = 'chrome://app-management';
-    }
+    window.location.href = 'chrome://app-management';
   },
 });