[Sync] Remove Enable/Disable switch and just use input element for ha…

…ndling custom sync url.

Also show Relauch button and Managed icon when required.

app/brave_settings_strings.grdp

@@ -736,8 +736,8 @@
   <message name="IDS_SETTINGS_BRAVE_SYNC_COULD_NOT_SYNC_ACTION_LABEL" desc="Could not sync devices action label. It is displayed in the case when Brave Sync could not decrypt code words and start work">
     Could not sync Brave on your devices
   </message>
-  <message name="IDS_SETTINGS_BRAVE_CUSTOM_SYNC_URL_ENABLE_LABEL" desc="Label for setting to en/disable Custom sync url feature">
-    Enable custom sync url
+  <message name="IDS_SETTINGS_BRAVE_CUSTOM_SYNC_URL_TITLE" desc="Title for custom sync url">
+    Custom sync url
   </message>
   <message name="IDS_SETTINGS_ENTER_CUSTOM_SYNC_URL" desc="Input label for a custom sync url">
     Enter custom sync url

browser/brave_local_state_prefs.cc

@@ -180,9 +180,6 @@ void RegisterLocalStatePrefs(PrefRegistrySimple* registry) {
   misc_metrics::GeneralBrowserUsage::RegisterPrefs(registry);
 
   playlist::PlaylistServiceFactory::RegisterLocalStatePrefs(registry);
-
-  registry->RegisterBooleanPref(kBraveCustomSyncUrlEnabled, false);
-  registry->RegisterStringPref(kBraveCustomSyncUrl, std::string());
 }
 
 }  // namespace brave

browser/extensions/api/settings_private/brave_prefs_util.cc

@@ -14,6 +14,7 @@
 #include "brave/components/brave_rewards/common/pref_names.h"
 #include "brave/components/brave_shields/content/browser/brave_shields_util.h"
 #include "brave/components/brave_shields/core/common/pref_names.h"
+#include "brave/components/brave_sync/brave_sync_prefs.h"
 #include "brave/components/brave_vpn/common/buildflags/buildflags.h"
 #include "brave/components/brave_wallet/browser/pref_names.h"
 #include "brave/components/brave_wayback_machine/buildflags/buildflags.h"
