BASELINE: Update Chromium to 116.0.5845.183

Change-Id: Iaaf57e02c218c93993a5044c659b63674e2c8a12
Reviewed-on: https://codereview.qt-project.org/c/qt/qtwebengine-chromium/+/512320
Reviewed-by: Allan Sandfeld Jensen <allan.jensen@qt.io>

24 files changed, 467 insertions, 95 deletions

diff --git a/chromium/chrome/browser/resources/extensions/BUILD.gn b/chromium/chrome/browser/resources/extensions/BUILD.gn
index c8681afd211..7904d4b86e9 100644
--- a/chromium/chrome/browser/resources/extensions/BUILD.gn
+++ b/chromium/chrome/browser/resources/extensions/BUILD.gn
@@ -35,6 +35,7 @@ build_webui("build") {
     "pack_dialog.ts",
     "pack_dialog_alert.ts",
     "restricted_sites_dialog.ts",
+    "review_panel.ts",
     "runtime_host_permissions.ts",
     "runtime_hosts_dialog.ts",
     "shortcut_input.ts",
diff --git a/chromium/chrome/browser/resources/extensions/activity_log/activity_log.ts b/chromium/chrome/browser/resources/extensions/activity_log/activity_log.ts
index c40b8b810ae..d788b92a2ea 100644
--- a/chromium/chrome/browser/resources/extensions/activity_log/activity_log.ts
+++ b/chromium/chrome/browser/resources/extensions/activity_log/activity_log.ts
@@ -14,7 +14,6 @@ import '../strings.m.js';
 import '../shared_style.css.js';
 import '../shared_vars.css.js';
 
-import {CrContainerShadowMixin} from 'chrome://resources/cr_elements/cr_container_shadow_mixin.js';
 import {focusWithoutInk} from 'chrome://resources/js/focus_without_ink.js';
 import {I18nMixin} from 'chrome://resources/cr_elements/i18n_mixin.js';
 import {loadTimeData} from 'chrome://resources/js/load_time_data.js';
@@ -54,8 +53,7 @@ export interface ExtensionsActivityLogElement {
   };
 }
 
-const ExtensionsActivityLogElementBase =
-    I18nMixin(CrContainerShadowMixin(PolymerElement));
+const ExtensionsActivityLogElementBase = I18nMixin(PolymerElement);
 
 export class ExtensionsActivityLogElement extends
     ExtensionsActivityLogElementBase {
diff --git a/chromium/chrome/browser/resources/extensions/detail_view.html b/chromium/chrome/browser/resources/extensions/detail_view.html
index 69c2c574a3e..4f5ae82e37f 100644
--- a/chromium/chrome/browser/resources/extensions/detail_view.html
+++ b/chromium/chrome/browser/resources/extensions/detail_view.html
@@ -148,7 +148,6 @@
     width: var(--cr-icon-size);
   }
 </style>
-<div id="cr-container-shadow-top" class="cr-container-shadow has-shadow"></div>
 <div class="page-container" id="container">
   <div class="page-content">
     <div class="page-header">
@@ -246,6 +245,12 @@
         <iron-icon class="warning-icon" icon="cr:warning"></iron-icon>
         <span>$i18n{updateRequiredByPolicy}</span>
       </div>
+      <div class="cr-row continuation warning"
+          id="published-in-store-required-warning"
+          hidden$="[[!data.disableReasons.publishedInStoreRequired]]">
+        <iron-icon class="warning-icon" icon="cr:warning"></iron-icon>
+        <span>$i18n{publishedInStoreRequiredByPolicy}</span>
+      </div>
     </div>
     <div id="allowlist-warning" class="cr-row continuation"
         hidden$="[[!showAllowlistWarning_(data.*)]]">
diff --git a/chromium/chrome/browser/resources/extensions/detail_view.ts b/chromium/chrome/browser/resources/extensions/detail_view.ts
index bcd393c4444..be3d1225074 100644
--- a/chromium/chrome/browser/resources/extensions/detail_view.ts
+++ b/chromium/chrome/browser/resources/extensions/detail_view.ts
@@ -186,6 +186,7 @@ export class ExtensionsDetailViewElement extends
     return this.data.disableReasons.corruptInstall ||
         this.data.disableReasons.suspiciousInstall ||
         this.data.disableReasons.updateRequired || !!this.data.blacklistText ||
+        this.data.disableReasons.publishedInStoreRequired ||
         this.data.runtimeWarnings.length > 0;
   }
 
diff --git a/chromium/chrome/browser/resources/extensions/error_page.ts b/chromium/chrome/browser/resources/extensions/error_page.ts
index 3b5bdf48066..cad5df0eb7c 100644
--- a/chromium/chrome/browser/resources/extensions/error_page.ts
+++ b/chromium/chrome/browser/resources/extensions/error_page.ts
@@ -14,7 +14,6 @@ import 'chrome://resources/polymer/v3_0/paper-styles/color.js';
 import './code_section.js';
 import './shared_style.css.js';
 
-import {CrContainerShadowMixin} from 'chrome://resources/cr_elements/cr_container_shadow_mixin.js';
 import {assert, assertNotReached} from 'chrome://resources/js/assert_ts.js';
 import {FocusOutlineManager} from 'chrome://resources/js/focus_outline_manager.js';
 import {focusWithoutInk} from 'chrome://resources/js/focus_without_ink.js';
@@ -75,9 +74,7 @@ export interface ExtensionsErrorPageElement {
   };
 }
 
