Hide custom filters textbox if dev mode is off and there're no custom…

… filters.

browser/resources/settings/default_brave_shields_page/brave_adblock_subpage.html

@@ -324,27 +324,32 @@
   sub-label="$i18n{adblockDeveloperModeDesc}">
 </settings-toggle-button>
 
-<div class="settings-box">
-  <div class="flex">
-    <div class="label shields-primary-title">
-      $i18n{adblockCustomFiltersLabel}
+<template is="dom-if" if="[[shouldShowCustomFilters_]]" restamp>
+  <div class="settings-box">
+    <div class="flex">
+      <div class="label shields-primary-title">
+        $i18n{adblockCustomFiltersLabel}
+      </div>
+      <div class="label secondary shields-secondary-title" inner-h-t-m-l="[[getStringHtml_('adblockCustomFiltersDesc', 'https://support.brave.com/hc/en-us/articles/6449369961741')]]"></div>
+      <adblock-filter-editor
+        prefs="{{prefs}}"
+        value="{{customFilters_}}"
+        on-save="handleSave_"
+      ></adblock-filter-editor>
     </div>
-    <div class="label secondary shields-secondary-title" inner-h-t-m-l="[[getStringHtml_('adblockCustomFiltersDesc', 'https://support.brave.com/hc/en-us/articles/6449369961741')]]"></div>
-    <adblock-filter-editor
-      prefs="{{prefs}}"
-      value="{{customFilters_}}"
-      on-save="handleSave_"
-    ></adblock-filter-editor>
   </div>
-</div>
+</template>
 
-<template is="dom-if" if="[[cosmeticFilteringCustomScriptletsEnabled_]]">
+<template is="dom-if" if="[[shouldShowCustomScriptlets_]]" restamp>
   <div class="settings-box">
     <div class="flex">
       <div class="label shields-primary-title">
         $i18n{adblockCustomSciptletsListLabel}
       </div>
-      <adblock-scriptlet-list prefs="{{prefs}}"></adblock-scriptlet-list>
+      <adblock-scriptlet-list
+        prefs="{{prefs}}"
+        on-list-changed="handleSciptletsChanged_">
+      </adblock-scriptlet-list>
     </div>
   </div>
 </template>

browser/resources/settings/default_brave_shields_page/brave_adblock_subpage.ts

@@ -20,6 +20,7 @@ import {
   BraveAdblockBrowserProxy,
   BraveAdblockBrowserProxyImpl,
   FilterList,
+  Scriptlet,
   SubscriptionInfo
 } from './brave_adblock_browser_proxy.js'
 
@@ -49,22 +50,26 @@ class AdBlockSubpage extends AdBlockSubpageBase {
         type: Boolean,
         value: false
       },
-      cosmeticFilteringCustomScriptletsEnabled_: {
-        type: Boolean,
-        value: loadTimeData.getBoolean(
-          'cosmeticFilteringCustomScriptletsEnabled'
-        )
-      }
+      shouldShowCustomFilters_: Boolean,
+      shouldShowCustomScriptlets_: Boolean
     }
   }
 
+  static get observers() {
+    return [
+      'updateState_(prefs.brave.ad_block.developer_mode.value, customFilters_, customScriptlets_)'
+    ]
+  }
+
   private filterList_: FilterList[]
   private subscriptionList_: SubscriptionInfo[]
   private customFilters_: string
   private subscribeUrl_: string
   private listsUpdatingState_: string
   private hasListExpanded_: boolean
-  private cosmeticFilteringCustomScriptletsEnabled_: boolean
+  private shouldShowCustomFilters_: boolean
+  private shouldShowCustomScriptlets_: boolean
+  private customScriptlets_: Scriptlet[]
 
   private browserProxy_: BraveAdblockBrowserProxy =
     BraveAdblockBrowserProxyImpl.getInstance()
@@ -86,10 +91,42 @@ class AdBlockSubpage extends AdBlockSubpageBase {
       this.customFilters_ = value
     })
 
+    this.browserProxy_.getCustomScriptlets().then((value: Scriptlet[]) => {
+      this.customScriptlets_ = value
+    })
+
     this.browserProxy_.addWebUiListener(
       'brave_adblock.onGetListSubscriptions', (value: SubscriptionInfo[]) => {
         this.subscriptionList_ = value
     })