@@ -227,9 +228,8 @@ const PrefsUtil::TypedPrefMap& BravePrefsUtil::GetAllowlistedKeys() {
   (*s_brave_allowlist)[kMRUCyclingEnabled] = settings_api::PrefType::kBoolean;
 
   // Sync prefs
-  (*s_brave_allowlist)[kBraveCustomSyncUrlEnabled] =
-      settings_api::PrefType::kBoolean;
-  (*s_brave_allowlist)[kBraveCustomSyncUrl] = settings_api::PrefType::kUrl;
+  (*s_brave_allowlist)[brave_sync::kCustomSyncServiceUrl] =
+      settings_api::PrefType::kUrl;
 
   // WebTorrent pref
   (*s_brave_allowlist)[kWebTorrentEnabled] = settings_api::PrefType::kBoolean;

browser/policy/brave_simple_policy_map.h

@@ -7,6 +7,7 @@
 #define BRAVE_BROWSER_POLICY_BRAVE_SIMPLE_POLICY_MAP_H_
 
 #include "brave/components/ai_chat/core/common/buildflags/buildflags.h"
+#include "brave/components/brave_sync/brave_sync_prefs.h"
 #include "brave/components/brave_vpn/common/buildflags/buildflags.h"
 #include "brave/components/constants/pref_names.h"
 #include "brave/components/tor/buildflags/buildflags.h"

browser/resources/settings/brave_sync_page/brave_sync_browser_proxy.ts

@@ -58,10 +58,6 @@ export class BraveSyncBrowserProxy {
     return sendWithPromise('SyncGetWordsCount', syncCode);
   }
 
-  wasCustomSyncUrlEnabledAtStartup(): boolean {
-    return loadTimeData.getBoolean('customSyncUrlEnabledAtStartup');
-  }
-
   getCustomSyncUrlAtStartup(): string {
     return loadTimeData.getString('customSyncUrlAtStartup');
   }

browser/resources/settings/brave_sync_page/brave_sync_page.html

@@ -1,16 +1,8 @@
-<style include="settings-shared iron-flex">
-  cr-input {
-    width: 100%;
-    --cr-input-width: 50%;
-    margin-top: 10px;
-    margin-left: 20px;
-  }
-
-  cr-input::part(row-container) {
-    justify-content: normal;
-  }
-</style>
-<settings-animated-pages id="pages" section="braveSync">
+<style include="settings-shared iron-flex"></style>
+<settings-animated-pages
+  id="pages"
+  section="braveSync"
+>
   <div route-path="default">
     <cr-link-row
       id="brave-sync-setup"
@@ -21,7 +13,10 @@
     </cr-link-row>
   </div>
 
-  <template is="dom-if" route-path="/braveSync/setup">
+  <template
+    is="dom-if"
+    route-path="/braveSync/setup"
+  >
     <settings-subpage
       associated-control="[[$$('#brave-sync-setup')]]"
       page-title="[[syncLabel_]]"
@@ -32,24 +27,9 @@
   </template>
 </settings-animated-pages>
 
-<settings-toggle-button
-  id="customSyncUrlEnabled"
-  class="hr"
-  pref="{{prefs.brave.custom_sync_url_enabled}}"
-  label="$i18n{braveCustomSyncUrlEnableLabel}"
+<div class="hr"></div>
+<sync-url-input
+  id="customSyncUrl"
+  pref="{{prefs.brave_sync.sync_service_url}}"
 >
-  <template
-    is="dom-if"
-    if="[[shouldShowRestart_(prefs.brave.custom_sync_url_enabled.value, prefs.brave.custom_sync_url.value)]]"
-  >
-    <cr-button on-click="onRestartClick_" slot="more-actions">
-      $i18n{restart}
-    </cr-button>
-  </template>
-</settings-toggle-button>
-<template is="dom-if" if="[[prefs.brave.custom_sync_url_enabled.value]]">
-  <sync-url-input
-    id="customSyncUrl"
-    pref="{{prefs.brave.custom_sync_url}}"
-  ></sync-url-input>
-</template>
+</sync-url-input>

browser/resources/settings/brave_sync_page/brave_sync_page.ts

@@ -21,7 +21,6 @@ import { SyncBrowserProxy, SyncBrowserProxyImpl, SyncPrefs } from '/shared/setti
 import { PrefsMixin } from '/shared/settings/prefs/prefs_mixin.js';
 
 import { BaseMixin } from '../base_mixin.js';
-import { RelaunchMixin, RestartType } from '../relaunch_mixin.js';
 import { Route, Router } from '../router.js';
 
 import { BraveSyncBrowserProxy, BraveSyncStatus } from './brave_sync_browser_proxy.js';
@@ -34,8 +33,8 @@ import { getTemplate } from './brave_sync_page.html.js';
  */
 
 const SettingsBraveSyncPageElementBase =
-  RelaunchMixin(PrefsMixin(I18nMixin(
-    WebUiListenerMixin((BaseMixin(PolymerElement))))));
+  PrefsMixin(I18nMixin(
+    WebUiListenerMixin((BaseMixin(PolymerElement)))));
 
 export class SettingsBraveSyncPageElement extends SettingsBraveSyncPageElementBase {
   static get is() {
@@ -122,19 +121,6 @@ export class SettingsBraveSyncPageElement extends SettingsBraveSyncPageElementBa
       }
     }
   }
