[NTP][Panorama] Respect themes admin policy

Show a managed dialog popup when the user attempts to reset to classic chrome or change to the themes page if background image is restricted by the admin policy.

screenshot: screenshot/BbZbsfGLJmgiLcj

(cherry picked from commit 6dd982a)

Bug: 1401485
Change-Id: I7acd8137475341a9ab7c613ed430839e584599d6
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/4198002
Reviewed-by: Matthew Denton <mpdenton@chromium.org>
Reviewed-by: Tibor Goldschwendt <tiborg@chromium.org>
Commit-Queue: Riley Tatum <rtatum@google.com>
Cr-Original-Commit-Position: refs/heads/main@{#1097676}
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/4206207
Reviewed-by: Alex Gough <ajgo@chromium.org>
Cr-Commit-Position: refs/branch-heads/5563@{#56}
Cr-Branched-From: 3ac59a6-refs/heads/main@{#1097615}

chrome/browser/resources/side_panel/customize_chrome/appearance.html

@@ -25,6 +25,10 @@
   #thirdPartyLinkButton {
     --cr-icon-image: url('chrome://resources/images/open_in_new.svg');
   }
+
+  managed-dialog {
+    --cr-dialog-width: min(calc(100% - 32px), 512px);
+  }
 </style>
 <customize-chrome-theme-snapshot id="themeSnapshot"
     hidden$="[[!showFirstPartyThemeView_]]">
@@ -48,3 +52,9 @@
     label="$i18n{resetToClassicChrome}"
     on-click="onSetClassicChromeClicked_">
 </customize-chrome-hover-button>
+<template is="dom-if" if="[[showManagedDialog_]]" restamp>
+  <managed-dialog on-close="onManagedDialogClosed_"
+      title="$i18n{managedColorsTitle}"
+      body="$i18n{managedColorsBody}">
+  </managed-dialog>
+</template>

chrome/browser/resources/side_panel/customize_chrome/appearance.ts

@@ -5,6 +5,7 @@
 import './colors.js';
 import './theme_snapshot.js';
 import './hover_button.js';
+import './strings.m.js'; // Required by <managed-dialog>.
 import 'chrome://resources/cr_elements/cr_button/cr_button.js';
 import 'chrome://resources/cr_elements/cr_hidden_style.css.js';
 import 'chrome://resources/cr_elements/cr_icons.css.js';
@@ -64,6 +65,8 @@ export class AppearanceElement extends PolymerElement {
         value: false,
         computed: 'computeShowClassicChromeButton_(theme_)',
       },
+
+      showManagedDialog_: Boolean,
     };
   }
 