+    this.browserProxy_.addWebUiListener(
+      'brave_adblock.onCustomFiltersChanged',
+      (value: string) => {
+        this.customFilters_ = value
+      }
+    )
+  }
+
+  private updateState_(
+    devMode: boolean,
+    customFilters: string,
+    customScriptlets: Scriptlet[]
+  ) {
+    this.shouldShowCustomScriptlets_ =
+      devMode !== undefined &&
+      customScriptlets != undefined &&
+      loadTimeData.getBoolean('cosmeticFilteringCustomScriptletsEnabled') &&
+      (customScriptlets.length > 0 || devMode)
+
+    this.shouldShowCustomFilters_ =
+      devMode !== undefined &&
+      customFilters !== undefined &&
+      (customFilters.trim().length > 0 || devMode)
+  }
+
+  private handleSciptletsChanged_(e: CustomEvent) {
+    const value = e.detail.value as Scriptlet[]
+    this.customScriptlets_ = value
   }
 
   private handleShowList_() {

browser/resources/settings/default_brave_shields_page/components/brave_adblock_editor.ts

@@ -28,7 +28,7 @@ class AdBlockFiltersEditor extends AdBlockFiltersEditorBase {
     return {
       value: {
         type: String
-      }
+      },
     }
   }
 

browser/resources/settings/default_brave_shields_page/components/brave_adblock_scriptlet_list.html

@@ -20,6 +20,10 @@
     .scriptlet:last-of-type {
         border-bottom: none;
     }
+
+    cr-icon-button[disabled] {
+        pointer-events: none;
+    }
 </style>
 
 <div>
@@ -30,9 +34,11 @@
                     <div class="label">[[item.name]]</div>
                 </div>
                 <div>
-                    <cr-icon-button id="edit" on-click="handleEdit_" class="size-20" iron-icon="edit-pencil">
+                    <cr-icon-button id="edit" on-click="handleEdit_" class="size-20" iron-icon="edit-pencil"
+                        disabled="[[!prefs.brave.ad_block.developer_mode.value]]">
                     </cr-icon-button>
-                    <cr-icon-button id="delete" on-click="handleDelete_" class="size-20" iron-icon="trash">
+                    <cr-icon-button id="delete" on-click="handleDelete_" class="size-20" iron-icon="trash"
+                        disabled="[[!prefs.brave.ad_block.developer_mode.value]]">
                     </cr-icon-button>
                 </div>
             </div>

browser/resources/settings/default_brave_shields_page/components/brave_adblock_scriptlet_list.ts

@@ -48,7 +48,7 @@ class AdblockScriptletList extends AdblockScriptletListBase {
   }
 
   static get observers() {
-    return ['onDevModeChanged_(prefs.brave.ad_block.developer_mode.value)']
+    return ['onSctiptelsListChanged_(customScriptletsList_)']
   }
 
   customScriptletsList_: Scriptlet[]
@@ -71,18 +71,6 @@ class AdblockScriptletList extends AdblockScriptletListBase {
     })
   }
 
-  private onDevModeChanged_(value: boolean) {
-    if (!value) {
-      this.customScriptletsList_ = []
-    } else {
-      setTimeout(() => {
-        this.browserProxy_.getCustomScriptlets().then((scriptlets) => {
-          this.customScriptletsList_ = scriptlets
-        })
-      })
-    }
-  }
-
   handleAdd_(_: any) {
     this.editingScriptlet_ = new Scriptlet()
     this.isEditing_ = true
@@ -117,6 +105,10 @@ class AdblockScriptletList extends AdblockScriptletListBase {
       this.customScriptletsList_ = scriptlets
     })
   }
+
+  private onSctiptelsListChanged_(scriptlets: Scriptlet[]) {
+    this.fire('list-changed', { value: scriptlets })
+  }
 }
 
 customElements.define(AdblockScriptletList.is, AdblockScriptletList)

browser/ui/webui/settings/brave_adblock_handler.cc

@@ -5,7 +5,6 @@
 
 #include "brave/browser/ui/webui/settings/brave_adblock_handler.h"
 
-#include <memory>
 #include <string>
 #include <utility>
 
@@ -20,11 +19,9 @@
 #include "brave/components/brave_shields/core/browser/ad_block_component_service_manager.h"
 #include "brave/components/brave_shields/core/browser/ad_block_custom_resource_provider.h"
 #include "brave/components/brave_shields/core/common/features.h"