-const ExtensionsErrorPageElementBase = CrContainerShadowMixin(PolymerElement);
-
-export class ExtensionsErrorPageElement extends ExtensionsErrorPageElementBase {
+export class ExtensionsErrorPageElement extends PolymerElement {
   static get is() {
     return 'extensions-error-page';
   }
diff --git a/chromium/chrome/browser/resources/extensions/extensions.html b/chromium/chrome/browser/resources/extensions/extensions.html
index 37865c83d10..233f1a5b296 100644
--- a/chromium/chrome/browser/resources/extensions/extensions.html
+++ b/chromium/chrome/browser/resources/extensions/extensions.html
@@ -1,6 +1,6 @@
 <!doctype html>
 <html dir="$i18n{textdirection}" lang="$i18n{language}"
-    class="loading $i18n{loadTimeClasses}">
+    class="loading $i18n{loadTimeClasses}" $i18n{chromeRefresh2023Attribute}>
 <head>
   <meta charset="utf8">
   <meta name="color-scheme" content="light dark">
diff --git a/chromium/chrome/browser/resources/extensions/extensions.ts b/chromium/chrome/browser/resources/extensions/extensions.ts
index 915b5517fa2..20807fb9ca9 100644
--- a/chromium/chrome/browser/resources/extensions/extensions.ts
+++ b/chromium/chrome/browser/resources/extensions/extensions.ts
@@ -6,6 +6,7 @@ import './manager.js';
 
 export {CrCheckboxElement} from 'chrome://resources/cr_elements/cr_checkbox/cr_checkbox.js';
 export {getToastManager} from 'chrome://resources/cr_elements/cr_toast/cr_toast_manager.js';
+export {PluralStringProxyImpl} from 'chrome://resources/js/plural_string_proxy.js';
 export {IronIconElement} from 'chrome://resources/polymer/v3_0/iron-icon/iron-icon.js';
 export {ActivityLogExtensionPlaceholder, ExtensionsActivityLogElement} from './activity_log/activity_log.js';
 export {ActivityLogHistoryElement, ActivityLogPageState} from './activity_log/activity_log_history.js';
@@ -31,6 +32,7 @@ export {ExtensionsOptionsDialogElement, OptionsDialogMaxHeight, OptionsDialogMin
 export {ExtensionsPackDialogElement, PackDialogDelegate} from './pack_dialog.js';
 export {ExtensionsPackDialogAlertElement} from './pack_dialog_alert.js';
 export {ExtensionsRestrictedSitesDialogElement} from './restricted_sites_dialog.js';
+export {ExtensionsReviewPanelElement} from './review_panel.js';
 export {ExtensionsRuntimeHostPermissionsElement} from './runtime_host_permissions.js';
 export {ExtensionsRuntimeHostsDialogElement, getMatchingUserSpecifiedSites, getPatternFromSite} from './runtime_hosts_dialog.js';
 export {Service, ServiceInterface} from './service.js';
diff --git a/chromium/chrome/browser/resources/extensions/item_list.html b/chromium/chrome/browser/resources/extensions/item_list.html
index a36e49a0ba8..49a48fa68ba 100644
--- a/chromium/chrome/browser/resources/extensions/item_list.html
+++ b/chromium/chrome/browser/resources/extensions/item_list.html
@@ -7,7 +7,6 @@
   #container {
     box-sizing: border-box;
     height: 100%;
-    overflow: overlay;
   }
 
   #content-wrapper {
@@ -41,6 +40,11 @@
         var(--grid-gutter) * var(--max-columns));
   }
 
+  .items-container.review-panel-container :first-child {
+    grid-column: 1 / -1;
+    padding-bottom: 20px;
+  }
+
   #checkup-container {
     grid-column: 1 / -1;
     /* The checkup card should be at least as tall as an extensions item card.*/
@@ -80,6 +84,12 @@
 <div id="container">
   <managed-footnote hidden="[[filter]]"></managed-footnote>
   <div id="content-wrapper" style="--max-columns: [[maxColumns_]];">
+    <div class="items-container review-panel-container">
+      <template is="dom-if" if="[[showSafetyCheckReviewPanel_]]">
+        <extensions-review-panel extensions="[[extensions]]" delegate="[[delegate]]">
+        </extensions-review-panel>
+      </template>
+    </div>
     <div id="no-items" class="empty-list-message"
         hidden$="[[!shouldShowEmptyItemsMessage_(
             apps.length, extensions.length)]]">
diff --git a/chromium/chrome/browser/resources/extensions/item_list.ts b/chromium/chrome/browser/resources/extensions/item_list.ts
index ab09b94c841..c50ddec2b61 100644
--- a/chromium/chrome/browser/resources/extensions/item_list.ts
+++ b/chromium/chrome/browser/resources/extensions/item_list.ts
@@ -5,9 +5,10 @@
 import 'chrome://resources/cr_components/managed_footnote/managed_footnote.js';
 import './item.js';
 import './shared_style.css.js';
+import './review_panel.js';
 
-import {CrContainerShadowMixin} from 'chrome://resources/cr_elements/cr_container_shadow_mixin.js';
 import {I18nMixin} from 'chrome://resources/cr_elements/i18n_mixin.js';
+import {loadTimeData} from 'chrome://resources/js/load_time_data.js';
 import {IronA11yAnnouncer} from 'chrome://resources/polymer/v3_0/iron-a11y-announcer/iron-a11y-announcer.js';
 import {PolymerElement} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';
 
@@ -16,8 +17,7 @@ import {getTemplate} from './item_list.html.js';
 
 type Filter = (info: chrome.developerPrivate.ExtensionInfo) => boolean;
 
-const ExtensionsItemListElementBase =
-    I18nMixin(CrContainerShadowMixin(PolymerElement));
+const ExtensionsItemListElementBase = I18nMixin(PolymerElement);
 
 export class ExtensionsItemListElement extends ExtensionsItemListElementBase {
   static get is() {
@@ -63,6 +63,11 @@ export class ExtensionsItemListElement extends ExtensionsItemListElementBase {
         type: Number,
         value: 0,
       },
+
+      showSafetyCheckReviewPanel_: {
+        type: Boolean,
+        value: () => loadTimeData.getBoolean('safetyCheckShowReviewPanel'),
+      },
     };
   }
 