@@ -72,6 +75,7 @@ export class AppearanceElement extends PolymerElement {
   private thirdPartyThemeName_: string|null = null;
   private showClassicChromeButton_: boolean;
   private showFirstPartyThemeView_: boolean;
+  private showManagedDialog_: boolean;
 
   private setThemeListenerId_: number|null = null;
 
@@ -127,6 +131,9 @@ export class AppearanceElement extends PolymerElement {
   }
 
   private onEditThemeClicked_() {
+    if (this.handleClickForManagedThemes_()) {
+      return;
+    }
     this.dispatchEvent(new Event('edit-theme-click'));
   }
 
@@ -137,9 +144,24 @@ export class AppearanceElement extends PolymerElement {
   }
 
   private onSetClassicChromeClicked_() {
+    if (this.handleClickForManagedThemes_()) {
+      return;
+    }
     this.pageHandler_.removeBackgroundImage();
     this.pageHandler_.setDefaultColor();
   }
+
+  private onManagedDialogClosed_() {
+    this.showManagedDialog_ = false;
+  }
+
+  private handleClickForManagedThemes_(): boolean {
+    if (!this.theme_ || !this.theme_.backgroundManagedByPolicy) {
+      return false;
+    }
+    this.showManagedDialog_ = true;
+    return true;
+  }
 }
 
 declare global {

chrome/browser/search/background/ntp_custom_background_service.h

@@ -86,7 +86,7 @@ class NtpCustomBackgroundService : public KeyedService,
   void RemoveObserver(NtpCustomBackgroundServiceObserver* observer);
 
   // Returns whether having a custom background is disabled by policy.
-  bool IsCustomBackgroundDisabledByPolicy();
+  virtual bool IsCustomBackgroundDisabledByPolicy();
 
   // Returns whether a custom background has been set by the user.
   bool IsCustomBackgroundSet();

chrome/browser/ui/webui/side_panel/customize_chrome/customize_chrome.mojom

@@ -47,6 +47,8 @@ struct Theme {
   skia.mojom.SkColor color_picker_icon_color;
   // True if the colors are managed by a policy.
   bool colors_managed_by_policy;
+  // True if the background is managed by a policy.
+  bool background_managed_by_policy;
   // Selected collection for daily refresh.
   string? daily_refresh_collection_id;
 };

chrome/browser/ui/webui/side_panel/customize_chrome/customize_chrome_page_handler.cc

@@ -280,6 +280,8 @@ void CustomizeChromePageHandler::UpdateTheme() {
   } else {
     theme->colors_managed_by_policy = false;
   }
+  theme->background_managed_by_policy =
+      ntp_custom_background_service_->IsCustomBackgroundDisabledByPolicy();
   if (theme_service_->UsingExtensionTheme()) {
     const extensions::Extension* theme_extension =
         extensions::ExtensionRegistry::Get(profile_)

chrome/browser/ui/webui/side_panel/customize_chrome/customize_chrome_page_handler_unittest.cc

@@ -178,6 +178,7 @@ class MockNtpCustomBackgroundService : public NtpCustomBackgroundService {
                     const std::string&,
                     const GURL&,
                     const std::string&));
+  MOCK_METHOD0(IsCustomBackgroundDisabledByPolicy, bool());
 };
 
 class MockNtpBackgroundService : public NtpBackgroundService {
@@ -463,6 +464,9 @@ TEST_P(CustomizeChromePageHandlerSetThemeTest, SetTheme) {
       .WillByDefault(testing::Return(false));
   ON_CALL(mock_theme_service(), UsingPolicyTheme())
       .WillByDefault(testing::Return(true));
+  ON_CALL(mock_ntp_custom_background_service_,
+          IsCustomBackgroundDisabledByPolicy())
+      .WillByDefault(testing::Return(true));
   ui::NativeTheme::GetInstanceForNativeUi()->set_use_dark_colors(true);
 
   UpdateTheme();
@@ -485,6 +489,7 @@ TEST_P(CustomizeChromePageHandlerSetThemeTest, SetTheme) {
   EXPECT_EQ(web_contents().GetColorProvider().GetColor(kColorNewTabPageText),
             theme->color_picker_icon_color);
   EXPECT_TRUE(theme->colors_managed_by_policy);
+  EXPECT_TRUE(theme->background_managed_by_policy);
   EXPECT_EQ("test_collection", theme->daily_refresh_collection_id);
 }
 

chrome/test/data/webui/side_panel/customize_chrome/appearance_test.ts

@@ -8,11 +8,13 @@ import 'chrome://customize-chrome-side-panel.top-chrome/appearance.js';
 import {AppearanceElement} from 'chrome://customize-chrome-side-panel.top-chrome/appearance.js';
 import {CustomizeChromePageCallbackRouter, CustomizeChromePageHandlerRemote, CustomizeChromePageRemote} from 'chrome://customize-chrome-side-panel.top-chrome/customize_chrome.mojom-webui.js';
 import {CustomizeChromeApiProxy} from 'chrome://customize-chrome-side-panel.top-chrome/customize_chrome_api_proxy.js';
+import {ManagedDialogElement} from 'chrome://resources/cr_components/managed_dialog/managed_dialog.js';
 import {assertEquals, assertTrue} from 'chrome://webui-test/chai_assert.js';
+import {waitAfterNextRender} from 'chrome://webui-test/polymer_test_util.js';
 import {TestBrowserProxy} from 'chrome://webui-test/test_browser_proxy.js';
 import {eventToPromise} from 'chrome://webui-test/test_util.js';
 
-import {assertNotStyle, assertStyle, createBackgroundImage, createTheme, createThirdPartyThemeInfo, installMock} from './test_support.js';
+import {$$, assertNotStyle, assertStyle, createBackgroundImage, createTheme, createThirdPartyThemeInfo, installMock} from './test_support.js';
 
 suite('AppearanceTest', () => {
   let appearanceElement: AppearanceElement;
@@ -85,6 +87,40 @@ suite('AppearanceTest', () => {
     assertStyle(appearanceElement.$.thirdPartyLinkButton, 'display', 'none');
   });
 
+  test('respects policy for edit theme', async () => {
+    const theme = createTheme();
+    theme.backgroundManagedByPolicy = true;
+    callbackRouterRemote.setTheme(theme);
+    await callbackRouterRemote.$.flushForTesting();
+    await waitAfterNextRender(appearanceElement);
+
+    appearanceElement.$.editThemeButton.click();
+    await waitAfterNextRender(appearanceElement);
+
+    const managedDialog =
+        $$<ManagedDialogElement>(appearanceElement, 'managed-dialog');
+    assertTrue(!!managedDialog);
+    assertTrue(managedDialog.$.dialog.open);
+  });
+
+  test('respects policy for reset', async () => {
+    const theme = createTheme();
+    theme.backgroundManagedByPolicy = true;
+    callbackRouterRemote.setTheme(theme);
+    await callbackRouterRemote.$.flushForTesting();
+    await waitAfterNextRender(appearanceElement);
+
+    appearanceElement.$.setClassicChromeButton.click();
+    await waitAfterNextRender(appearanceElement);
+
+    const managedDialog =
+        $$<ManagedDialogElement>(appearanceElement, 'managed-dialog');
+    assertTrue(!!managedDialog);
+    assertTrue(managedDialog.$.dialog.open);
+    assertEquals(0, handler.getCallCount('setDefaultColor'));
+    assertEquals(0, handler.getCallCount('removeBackgroundImage'));
+  });
+
   suite('third party theme', () => {
     test('3P view shows when 3P theme info is set', async () => {
       const theme = createTheme();

chrome/test/data/webui/side_panel/customize_chrome/test_support.ts

@@ -66,6 +66,7 @@ export function createTheme(systemDarkMode = false): Theme {
     foregroundColor: undefined,
     colorPickerIconColor: {value: 0xffff0000},
     colorsManagedByPolicy: false,
+    backgroundManagedByPolicy: false,
     dailyRefreshCollectionId: undefined,
   };
 }