From 4c5b27af7232d083480a2a2fa0536ce3c3331c32 Mon Sep 17 00:00:00 2001 From: taher Date: Wed, 30 Mar 2022 12:19:19 +0530 Subject: [PATCH] Integrated adblock to settings page under shields section --- app/brave_settings_strings.grdp | 66 ++++ browser/resources/settings/BUILD.gn | 6 +- browser/resources/settings/brave_icons.html | 18 ++ .../settings/brave_overrides/basic_page.js | 2 +- browser/resources/settings/brave_routes.js | 1 + .../default_brave_shields_page/BUILD.gn | 92 +----- .../brave_adblock_browser_proxy.js | 81 +++++ .../brave_adblock_subpage.html | 203 ++++++++++++ .../brave_adblock_subpage.js | 147 +++++++++ .../components/brave_adblock_editor.html | 67 ++++ .../components/brave_adblock_editor.js | 45 +++ .../brave_adblock_subscribe_dropdown.html | 40 +++ .../brave_adblock_subscribe_dropdown.js | 49 +++ .../default_brave_shields_page.html | 241 ++++++++------- .../default_brave_shields_page.js | 225 +++++++------- browser/resources/settings/sources.gni | 6 +- browser/ui/BUILD.gn | 2 + browser/ui/webui/brave_settings_ui.cc | 2 + .../webui/settings/brave_adblock_handler.cc | 290 ++++++++++++++++++ .../ui/webui/settings/brave_adblock_handler.h | 61 ++++ ...ave_settings_localized_strings_provider.cc | 29 ++ 21 files changed, 1371 insertions(+), 302 deletions(-) create mode 100644 browser/resources/settings/default_brave_shields_page/brave_adblock_browser_proxy.js create mode 100644 browser/resources/settings/default_brave_shields_page/brave_adblock_subpage.html create mode 100644 browser/resources/settings/default_brave_shields_page/brave_adblock_subpage.js create mode 100644 browser/resources/settings/default_brave_shields_page/components/brave_adblock_editor.html create mode 100644 browser/resources/settings/default_brave_shields_page/components/brave_adblock_editor.js create mode 100644 browser/resources/settings/default_brave_shields_page/components/brave_adblock_subscribe_dropdown.html create mode 100644 browser/resources/settings/default_brave_shields_page/components/brave_adblock_subscribe_dropdown.js create mode 100644 browser/ui/webui/settings/brave_adblock_handler.cc create mode 100644 browser/ui/webui/settings/brave_adblock_handler.h diff --git a/app/brave_settings_strings.grdp b/app/brave_settings_strings.grdp index 40f1d3a6ebbb..393cb45a66b5 100644 --- a/app/brave_settings_strings.grdp +++ b/app/brave_settings_strings.grdp @@ -202,6 +202,72 @@ Advanced view + + + Content Filtering + + + Enable custom filters that block regional and language-specific trackers and Annoyances. + + + Enable custom filters that block regional and language-specific trackers and + <a target="_blank" href="$1">Annoyances</a>. + + + Add custom filter lists + + + Add additional lists created and maintained by your trusted community. + + + Only subscribe to lists from entities you trust. Your browser will periodically check for list updates from the URL you enter, revealing your IP address to their server. + + + Custom Filters + + + Get technical by adding your own specific filters, one by line, in <a target="_blank" href="$1">Adblock filter syntax</a>. + + + Add + + + List URL + + + Last updated + + + Update now + + + View source + + + Unsubscribe + + + Save changes + + + Brave's tracking filters + + + View the filters that come <a target="_blank" href="$1">enabled by default</a> as part of Brave Shields. + + + Download failed + + + Update failed + + + Custom lists + + + Show full lists + + Brave Rewards diff --git a/browser/resources/settings/BUILD.gn b/browser/resources/settings/BUILD.gn index 04ecbfbcb725..90e16d5822e7 100644 --- a/browser/resources/settings/BUILD.gn +++ b/browser/resources/settings/BUILD.gn @@ -112,6 +112,7 @@ preprocess_if_expr("preprocess") { "brave_reset_page/brave_reset_profile_dialog_behavior.js", "brave_routes.js", "brave_sync_page/brave_sync_browser_proxy.js", + "default_brave_shields_page/brave_adblock_browser_proxy.js", ] } @@ -164,7 +165,10 @@ preprocess_if_expr("preprocess_generated") { "brave_wallet_page/brave_wallet_page.js", "brave_wallet_page/wallet_networks_subpage.js", "default_brave_shields_page/default_brave_shields_browser_proxy.m.js", - "default_brave_shields_page/default_brave_shields_page.m.js", + "default_brave_shields_page/default_brave_shields_page.js", + "default_brave_shields_page/brave_adblock_subpage.js", + "default_brave_shields_page/components/brave_adblock_subscribe_dropdown.js", + "default_brave_shields_page/components/brave_adblock_editor.js", "getting_started_page/getting_started.js", "social_blocking_page/social_blocking_page.m.js", ] diff --git a/browser/resources/settings/brave_icons.html b/browser/resources/settings/brave_icons.html index a3174ffea20c..139677cd11b3 100644 --- a/browser/resources/settings/brave_icons.html +++ b/browser/resources/settings/brave_icons.html @@ -113,3 +113,21 @@ + + + + + + + + + + + + + + + + + + diff --git a/browser/resources/settings/brave_overrides/basic_page.js b/browser/resources/settings/brave_overrides/basic_page.js index fe00afe977a5..a268133a4990 100644 --- a/browser/resources/settings/brave_overrides/basic_page.js +++ b/browser/resources/settings/brave_overrides/basic_page.js @@ -14,7 +14,7 @@ import '../brave_rewards_page/brave_rewards_page.js' import '../brave_search_engines_page/brave_search_engines_page.m.js' import '../brave_sync_page/brave_sync_page.js' import '../brave_wallet_page/brave_wallet_page.js' -import '../default_brave_shields_page/default_brave_shields_page.m.js' +import '../default_brave_shields_page/default_brave_shields_page.js' import '../getting_started_page/getting_started.js' import '../social_blocking_page/social_blocking_page.m.js' diff --git a/browser/resources/settings/brave_routes.js b/browser/resources/settings/brave_routes.js index ed40e0a9497f..8e7813d28802 100644 --- a/browser/resources/settings/brave_routes.js +++ b/browser/resources/settings/brave_routes.js @@ -23,6 +23,7 @@ export default function addBraveRoutes(r) { } } r.SHIELDS = r.BASIC.createSection('/shields', 'shields') + r.SHIELDS_ADBLOCK = r.SHIELDS.createChild('/shields/content-filters') r.REWARDS = r.BASIC.createSection('/rewards', 'rewards') r.SOCIAL_BLOCKING = r.BASIC.createSection('/socialBlocking', 'socialBlocking') r.EXTENSIONS = r.BASIC.createSection('/extensions', 'extensions') diff --git a/browser/resources/settings/default_brave_shields_page/BUILD.gn b/browser/resources/settings/default_brave_shields_page/BUILD.gn index 85b2f9b03082..27c2f6131251 100644 --- a/browser/resources/settings/default_brave_shields_page/BUILD.gn +++ b/browser/resources/settings/default_brave_shields_page/BUILD.gn @@ -4,98 +4,28 @@ # you can obtain one at http://mozilla.org/MPL/2.0/. import("//third_party/closure_compiler/compile_js.gni") +import("//tools/polymer/html_to_js.gni") import("//tools/polymer/polymer.gni") import("//ui/webui/resources/tools/js_modulizer.gni") import("../settings.gni") -# HTML Imports compatible compiles - -js_type_check("closure_compile") { - deps = [ - ":default_brave_shields_browser_proxy", - ":default_brave_shields_page", - ] -} - -js_library("default_brave_shields_browser_proxy") { - deps = [ - "//ui/webui/resources/js:cr", - ] - externs_list = [ - "$externs_path/chrome_send.js", - ] -} - -js_library("default_brave_shields_page") { - deps = [ - ":default_brave_shields_browser_proxy", - "//ui/webui/resources/js:cr", - "//ui/webui/resources/js:load_time_data", - ] - externs_list = [ - "$externs_path/settings_private.js", - ] -} - -# ES Module compatible compiles - -js_type_check("closure_compile_module") { - is_polymer3 = true - deps = [ - ":default_brave_shields_browser_proxy.m", - ":default_brave_shields_page.m", - ] -} - -js_library("default_brave_shields_browser_proxy.m") { - deps = [ - "//ui/webui/resources/js:cr.m", - ] - externs_list = [ - "$externs_path/chrome_send.js", - ] - extra_deps = [ - ":default_brave_shields_browser_proxy_module", - ] -} - -js_library("default_brave_shields_page.m") { - deps = [ - ":default_brave_shields_browser_proxy.m", - "//ui/webui/resources/js:cr.m", - "//ui/webui/resources/js:load_time_data.m", - ] - externs_list = [ - "$externs_path/settings_private.js", - ] - extra_deps = [ - ":default_brave_shields_page_module", - ] -} - -# ES Module conversion from HTML Imports code - group("web_modules") { public_deps = [ - ":default_brave_shields_page_module", - ":default_brave_shields_browser_proxy_module", + ":modules", + ":templatize", ] } -polymer_modulizer("default_brave_shields_page") { - js_file = "default_brave_shields_page.js" - html_file = "default_brave_shields_page.html" - html_type = "dom-module" - auto_imports = settings_auto_imports + [ - "brave/browser/resources/settings/default_brave_shields_page/default_brave_shields_browser_proxy.html|DefaultBraveShieldsBrowserProxy, DefaultBraveShieldsBrowserProxyImpl", - ] +js_modulizer("modules") { + input_files = [ "default_brave_shields_browser_proxy.js" ] namespace_rewrites = settings_namespace_rewrites } -js_modulizer("default_brave_shields_browser_proxy_module") { - input_files = [ - "default_brave_shields_browser_proxy.js", +html_to_js("templatize") { + js_files = [ + "default_brave_shields_page.js", + "brave_adblock_subpage.js", + "components/brave_adblock_subscribe_dropdown.js", + "components/brave_adblock_editor.js", ] - namespace_rewrites = settings_namespace_rewrites } - diff --git a/browser/resources/settings/default_brave_shields_page/brave_adblock_browser_proxy.js b/browser/resources/settings/default_brave_shields_page/brave_adblock_browser_proxy.js new file mode 100644 index 000000000000..c4672376d5ee --- /dev/null +++ b/browser/resources/settings/default_brave_shields_page/brave_adblock_browser_proxy.js @@ -0,0 +1,81 @@ +/* Copyright 2022 The Brave Authors. All rights reserved. + * This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this file, + * you can obtain one at http://mozilla.org/MPL/2.0/. */ + +import { sendWithPromise, addWebUIListener } from 'chrome://resources/js/cr.m.js'; + +/** @interface */ +export class BraveAdblockBrowserProxy { + getInstance() { } + getRegionalLists() { } + enableFilterList() { } + getListSubscriptions() { } + getCustomFilters() { } + setSubscriptionEnabled() { } + addSubscription() { } + addWebUIListener() { } + updateSubscription() { } + deleteSubscription() { } + viewSubscription() { } +} + +/** +* @implements {BraveAdblockBrowserProxy} +*/ +export class BraveAdblockBrowserProxyImpl { + /** @instance */ + static getInstance() { + return instance || (instance = new BraveAdblockBrowserProxyImpl()); + } + + /** @returns {Promise} */ + getRegionalLists () { + return sendWithPromise('brave_adblock.getRegionalLists') + } + + /** @returns {Promise} */ + getListSubscriptions () { + return sendWithPromise('brave_adblock.getListSubscriptions') + } + + /** @returns {Promise} */ + getCustomFilters () { + return sendWithPromise('brave_adblock.getCustomFilters') + } + + enableFilterList (uuid, enabled) { + chrome.send('brave_adblock.enableFilterList', [uuid, enabled]) + } + + setSubscriptionEnabled (url, enabled) { + chrome.send('brave_adblock.setSubscriptionEnabled', [url, enabled]) + } + + addSubscription (url) { + chrome.send('brave_adblock.addSubscription', [url]) + } + + updateSubscription (url) { + chrome.send('brave_adblock.updateSubscription', [url]) + } + + updateCustomFilters (value) { + chrome.send('brave_adblock.updateCustomFilters', [value]) + } + + deleteSubscription (url) { + chrome.send('brave_adblock.deleteSubscription', [url]) + } + + viewSubscription (url) { + chrome.send('brave_adblock.viewSubscription', [url]) + } + + addWebUIListener (event_name, callback) { + addWebUIListener(event_name, callback) + } +} + +/** @type {BraveAdblockBrowserProxyImpl} */ +let instance diff --git a/browser/resources/settings/default_brave_shields_page/brave_adblock_subpage.html b/browser/resources/settings/default_brave_shields_page/brave_adblock_subpage.html new file mode 100644 index 000000000000..4f931549b0fc --- /dev/null +++ b/browser/resources/settings/default_brave_shields_page/brave_adblock_subpage.html @@ -0,0 +1,203 @@ + + +
+
+
+
$i18n{adblockContentFilteringLabel}
+
+
$i18n{adblockTrackingFiltersLabel}
+
+ + + + + +
+ +
+ +
+
+
+
+
+ $i18n{adblockAddCustomFiltersListsLabel} +
+
+ $i18n{adblockAddCustomFiltersListsDesc} +
$i18n{adblockAddCustomFiltersListsNote}
+
+ + +
+
+
+
+
+ $i18n{adblockCustomFiltersLabel} +
+
+ +
+
diff --git a/browser/resources/settings/default_brave_shields_page/brave_adblock_subpage.js b/browser/resources/settings/default_brave_shields_page/brave_adblock_subpage.js new file mode 100644 index 000000000000..13161f1e309e --- /dev/null +++ b/browser/resources/settings/default_brave_shields_page/brave_adblock_subpage.js @@ -0,0 +1,147 @@ +/* Copyright 2022 The Brave Authors. All rights reserved. + * This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this file, + * You can obtain one at http://mozilla.org/MPL/2.0/. */ + +import {I18nMixin} from 'chrome://resources/js/i18n_mixin.js'; +import {PolymerElement, html} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js'; +import {BaseMixin} from '../base_mixin.js'; +import {PrefsMixin} from '../prefs/prefs_mixin.js'; + +import 'chrome://resources/cr_elements/cr_button/cr_button.m.js'; +import 'chrome://resources/cr_elements/icons.m.js'; +import './components/brave_adblock_subscribe_dropdown.js'; +import './components/brave_adblock_editor.js'; +import { BraveAdblockBrowserProxyImpl } from './brave_adblock_browser_proxy.js' + +const AdBlockSubpageBase = PrefsMixin(I18nMixin(BaseMixin(PolymerElement))) + +class AdBlockSubpage extends AdBlockSubpageBase { + static get is() { + return 'adblock-subpage' + } + + static get template() { + return html`{__html_template__}` + } + + static get properties() { + return { + filterList_: Array, + subscriptionList_: Array, + customFilters_: String, + subscribeUrl_: String, + hasListExpanded_: { + type: Boolean, + value: false + }, + } + } + + browserProxy_ = BraveAdblockBrowserProxyImpl.getInstance() + + ready() { + super.ready() + this.browserProxy_.getRegionalLists().then(value => { + this.filterList_ = value + }) + + this.browserProxy_.getListSubscriptions().then(value => { + this.subscriptionList_ = value + }) + + this.browserProxy_.getCustomFilters().then(value => { + this.customFilters_ = value + }) + + this.browserProxy_.addWebUIListener( + 'brave_adblock.onGetListSubscriptions', (value) => { + this.subscriptionList_ = value + }) + } + + handleShowList_() { + if (!this.hasListExpanded_) { + this.hasListExpanded_ = true + } + } + + searchListBy_(title) { + if (!title) { + this.hasListExpanded_ = false + return null + } + + return (item) => { + this.hasListExpanded_ = true + title = title.toLowerCase() + return (item.title.toLowerCase().includes(title)) + } + } + + handleFilterListItemToggle_(e) { + this.browserProxy_.enableFilterList(e.model.get('item.uuid'), e.model.get('item.enabled')) + } + + handleSubscribeUrlItemItemToggle_(e) { + this.browserProxy_.setSubscriptionEnabled(e.model.get('item.subscription_url'), e.model.get('item.enabled')) + } + + onKeyUp_(e) { + if (e.keyCode === 13) { + this.handleSubmitUrl_() + } + } + + handleSubmitUrl_() { + const url = this.subscribeUrl_.trim() + if (!url) return + + this.browserProxy_.addSubscription(url) + this.subscribeUrl_ = null + } + + handleSave_(e) { + const value = e.detail.value + this.browserProxy_.updateCustomFilters(value) + } + + handleUpdateSubscription_(e) { + this.browserProxy_.updateSubscription(e.model.get('item.subscription_url')) + } + + handleDeleteSubscription_(e) { + this.browserProxy_.deleteSubscription(e.model.get('item.subscription_url')) + } + + handleViewSubscription_(e) { + this.browserProxy_.viewSubscription(e.model.get('item.subscription_url')) + } + + getStringHtml_(id, link) { + return this.i18nAdvanced(id, { substitutions: [ link ]}) + } + + getStatus_(last_update_attempt, last_successful_update_attempt, last_updated_pretty_text) { + /* "Last updated" column can have four distinct states: + * No update ever attempted: fine to show blank + * Update attempted and failed, and never succeeded previously: show + * "Download failure" + * Update attempted and failed, but succeeded previously: show + * "Download failure since + last updated time" + * Update attempted and succeeded: show the last updated time + */ + + if (last_update_attempt === 0) { + return '—' + } else if (last_successful_update_attempt === 0) { + return this.i18n('adblockSubscribeUrlDownloadFailed') + } else if (last_successful_update_attempt !== last_update_attempt) { + return `${last_updated_pretty_text} ${this.i18n('adblockSubscribeUrlUpdateFailed')}` + } else { + return last_updated_pretty_text + } + } +} + +customElements.define(AdBlockSubpage.is, AdBlockSubpage) diff --git a/browser/resources/settings/default_brave_shields_page/components/brave_adblock_editor.html b/browser/resources/settings/default_brave_shields_page/components/brave_adblock_editor.html new file mode 100644 index 000000000000..2fc697361b36 --- /dev/null +++ b/browser/resources/settings/default_brave_shields_page/components/brave_adblock_editor.html @@ -0,0 +1,67 @@ + + +
+
+ +
+ + $i18n{adblockSaveChangesButtonLabel} + +
diff --git a/browser/resources/settings/default_brave_shields_page/components/brave_adblock_editor.js b/browser/resources/settings/default_brave_shields_page/components/brave_adblock_editor.js new file mode 100644 index 000000000000..e02720266ccb --- /dev/null +++ b/browser/resources/settings/default_brave_shields_page/components/brave_adblock_editor.js @@ -0,0 +1,45 @@ +/* Copyright 2022 The Brave Authors. All rights reserved. + * This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this file, + * You can obtain one at http://mozilla.org/MPL/2.0/. */ + +import {I18nMixin} from 'chrome://resources/js/i18n_mixin.js'; +import {PolymerElement, html} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js'; +import {BaseMixin} from '../../base_mixin.js'; +import {PrefsMixin} from '../../prefs/prefs_mixin.js'; + +import 'chrome://resources/cr_elements/cr_button/cr_button.m.js'; + +const AdBlockFiltersEditorBase = PrefsMixin(I18nMixin(BaseMixin(PolymerElement))) + +class AdBlockFiltersEditor extends AdBlockFiltersEditorBase { + static get is() { + return 'adblock-filter-editor' + } + + static get template() { + return html`{__html_template__}` + } + + static get properties() { + return { + value: { + type: Text + } + } + } + + ready() { + super.ready() + } + + handleInputChange_(e) { + this.value = e.target.value + } + + handleSave_() { + this.fire('save', { value: this.value }) + } +} + +customElements.define(AdBlockFiltersEditor.is, AdBlockFiltersEditor) diff --git a/browser/resources/settings/default_brave_shields_page/components/brave_adblock_subscribe_dropdown.html b/browser/resources/settings/default_brave_shields_page/components/brave_adblock_subscribe_dropdown.html new file mode 100644 index 000000000000..9b0662b5f2a1 --- /dev/null +++ b/browser/resources/settings/default_brave_shields_page/components/brave_adblock_subscribe_dropdown.html @@ -0,0 +1,40 @@ + + +
+ + + + + + + +
diff --git a/browser/resources/settings/default_brave_shields_page/components/brave_adblock_subscribe_dropdown.js b/browser/resources/settings/default_brave_shields_page/components/brave_adblock_subscribe_dropdown.js new file mode 100644 index 000000000000..0ba239b2bb44 --- /dev/null +++ b/browser/resources/settings/default_brave_shields_page/components/brave_adblock_subscribe_dropdown.js @@ -0,0 +1,49 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this file, + * You can obtain one at http://mozilla.org/MPL/2.0/. */ + + import {I18nMixin} from 'chrome://resources/js/i18n_mixin.js'; +import {PolymerElement, html} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js'; +import {BaseMixin} from '../../base_mixin.js'; +import {PrefsMixin} from '../../prefs/prefs_mixin.js'; + +import 'chrome://resources/cr_elements/cr_action_menu/cr_action_menu.js'; +import 'chrome://resources/cr_elements/cr_icon_button/cr_icon_button.m.js'; +import 'chrome://resources/cr_elements/icons.m.js'; + +const AdblockSubscribeDropDownBase = PrefsMixin(I18nMixin(BaseMixin(PolymerElement))) + +class AdBlockSubscribeDropDown extends AdblockSubscribeDropDownBase { + static get is() { + return 'adblock-subscribe-dropdown' + } + + static get template() { + return html`{__html_template__}` + } + + ready() { + super.ready() + } + + handleDropdownClick_(e) { + this.$.menu.showAt(e.target) + } + + updateSubscription_() { + this.fire('update-subscription') + this.$.menu.close() + } + + viewSubscription_() { + this.fire('view-subscription') + this.$.menu.close() + } + + deleteSubscription_() { + this.fire('delete-subscription') + this.$.menu.close() + } +} + +customElements.define(AdBlockSubscribeDropDown.is, AdBlockSubscribeDropDown) diff --git a/browser/resources/settings/default_brave_shields_page/default_brave_shields_page.html b/browser/resources/settings/default_brave_shields_page/default_brave_shields_page.html index c622a373340d..31b028f58260 100644 --- a/browser/resources/settings/default_brave_shields_page/default_brave_shields_page.html +++ b/browser/resources/settings/default_brave_shields_page/default_brave_shields_page.html @@ -1,118 +1,129 @@ - - - - - - - - - -