[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/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: 10px 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>