+#include "brave/components/brave_shields/core/common/pref_names.h"
 #include "chrome/browser/browser_process.h"
-#include "chrome/browser/content_settings/host_content_settings_map_factory.h"
-#include "chrome/browser/profiles/profile.h"
 #include "chrome/browser/ui/browser_finder.h"
-#include "chrome/browser/ui/browser_navigator_params.h"
 #include "chrome/browser/ui/singleton_tabs.h"
 #include "content/public/browser/web_ui.h"
 #include "ui/base/l10n/time_format.h"
@@ -34,7 +31,6 @@ BraveAdBlockHandler::BraveAdBlockHandler() = default;
 BraveAdBlockHandler::~BraveAdBlockHandler() = default;
 
 void BraveAdBlockHandler::RegisterMessages() {
-  profile_ = Profile::FromWebUI(web_ui());
   web_ui()->RegisterMessageCallback(
       "brave_adblock.getRegionalLists",
       base::BindRepeating(&BraveAdBlockHandler::GetRegionalLists,
@@ -109,15 +105,21 @@ void BraveAdBlockHandler::RegisterMessages() {
       "brave_adblock.removeCustomScriptlet",
       base::BindRepeating(&BraveAdBlockHandler::RemoveCustomScriptlet,
                           base::Unretained(this)));
+  pref_change_registrar_.Init(g_browser_process->local_state());
 }
 
 void BraveAdBlockHandler::OnJavascriptAllowed() {
   service_observer_.Observe(g_brave_browser_process->ad_block_service()
                                 ->subscription_service_manager());
+  pref_change_registrar_.Add(
+      brave_shields::prefs::kAdBlockCustomFilters,
+      base::BindRepeating(&BraveAdBlockHandler::RefreshCustomFilters,
+                          weak_factory_.GetWeakPtr()));
 }
 
 void BraveAdBlockHandler::OnJavascriptDisallowed() {
   service_observer_.Reset();
+  pref_change_registrar_.RemoveAll();
 }
 
 void BraveAdBlockHandler::OnServiceUpdateEvent() {
@@ -364,6 +366,15 @@ void BraveAdBlockHandler::RefreshSubscriptionsList() {
   FireWebUIListener("brave_adblock.onGetListSubscriptions", GetSubscriptions());
 }
 
+void BraveAdBlockHandler::RefreshCustomFilters() {
+  const std::string& custom_filters =
+      g_brave_browser_process->ad_block_service()
+          ->custom_filters_provider()
+          ->GetCustomFilters();
+  FireWebUIListener("brave_adblock.onCustomFiltersChanged",
+                    base::Value(custom_filters));
+}
+
 base::Value::List BraveAdBlockHandler::GetSubscriptions() {
   auto list_subscriptions = g_brave_browser_process->ad_block_service()
                                 ->subscription_service_manager()

browser/ui/webui/settings/brave_adblock_handler.h

@@ -8,13 +8,13 @@
 
 #include <string>
 
-#include "base/memory/raw_ptr.h"
 #include "base/memory/weak_ptr.h"
 #include "base/scoped_observation.h"
 #include "brave/components/brave_shields/content/browser/ad_block_subscription_service_manager.h"
 #include "brave/components/brave_shields/content/browser/ad_block_subscription_service_manager_observer.h"
 #include "brave/components/brave_shields/core/browser/ad_block_custom_resource_provider.h"
 #include "chrome/browser/ui/webui/settings/settings_page_ui_handler.h"
+#include "components/prefs/pref_change_registrar.h"
 
 class Profile;
 using brave_shields::AdBlockSubscriptionServiceManager;
@@ -60,17 +60,18 @@ class BraveAdBlockHandler : public settings::SettingsPageUIHandler,
       brave_shields::AdBlockCustomResourceProvider::ErrorCode error_code);
 
   void RefreshSubscriptionsList();
+  void RefreshCustomFilters();
 
   base::Value::List GetSubscriptions();
 
   void OnFilterListsUpdated(std::string callback_id, bool success);
 
-  raw_ptr<Profile> profile_ = nullptr;
-
   base::ScopedObservation<AdBlockSubscriptionServiceManager,
                           AdBlockSubscriptionServiceManagerObserver>
       service_observer_{this};
 
+  PrefChangeRegistrar pref_change_registrar_;
+
   base::WeakPtrFactory<BraveAdBlockHandler> weak_factory_{this};
 };