-
-  private shouldShowRestart_(enabled: boolean, url: string): boolean {
-    const proxy = BraveSyncBrowserProxy.getInstance();
-    return enabled !== proxy.wasCustomSyncUrlEnabledAtStartup() ||
-      proxy.getCustomSyncUrlAtStartup() !== url;
-  }
-
-  private onRestartClick_(e: Event) {
-    // Prevent event from bubbling up to the toggle button.
-    e.stopPropagation();
-    this.performRestart(RestartType.RESTART);
-  }
-
 }
 
 customElements.define(

browser/resources/settings/brave_sync_page/sync_url_input.html

@@ -1,28 +1,63 @@
 <style>
-  cr-input {
+  :host {
+    cursor: auto;
+    display: block;
     width: 100%;
+  }
+
+  cr-input {
     --cr-input-width: 50%;
-    margin: 10px 0;
-    padding-left: 20px;
+    margin: 0 20px;
   }
 
   cr-input::part(row-container) {
     justify-content: normal;
   }
+
+  .custom-title {
+    margin: 10px 20px;
+  }
 </style>
 
 <!-- Max length of 100 KB to prevent browser from freezing. -->
-<cr-input
-  id="input"
-  value="{{value}}"
-  error-message="$i18n{notValid}"
-  placeholder="$i18n{enterCustomSyncUrl}"
-  invalid="{{invalid}}"
-  on-input="validate_"
-  maxlength="102400"
-  spellcheck="false"
-  on-keypress="onKeyPress_"
-  on-blur="validate_"
-  on-change="onChange_"
->
-</cr-input>
+<div id="syncUrlInput">
+  <p class="custom-title">$i18n{braveCustomSyncUrlTitle}</p>
+  <cr-input
+    id="input"
+    value="{{value}}"
+    error-message="$i18n{notValid}"
+    placeholder="$i18n{enterCustomSyncUrl}"
+    invalid="{{invalid}}"
+    on-input="validate_"
+    maxlength="102400"
+    spellcheck="false"
+    on-keypress="onKeyPress_"
+    on-blur="validate_"
+    on-change="onChange_"
+    disabled="[[controlDisabled_(pref.*, disabled)]]"
+  >
+    <template
+      is="dom-if"
+      if="[[hasPrefPolicyIndicator(pref.*)]]"
+    >
+      <cr-policy-pref-indicator
+        pref="[[pref]]"
+        icon-aria-label="[[label]]"
+        slot="suffix"
+      >
+      </cr-policy-pref-indicator>
+    </template>
+
+    <template
+      is="dom-if"
+      if="[[shouldShowRestart_(pref.*)]]"
+    >
+      <cr-button
+        on-click="onRestartClick_"
+        slot="suffix"
+      >
+        $i18n{restart}
+      </cr-button>
+    </template>
+  </cr-input>
+</div>

browser/resources/settings/brave_sync_page/sync_url_input.ts

@@ -5,18 +5,22 @@
 
 
 /**
- * @fileoverview `sync-url-input` is a single-line text field that is used
+ * @fileoverview `sync-url-input` is a single-line text field with title that is used
  * for setting up custom sync server url. It is based on
  * `home-url-input`.
  */
 import 'chrome://resources/cr_elements/cr_textarea/cr_textarea.js';
 import '/shared/settings/prefs/prefs.js';
 
 import type { CrInputElement } from 'chrome://resources/cr_elements/cr_input/cr_input.js';
+import type { CrPolicyPrefMixinInterface } from '/shared/settings/controls/cr_policy_pref_mixin.js';
+
 import { assert } from 'chrome://resources/js/assert.js';
 import { PolymerElement } from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';
 import { PrefControlMixin } from '/shared/settings/controls/pref_control_mixin.js';
-import { PrefsMixin, PrefsMixinInterface } from '/shared/settings/prefs/prefs_mixin.js';
+import { PrefsMixin } from '/shared/settings/prefs/prefs_mixin.js';
+import { CrPolicyPrefMixin } from '/shared/settings/controls/cr_policy_pref_mixin.js';
+import { RelaunchMixin, RelaunchMixinInterface, RestartType } from '../relaunch_mixin.js';
 
 import { BraveSyncBrowserProxy } from './brave_sync_browser_proxy.js';
 
@@ -27,9 +31,10 @@ export interface SyncUrlInputElement {
     input: CrInputElement,
   };
 }
+
 const SyncUrlInputElementBase =
-  PrefsMixin(PrefControlMixin(PolymerElement)) as
-  { new(): PolymerElement & PrefsMixinInterface };
+  RelaunchMixin(PrefsMixin(PrefControlMixin(CrPolicyPrefMixin(PolymerElement)))) as
+  { new(): PolymerElement & CrPolicyPrefMixinInterface & RelaunchMixinInterface };
 
 
 export class SyncUrlInputElement extends SyncUrlInputElementBase {
@@ -53,26 +58,52 @@ export class SyncUrlInputElement extends SyncUrlInputElementBase {
        */
       pref: { observer: 'prefChanged_' },
 
-
       /**
        * Indicates whether the input is invalid.s
        */
-      invalid: {type: Boolean, value: false},
+      invalid: { type: Boolean, value: false },
+
+      /**
+       * Whether the control is disabled, for example due to an extension
+       * managing the preference.
+       */
+      disabled: {
+        type: Boolean,
+        value: false,
+      },
     };
   }
 
   value: string;
   pref: chrome.settingsPrivate.PrefObject<string> | undefined;
   invalid: boolean;
+  disabled: boolean;
 
   private browserProxy_: BraveSyncBrowserProxy =
     BraveSyncBrowserProxy.getInstance();
 
-  private onKeyPress_(e: KeyboardEvent) {
-    if (e.key === 'Enter' && !e.shiftKey) {
-      e.preventDefault();
-      this.validate_();
+  /**
+   * Focus the custom input field.
+   */
+  override focus() {
+    this.$.input.focusInput();
+  }
+
+  /**
+   * Polymer changed observer for |pref|.
+   */
+  private prefChanged_() {
+    if (!this.pref) {
+      return;
     }
+
+    this.setInputValueFromPref_();
+  }
+
+  private onRestartClick_(e: Event) {
+    // Prevent event from bubbling up to the toggle button.
+    e.stopPropagation();
+    this.performRestart(RestartType.RESTART);
   }
 
   private validate_() {
@@ -86,17 +117,6 @@ export class SyncUrlInputElement extends SyncUrlInputElementBase {
     });
   }
 
-  /**
-   * Polymer changed observer for |pref|.
-   */
-  private prefChanged_() {
-    if (!this.pref) {
-      return;
-    }
-
-    this.setInputValueFromPref_();
-  }
-
   private setInputValueFromPref_() {
     assert(this.pref!.type === chrome.settingsPrivate.PrefType.URL);
     this.value = this.pref!.value;
@@ -118,11 +138,27 @@ export class SyncUrlInputElement extends SyncUrlInputElementBase {
     this.$.input.blur();
   }
 
-  /**
-   * Focus the custom input field.
-   */
-  override focus() {
-    this.$.input.focusInput();
+  private onKeyPress_(e: KeyboardEvent) {
+    if (e.key === 'Enter' && !e.shiftKey) {
+      e.preventDefault();
+      this.validate_();
+      this.onChange_();
+    }
+  }
+
+  private isPrefEnforced_(): boolean {
+    return !!this.pref &&
+      this.pref.enforcement === chrome.settingsPrivate.Enforcement.ENFORCED;
+  }
+
+  private shouldShowRestart_(): boolean {
+    const proxy = BraveSyncBrowserProxy.getInstance();
+    return !!this.pref && (proxy.getCustomSyncUrlAtStartup() !== this.pref.value);
+  }
+
+  private controlDisabled_(): boolean {
+    return this.disabled || this.isPrefEnforced_() ||
+      !!(this.pref && this.pref.userControlDisabled);
   }
 }