@@ -75,6 +80,7 @@ export class ExtensionsItemListElement extends ExtensionsItemListElementBase {
   private maxColumns_: number;
   private shownAppsCount_: number;
   private shownExtensionsCount_: number;
+  private showSafetyCheckReviewPanel_: boolean;
 
   getDetailsButton(id: string): HTMLElement|null {
     const item =
diff --git a/chromium/chrome/browser/resources/extensions/item_util.ts b/chromium/chrome/browser/resources/extensions/item_util.ts
index be65cf5e8c2..69b62520706 100644
--- a/chromium/chrome/browser/resources/extensions/item_util.ts
+++ b/chromium/chrome/browser/resources/extensions/item_util.ts
@@ -63,6 +63,7 @@ export function userCanChangeEnablement(
   if (item.disableReasons.corruptInstall ||
       item.disableReasons.suspiciousInstall ||
       item.disableReasons.updateRequired ||
+      item.disableReasons.publishedInStoreRequired ||
       item.disableReasons.blockedByPolicy) {
     return false;
   }
diff --git a/chromium/chrome/browser/resources/extensions/keyboard_shortcuts.html b/chromium/chrome/browser/resources/extensions/keyboard_shortcuts.html
index 0aadb5f5093..8b706bd6e33 100644
--- a/chromium/chrome/browser/resources/extensions/keyboard_shortcuts.html
+++ b/chromium/chrome/browser/resources/extensions/keyboard_shortcuts.html
@@ -20,7 +20,6 @@
   #container {
     box-sizing: border-box;
     height: 100%;
-    overflow: overlay;
     padding-top: 24px;
   }
 
diff --git a/chromium/chrome/browser/resources/extensions/keyboard_shortcuts.ts b/chromium/chrome/browser/resources/extensions/keyboard_shortcuts.ts
index 7bf7d0807f6..284b8b0bbf4 100644
--- a/chromium/chrome/browser/resources/extensions/keyboard_shortcuts.ts
+++ b/chromium/chrome/browser/resources/extensions/keyboard_shortcuts.ts
@@ -8,7 +8,6 @@ import 'chrome://resources/cr_elements/md_select.css.js';
 import 'chrome://resources/polymer/v3_0/paper-styles/color.js';
 import './shortcut_input.js';
 
-import {CrContainerShadowMixin} from 'chrome://resources/cr_elements/cr_container_shadow_mixin.js';
 import {I18nMixin} from 'chrome://resources/cr_elements/i18n_mixin.js';
 import {PolymerElement} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';
 
@@ -24,8 +23,7 @@ interface RepeaterEvent<T> extends CustomEvent {
   };
 }
 
-const ExtensionsKeyboardShortcutsElementBase =
-    I18nMixin(CrContainerShadowMixin(PolymerElement));
+const ExtensionsKeyboardShortcutsElementBase = I18nMixin(PolymerElement);
 
 // The UI to display and manage keyboard shortcuts set for extension commands.
 export class ExtensionsKeyboardShortcutsElement extends
diff --git a/chromium/chrome/browser/resources/extensions/manager.html b/chromium/chrome/browser/resources/extensions/manager.html
index ee1891227ed..13332ad9947 100644
--- a/chromium/chrome/browser/resources/extensions/manager.html
+++ b/chromium/chrome/browser/resources/extensions/manager.html
@@ -1,4 +1,4 @@
-<style include="cr-hidden-style">
+<style include="cr-hidden-style shared-style">
   :host {
     color: var(--cr-primary-text-color);
     display: flex;
@@ -7,28 +7,71 @@
     --cr-toolbar-field-width: 680px;
   }
 
-  extensions-sidebar {
-    flex-basis: 256px;
-  }
-
   #viewManager {
-    flex: 1;
+    flex: 1 1 var(--cr-toolbar-field-width);
+    height: 100%;
     position: relative;
   }
 
+  @media (min-width:1650px) {
+    #viewManager:has(extensions-item-list.active) {
+      /* The flex basis is wider for the item list view so more items can be
+         shown per row. This value pertains to 3 extension items shown per
+         row. */
+      flex-basis: 1400px;
+    }
+  }
+
+  @media (max-width:1649px) {
+    #viewManager:has(extensions-item-list.active) {
+      /* The flex basis is wider for the item list view so more items can be
+         shown per row. This value pertains to 2 extension items shown per
+         row, and is lower than the above value so extension columns will be
+         more centered on the screen. */
+      flex-basis: 950px;
+    }
+  }
+
   extensions-item {
     display: inline-block;
   }
+
+  #container {
+    align-items: flex-start;
+    display: flex;
+    flex: 1;
+    overflow: overlay;
+    position: relative;
+  }
+
+  #left {
+    height: 100%;
+    min-width: var(--sidebar-width);
+    position: sticky;
+    top: 0;
+  }
+
+  #left extensions-sidebar {
+    max-height: 100%;
+    overflow: auto;
+    overscroll-behavior: contain;
+  }
+
+  #left,
+  #right {
+    flex: 1 1 0;
+  }
 </style>
 <extensions-drop-overlay drag-enabled="[[inDevMode]]">
 </extensions-drop-overlay>
-<extensions-toolbar in-dev-mode="[[inDevMode]]"
+<extensions-toolbar id="toolbar" in-dev-mode="[[inDevMode]]"
     can-load-unpacked="[[canLoadUnpacked]]"
     is-child-account="[[isChildAccount_]]"
     dev-mode-controlled-by-policy="[[devModeControlledByPolicy]]"
-    delegate="[[delegate]]" on-cr-toolbar-menu-tap="onMenuButtonClick_"
+    delegate="[[delegate]]" on-cr-toolbar-menu-click="onMenuButtonClick_"
     on-search-changed="onFilterChanged_"
     extensions="[[extensions_]]"
+    narrow="{{narrow_}}"
 <if expr="chromeos_ash">
     on-kiosk-tap="onKioskClick_"
     kiosk-enabled="[[kioskEnabled_]]"
@@ -39,69 +82,76 @@
   <cr-drawer id="drawer" heading="$i18n{toolbarTitle}"
       align="$i18n{textdirection}" on-close="onDrawerClose_">
     <div slot="body">
-      <extensions-sidebar id="sidebar"
-          enable-enhanced-site-controls="[[enableEnhancedSiteControls]]"
-          on-close-drawer="onCloseDrawer_">
+      <extensions-sidebar on-close-drawer="onCloseDrawer_"
+          enable-enhanced-site-controls="[[enableEnhancedSiteControls]]">
       </extensions-sidebar>
     </div>
   </cr-drawer>
 </template>
-<cr-view-manager id="viewManager" role="main">
-  <extensions-item-list id="items-list" delegate="[[delegate]]"
-      in-dev-mode="[[inDevMode]]" filter="[[filter]]"
-      hidden$="[[!didInitPage_]]" slot="view" apps="[[apps_]]"
-      extensions="[[extensions_]]"
-      on-show-install-warnings="onShowInstallWarnings_">
-  </extensions-item-list>
-  <cr-lazy-render id="details-view">
-    <template>
-      <extensions-detail-view delegate="[[delegate]]" slot="view"
-          in-dev-mode="[[inDevMode]]"
-          enable-enhanced-site-controls="[[enableEnhancedSiteControls]]"
-          from-activity-log="[[fromActivityLog_]]"
-          show-activity-log="[[showActivityLog]]"
-          incognito-available="[[incognitoAvailable_]]"
-          data="[[detailViewItem_]]">
-      </extensions-detail-view>
-    </template>
-  </cr-lazy-render>
-  <cr-lazy-render id="activity-log">
-    <template>
-      <extensions-activity-log delegate="[[delegate]]" slot="view"
-          extension-info="[[activityLogItem_]]">
-      </extensions-activity-log>
-    </template>
-  </cr-lazy-render>
-  <cr-lazy-render id="site-permissions">
-    <template>
-      <extensions-site-permissions delegate="[[delegate]]" slot="view"
-          extensions="[[extensions_]]"
-          enable-enhanced-site-controls="[[enableEnhancedSiteControls]]">
-      </extensions-site-permissions>
-    </template>
-  </cr-lazy-render>
-  <cr-lazy-render id="site-permissions-by-site">
-    <template>
-      <extensions-site-permissions-by-site delegate="[[delegate]]" slot="view"
-          extensions="[[extensions_]]">
-      </extensions-site-permissions-by-site>
-    </template>
-  </cr-lazy-render>
-  <cr-lazy-render id="keyboard-shortcuts">
-    <template>
-      <extensions-keyboard-shortcuts delegate="[[delegate]]" slot="view"
-          items="[[extensions_]]">
-      </extensions-keyboard-shortcuts>
-    </template>
-  </cr-lazy-render>
-  <cr-lazy-render id="error-page">
-    <template>
-      <extensions-error-page data="[[errorPageItem_]]" slot="view"
-          delegate="[[delegate]]" in-dev-mode="[[inDevMode]]">
-      </extensions-error-page>
-    </template>
-  </cr-lazy-render>
-</cr-view-manager>
+<div id="container">
+  <div id="left" hidden$="[[narrow_]]">
+    <extensions-sidebar on-close-drawer="onCloseDrawer_"
+        enable-enhanced-site-controls="[[enableEnhancedSiteControls]]">
+    </extensions-sidebar>
+  </div>
+  <cr-view-manager id="viewManager" role="main">
+    <extensions-item-list id="items-list" delegate="[[delegate]]"
+        in-dev-mode="[[inDevMode]]" filter="[[filter]]"
+        hidden$="[[!didInitPage_]]" slot="view" apps="[[apps_]]"
+        extensions="[[extensions_]]"
+        on-show-install-warnings="onShowInstallWarnings_">
+    </extensions-item-list>
+    <cr-lazy-render id="details-view">
+      <template>
+        <extensions-detail-view delegate="[[delegate]]" slot="view"
+            in-dev-mode="[[inDevMode]]"
+            enable-enhanced-site-controls="[[enableEnhancedSiteControls]]"
+            from-activity-log="[[fromActivityLog_]]"
+            show-activity-log="[[showActivityLog]]"
+            incognito-available="[[incognitoAvailable_]]"
+            data="[[detailViewItem_]]">
+        </extensions-detail-view>
+      </template>
+    </cr-lazy-render>
+    <cr-lazy-render id="activity-log">
+      <template>
+        <extensions-activity-log delegate="[[delegate]]" slot="view"
+            extension-info="[[activityLogItem_]]">
+        </extensions-activity-log>
+      </template>
+    </cr-lazy-render>
+    <cr-lazy-render id="site-permissions">
+      <template>
+        <extensions-site-permissions delegate="[[delegate]]" slot="view"
+            extensions="[[extensions_]]"
+            enable-enhanced-site-controls="[[enableEnhancedSiteControls]]">
+        </extensions-site-permissions>
+      </template>
+    </cr-lazy-render>
+    <cr-lazy-render id="site-permissions-by-site">
+      <template>
+        <extensions-site-permissions-by-site delegate="[[delegate]]" slot="view"
+            extensions="[[extensions_]]">
+        </extensions-site-permissions-by-site>
+      </template>
+    </cr-lazy-render>
+    <cr-lazy-render id="keyboard-shortcuts">
+      <template>
+        <extensions-keyboard-shortcuts delegate="[[delegate]]" slot="view"
+            items="[[extensions_]]">
+        </extensions-keyboard-shortcuts>
+      </template>
+    </cr-lazy-render>
+    <cr-lazy-render id="error-page">
+      <template>
+        <extensions-error-page data="[[errorPageItem_]]" slot="view"
+            delegate="[[delegate]]" in-dev-mode="[[inDevMode]]">
+        </extensions-error-page>
+      </template>
+    </cr-lazy-render>
+  </cr-view-manager>
+  <div id="right" hidden$="[[narrow_]]"></div>
+</div>
 <template is="dom-if" if="[[showOptionsDialog_]]" restamp>
   <extensions-options-dialog id="options-dialog"
       on-close="onOptionsDialogClose_">
diff --git a/chromium/chrome/browser/resources/extensions/manager.ts b/chromium/chrome/browser/resources/extensions/manager.ts
index 6df555b997c..19e781ba4b3 100644
--- a/chromium/chrome/browser/resources/extensions/manager.ts
+++ b/chromium/chrome/browser/resources/extensions/manager.ts
@@ -19,6 +19,7 @@ import './item_util.js';
 import './keyboard_shortcuts.js';
 import './load_error.js';
 import './options_dialog.js';
+import './shared_vars.css.js';
 import './sidebar.js';
 import './site_permissions.js';
 import './site_permissions_by_site.js';
@@ -28,6 +29,7 @@ import './kiosk_dialog.js';
 
 // </if>
 
+import {CrContainerShadowMixin} from 'chrome://resources/cr_elements/cr_container_shadow_mixin.js';
 import {CrViewManagerElement} from 'chrome://resources/cr_elements/cr_view_manager/cr_view_manager.js';
 import {assert, assertNotReached} from 'chrome://resources/js/assert_ts.js';
 import {loadTimeData} from 'chrome://resources/js/load_time_data.js';
@@ -43,6 +45,7 @@ import {KioskBrowserProxyImpl} from './kiosk_browser_proxy.js';
 import {getTemplate} from './manager.html.js';
 import {Dialog, navigation, Page, PageState} from './navigation_helper.js';
 import {Service} from './service.js';
+import {ExtensionsToolbarElement} from './toolbar.js';
 
 /**
  * Compares two extensions to determine which should come first in the list.
@@ -80,12 +83,17 @@ declare global {
 
 export interface ExtensionsManagerElement {
   $: {
+    toolbar: ExtensionsToolbarElement,
     viewManager: CrViewManagerElement,
     'items-list': ExtensionsItemListElement,
   };
 }
 
-export class ExtensionsManagerElement extends PolymerElement {
+// TODO(crbug.com/1450101): Always show a top shadow for the DETAILS, ERRORS and
+// SITE_PERMISSIONS_ALL_SITES pages.
+const ExtensionsManagerElementBase = CrContainerShadowMixin(PolymerElement);
+
+export class ExtensionsManagerElement extends ExtensionsManagerElementBase {
   static get is() {
     return 'extensions-manager';
   }
@@ -176,6 +184,11 @@ export class ExtensionsManagerElement extends PolymerElement {
         value: false,
       },
 
+      narrow_: {
+        type: Boolean,
+        observer: 'onNarrowChanged_',
+      },
+
       showDrawer_: Boolean,
 
       showLoadErrorDialog_: Boolean,
@@ -222,6 +235,7 @@ export class ExtensionsManagerElement extends PolymerElement {
   private extensions_: chrome.developerPrivate.ExtensionInfo[];
   private apps_: chrome.developerPrivate.ExtensionInfo[];
   private didInitPage_: boolean;
+  private narrow_: boolean;
   private showDrawer_: boolean;
   private showLoadErrorDialog_: boolean;
   private showInstallWarningsDialog_: boolean;
@@ -335,6 +349,16 @@ export class ExtensionsManagerElement extends PolymerElement {
     this.pageInitializedResolver_.resolve();
   }
 
+  private onNarrowChanged_() {
+    const drawer = this.shadowRoot!.querySelector('cr-drawer');
+    if (!this.narrow_ && drawer && drawer.open) {
+      drawer.close();
+    }
+
+    // TODO(crbug.com/c/1451985): Handle changing focus if focus is on the
+    // sidebar or menu when it's about to disappear when `this.narrow_` changes.
+  }
+
   private onItemStateChanged_(eventData: chrome.developerPrivate.EventData) {
     const EventType = chrome.developerPrivate.EventType;
     switch (eventData.event_type) {
@@ -596,7 +620,7 @@ export class ExtensionsManagerElement extends PolymerElement {
     }
 
     if (fromPage !== toPage) {
-      this.$.viewManager.switchView(toPage);
+      this.$.viewManager.switchView(toPage, 'no-animation', 'no-animation');
     }
 
     if (newPage.subpage) {
diff --git a/chromium/chrome/browser/resources/extensions/review_panel.html b/chromium/chrome/browser/resources/extensions/review_panel.html
new file mode 100644
index 00000000000..c4115915552
--- /dev/null
+++ b/chromium/chrome/browser/resources/extensions/review_panel.html
@@ -0,0 +1,123 @@
+<style include="cr-shared-style shared-style">
+  .header-group-wrapper {
+    flex: 1;
+    margin-inline-start: 15px;
+  }
+
+  .header-with-icon {
+    align-items: center;
+    display: flex;
+    padding: 15px 30px 15px 20px;
+  }
+
+  .header-with-icon h3 {
+    margin: 5px 0 5px 0;
+  }
+
+  /** TODO(crbug.com/1432194): Clean up the CSS with the shared styles added
+   * in https://crrev.com/c/4579629 once its in. */
+  .header-with-icon iron-icon {
+    border-radius: 50%;
+    height: var(--cr-icon-size);
+    padding: 6px;
+    width: var(--cr-icon-size);
+  }
+
+  .text-container {
+    padding-left: 20px;
+  }
+
+  .header-icon {
+    background-color: var(--google-blue-50);
+    fill: var(--google-blue-600);
+  }
+
+  @media (prefers-color-scheme: dark) {
+    .header-icon {
+      background-color: var(--google-blue-300);
+    }
+  }
+
+  #extension-icon {
+    height: var(--cr-icon-size);
+    width: var(--cr-icon-size);
+  }
+
+  .extension-row {
+    padding-inline-end: 10px;
+    padding-inline-start: 50px;
+  }
+
+  .extension-row.cr-row {
+    border: none;
+  }
+
+  .display-name {
+    flex: 1;
+    margin: 8px 16px;
+    max-width: 100%;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  .bulk-action-button {
+    margin-inline-start: auto;
+  }
+</style>
+<cr-expand-button class="cr-row first" no-hover
+    id="expandButton"
+    expanded="{{unsafeExtensionsReviewListExpanded_}}">
+  <div class="header-with-icon" id="reviewPanelContainer">
+    <iron-icon aria-hidden="true" icon="cr:extension" class="header-icon">
+      <!-- TODO(crbug.com/1432194):Will replace this
+        info icon with the correct header icon -->
+    </iron-icon>
+    <div class="text-container">
+      <h3 id="headingText">[[headerString_]]</h3>
+      <div
+        class="cr-secondary-text"
+        id="secondaryText">
+          [[subtitleString_]]
+      </div>
+    </div>
+  </div>
+</cr-expand-button>
+<iron-collapse class="extension-list"
+    opened="[[unsafeExtensionsReviewListExpanded_]]">
+  <template is="dom-repeat" items="[[unsafeExtensions_]]">
+    <div class="extension-row cr-row">
+      <img id="extension-icon" src="[[item.iconUrl]]" role="presentation">
+      <div class="display-name text-elide">
+        <div class="extension-representation">[[item.name]]</div>
+        <div class="secondary">
+          <!-- TODO(crbug.com/1432194): Add secondary string
+            (trigger warnings). -->
+          Placeholder for the trigger text.
+        </div>
+      </div>
+      <cr-icon-button iron-icon="cr:delete"
+          actionable on-click="onRemoveExtensionClick_">
+      </cr-icon-button>
+      <cr-icon-button class="icon-more-vert header-aligned-button"
+        id="makeExceptionMenuButton"
+        on-click="onMakeExceptionMenuClick_"
+        focus-type="makeExceptionMenuButton"></cr-icon-button>
+    </div>
+  </template>
+  <div class="cr-row first">
+    <cr-button
+        class="action-button bulk-action-button"
+        id="removeAllButton"
+        on-click="onRemoveAllClick_">
+          $i18n{safetyCheckRemoveAll}
+    </cr-button>
+  </div>
+</iron-collapse>
+<cr-action-menu id="makeExceptionMenu">
+  <button id="menuKeepExtension"
+    class="dropdown-item"
+    on-click="onKeepExtensionClick_">
+      $i18n{safetyCheckKeepExtension}
+  </button>
+</cr-action-menu>
diff --git a/chromium/chrome/browser/resources/extensions/review_panel.ts b/chromium/chrome/browser/resources/extensions/review_panel.ts
new file mode 100644
index 00000000000..4c6832decd2
--- /dev/null
+++ b/chromium/chrome/browser/resources/extensions/review_panel.ts
@@ -0,0 +1,139 @@
+// Copyright 2023 The Chromium Authors
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+import 'chrome://resources/cr_elements/cr_expand_button/cr_expand_button.js';
+import 'chrome://resources/cr_elements/cr_shared_style.css.js';
+import 'chrome://resources/polymer/v3_0/iron-collapse/iron-collapse.js';
+import './shared_style.css.js';
+
+import {CrActionMenuElement} from 'chrome://resources/cr_elements/cr_action_menu/cr_action_menu.js';
+import {CrButtonElement} from 'chrome://resources/cr_elements/cr_button/cr_button.js';
+import {CrExpandButtonElement} from 'chrome://resources/cr_elements/cr_expand_button/cr_expand_button.js';
+import {PluralStringProxyImpl} from 'chrome://resources/js/plural_string_proxy.js';
+import {DomRepeatEvent, PolymerElement} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';
+
+import {ItemDelegate} from './item.js';
+import {getTemplate} from './review_panel.html.js';
+
+export interface ExtensionsReviewPanelElement {
+  $: {
+    makeExceptionMenu: CrActionMenuElement,
+    reviewPanelContainer: HTMLDivElement,
+    expandButton: CrExpandButtonElement,
+    headingText: HTMLElement,
+    secondaryText: HTMLElement,
+    removeAllButton: CrButtonElement,
+  };
+}
+
+export class ExtensionsReviewPanelElement extends PolymerElement {
+  static get is() {
+    return 'extensions-review-panel';
+  }
+
+  static get template() {
+    return getTemplate();
+  }
+
+  static get properties() {
+    return {
+      delegate: Object,
+
+      extensions: {
+        type: Array,
+        notify: true,
+      },
+
+      /**
+       * The string for the primary header label.
+       */
+      headerString_: String,
+
+      /**
+       * The string for secondary text under the header string.
+       */
+      subtitleString_: String,
+
+      /**
+       * List of potentially unsafe extensions. This list being empty
+       * indicates that there are no unsafe extensions to review.
+       */
+      unsafeExtensions_: Array,
+
+      /**
+       * Indicates if the list of unsafe extensions is expanded or collapsed.
+       */
+      unsafeExtensionsReviewListExpanded_: {
+        type: Boolean,
+        value: true,
+      },
+    };
+  }
+
+  static get observers() {
+    return ['onExtensionsChanged_(extensions.*)'];
+  }
+
+  delegate: ItemDelegate;
+  extensions: chrome.developerPrivate.ExtensionInfo[];
+  private unsafeExtensions_: chrome.developerPrivate.ExtensionInfo[]|null;
+  private headerString_: string;
+  private subtitleString_: string;
+  private unsafeExtensionsReviewListExpanded_: boolean;
+
+  private async onExtensionsChanged_() {
+    this.unsafeExtensions_ = this.getUnsafeExtensions_(this.extensions);
+    this.headerString_ =
+        await PluralStringProxyImpl.getInstance().getPluralString(
+            'safetyCheckTitle', this.unsafeExtensions_.length);
+    this.subtitleString_ =
+        await PluralStringProxyImpl.getInstance().getPluralString(
+            'safetyCheckDescription', this.unsafeExtensions_.length);
+  }
+
+  private getUnsafeExtensions_(extensions:
+                                   chrome.developerPrivate.ExtensionInfo[]):
+      chrome.developerPrivate.ExtensionInfo[] {
+    // TODO(crbug.com/1432194): Update this filter criteria when new trigger
+    // texts are added to getExtensionInfo API.
+    return extensions.filter(
+        extension => extension.disableReasons.corruptInstall ||
+            extension.disableReasons.suspiciousInstall ||
+            extension.runtimeWarnings.length || !!extension.blacklistText);
+  }
+
+  /**
+   * Opens the extension action menu.
+   */
+  private onMakeExceptionMenuClick_(e: Event) {
+    this.$.makeExceptionMenu.showAt(e.target as HTMLElement);
+  }
+
+  /**
+   * Acknowledges the extension safety check warning.
+   */
+  private onKeepExtensionClick_() {
+    this.$.makeExceptionMenu.close();
+    // TODO(crbug.com/1432194): Call the private API to keep the extension in
+    // pref.
+  }
+
+  private onRemoveExtensionClick_(
+      e: DomRepeatEvent<chrome.developerPrivate.ExtensionInfo>): void {
+    this.delegate.deleteItem(e.model.item.id);
+  }
+
+  private onRemoveAllExtensions_(): void {
+    // TODO(crbug.com/1432194): Call the private API to remove all extensions.
+  }
+}
+
+declare global {
+  interface HTMLElementTagNameMap {
+    'extensions-review-panel': ExtensionsReviewPanelElement;
+  }
+}
+
+customElements.define(
+    ExtensionsReviewPanelElement.is, ExtensionsReviewPanelElement);
diff --git a/chromium/chrome/browser/resources/extensions/shared_style.css b/chromium/chrome/browser/resources/extensions/shared_style.css
index 1d00f9111a4..e69974fdcd1 100644
--- a/chromium/chrome/browser/resources/extensions/shared_style.css
+++ b/chromium/chrome/browser/resources/extensions/shared_style.css
@@ -59,7 +59,6 @@ a[href] {
 
 .page-container {
   height: 100%;
-  overflow: overlay;
 }
 
 .page-content {
diff --git a/chromium/chrome/browser/resources/extensions/shared_vars.css b/chromium/chrome/browser/resources/extensions/shared_vars.css
index 7c3c0106eef..67ceaef3d6a 100644
--- a/chromium/chrome/browser/resources/extensions/shared_vars.css
+++ b/chromium/chrome/browser/resources/extensions/shared_vars.css
@@ -16,6 +16,7 @@ html {
   --warning-color: rgb(242, 153, 0);
   --extensions-card-height: 160px;
   --separator-gap: 9px;
+  --sidebar-width: 256px;
 }
 
 @media (prefers-color-scheme: dark) {
diff --git a/chromium/chrome/browser/resources/extensions/sidebar.html b/chromium/chrome/browser/resources/extensions/sidebar.html
index 1fe5404d33a..2c382510c96 100644
--- a/chromium/chrome/browser/resources/extensions/sidebar.html
+++ b/chromium/chrome/browser/resources/extensions/sidebar.html
@@ -8,7 +8,7 @@
     justify-content: space-between;
     overflow-x: hidden;
     overflow-y: auto;
-    width: 256px;
+    width: var(--sidebar-width);
   }
 
   @media (prefers-color-scheme: dark) {
@@ -44,7 +44,7 @@
     margin: 8px 0;
   }
 
-  #more-extensions {
+  #moreExtensions {
     align-items: center;
     display: flex;
     justify-content: space-between;
@@ -63,7 +63,7 @@
     $i18n{sidebarExtensions}
     <paper-ripple></paper-ripple>
   </a>
-  <a class="section-item" id="sections-site-permissions"
+  <a class="section-item" id="sectionsSitePermissions"
       hidden="[[!enableEnhancedSiteControls]]"
       href="/sitePermissions" on-click="onLinkClick_"
       data-path="site-permissions">
@@ -78,7 +78,7 @@
 </iron-selector>
 <div>
   <div class="separator"></div>
-  <a class="section-item" id="more-extensions" target="_blank"
+  <a class="section-item" id="moreExtensions" target="_blank"
       href="$i18n{getMoreExtensionsUrl}" on-click="onMoreExtensionsClick_">
     <span>$i18n{openChromeWebStore}</span>
     <div class="cr-icon icon-external"></div>
diff --git a/chromium/chrome/browser/resources/extensions/sidebar.ts b/chromium/chrome/browser/resources/extensions/sidebar.ts
index 9096e709532..375ac5a32e0 100644
--- a/chromium/chrome/browser/resources/extensions/sidebar.ts
+++ b/chromium/chrome/browser/resources/extensions/sidebar.ts
@@ -6,6 +6,7 @@ import 'chrome://resources/cr_elements/cr_hidden_style.css.js';
 import 'chrome://resources/polymer/v3_0/iron-selector/iron-selector.js';
 import 'chrome://resources/polymer/v3_0/paper-ripple/paper-ripple.js';
 import 'chrome://resources/polymer/v3_0/paper-styles/color.js';
+import './shared_vars.css.js';
 
 import {IronSelectorElement} from 'chrome://resources/polymer/v3_0/iron-selector/iron-selector.js';
 import {PolymerElement} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';
@@ -18,6 +19,8 @@ export interface ExtensionsSidebarElement {
     sectionMenu: IronSelectorElement,
     sectionsExtensions: HTMLElement,
     sectionsShortcuts: HTMLElement,
+    sectionsSitePermissions: HTMLElement,
+    moreExtensions: HTMLElement,
   };
 }
 
diff --git a/chromium/chrome/browser/resources/extensions/site_permissions_edit_permissions_dialog.html b/chromium/chrome/browser/resources/extensions/site_permissions_edit_permissions_dialog.html
index ff4ade3c068..78e8f85b398 100644
--- a/chromium/chrome/browser/resources/extensions/site_permissions_edit_permissions_dialog.html
+++ b/chromium/chrome/browser/resources/extensions/site_permissions_edit_permissions_dialog.html
@@ -95,6 +95,7 @@
             <img class="extension-icon" src="[[item.iconUrl]]" alt="">
             <span class="extension-name">[[item.name]]</span>
             <select class="extension-host-access md-select"
+                disabled="[[item.addedByPolicy]]"
                 on-change="onHostAccessChange_"
                 value="[[getExtensionHostAccess_(item.id, item.siteAccess)]]">
               <option value="[[hostAccessEnum_.ON_CLICK]]">
diff --git a/chromium/chrome/browser/resources/extensions/site_permissions_edit_permissions_dialog.ts b/chromium/chrome/browser/resources/extensions/site_permissions_edit_permissions_dialog.ts
index 8d825677d95..ac2b8ce0559 100644
--- a/chromium/chrome/browser/resources/extensions/site_permissions_edit_permissions_dialog.ts
+++ b/chromium/chrome/browser/resources/extensions/site_permissions_edit_permissions_dialog.ts
@@ -17,6 +17,7 @@ import {assert} from 'chrome://resources/js/assert_ts.js';
 import {loadTimeData} from 'chrome://resources/js/load_time_data.js';
 import {DomRepeatEvent, PolymerElement} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';
 
+import {getItemSource, SourceType} from './item_util.js';
 import {getTemplate} from './site_permissions_edit_permissions_dialog.html.js';
 import {SiteSettingsDelegate} from './site_settings_mixin.js';
 import {matchesSubdomains, SUBDOMAIN_SPECIFIER} from './url_util.js';
@@ -26,6 +27,7 @@ interface ExtensionSiteAccessInfo {
   name: string;
   iconUrl: string;
   siteAccess: string;
+  addedByPolicy: boolean;
 }
 
 export interface SitePermissionsEditPermissionsDialogElement {
@@ -203,7 +205,10 @@ export class SitePermissionsEditPermissionsDialogElement extends
     matchingExtensionsInfo.forEach(({id, siteAccess}) => {
       assert(this.extensionsIdToInfo_.has(id));
       const {name, iconUrl} = this.extensionsIdToInfo_.get(id)!;
-      extensionSiteAccessData.push({id, name, iconUrl, siteAccess});
+      const addedByPolicy = getItemSource(this.extensionsIdToInfo_.get(id)!) ===
+          SourceType.POLICY;
+      extensionSiteAccessData.push(
+          {id, name, iconUrl, siteAccess, addedByPolicy});
 
       // Remove the unsaved HostAccess from `unsavedExtensionsIdToHostAccess_`
       // if it is now the same as `siteAccess`.
diff --git a/chromium/chrome/browser/resources/extensions/toolbar.html b/chromium/chrome/browser/resources/extensions/toolbar.html
index f633b878d95..1c0187a24f9 100644
--- a/chromium/chrome/browser/resources/extensions/toolbar.html
+++ b/chromium/chrome/browser/resources/extensions/toolbar.html
@@ -69,9 +69,10 @@
     --cr-toolbar-field-width: 100%;
   }
 </style>
-<cr-toolbar page-name="$i18n{toolbarTitle}" search-prompt="$i18n{search}"
-    clear-label="$i18n{clearSearch}" menu-label="$i18n{mainMenu}" show-menu
-    autofocus narrow-threshold="1000">
+<cr-toolbar id="toolbar" page-name="$i18n{toolbarTitle}"
+    search-prompt="$i18n{search}" clear-label="$i18n{clearSearch}" autofocus
+    menu-label="$i18n{mainMenu}" narrow="{{narrow}}" narrow-threshold="1200"
+    show-menu="[[narrow]]">
   <div class="more-actions">
     <span id="devModeLabel">$i18n{toolbarDevMode}</span>
     <cr-tooltip-icon hidden="[[!shouldDisableDevMode_(
diff --git a/chromium/chrome/browser/resources/extensions/toolbar.ts b/chromium/chrome/browser/resources/extensions/toolbar.ts
index d0c94f52e59..05eca3abab7 100644
--- a/chromium/chrome/browser/resources/extensions/toolbar.ts
+++ b/chromium/chrome/browser/resources/extensions/toolbar.ts
@@ -13,6 +13,7 @@ import './pack_dialog.js';
 
 import {getToastManager} from 'chrome://resources/cr_elements/cr_toast/cr_toast_manager.js';
 import {CrToggleElement} from 'chrome://resources/cr_elements/cr_toggle/cr_toggle.js';
+import {CrToolbarElement} from 'chrome://resources/cr_elements/cr_toolbar/cr_toolbar.js';
 import {I18nMixin} from 'chrome://resources/cr_elements/i18n_mixin.js';
 import {listenOnce} from 'chrome://resources/js/util_ts.js';
 import {PolymerElement} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';
@@ -39,6 +40,7 @@ export interface ExtensionsToolbarElement {
     devMode: CrToggleElement,
     loadUnpacked: HTMLElement,
     packExtensions: HTMLElement,
+    toolbar: CrToolbarElement,
     updateNow: HTMLElement,
 
     // <if expr="chromeos_ash">
@@ -77,6 +79,11 @@ export class ExtensionsToolbarElement extends ExtensionsToolbarElementBase {
       kioskEnabled: Boolean,
       // </if>
 
+      narrow: {
+        type: Boolean,
+        notify: true,
+      },
+
       canLoadUnpacked: Boolean,
 
       expanded_: Boolean,
@@ -99,6 +106,7 @@ export class ExtensionsToolbarElement extends ExtensionsToolbarElementBase {
   kioskEnabled: boolean;
   // </if>
 
+  narrow: boolean;
   canLoadUnpacked: boolean;
 
   private expanded_: boolean;