brings back a feature to add, remove custom CSS selectors

components/brave_extension/extension/brave_extension/background/api.ts

@@ -3,6 +3,7 @@
  * You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 require('./api/browserActionAPI')
+require('./api/cosmeticFilterAPI')
 require('./api/localeAPI')
 require('./api/shieldsAPI')
 require('./api/tabsAPI')

components/brave_extension/extension/brave_extension/background/api/cosmeticFilterAPI.ts

@@ -0,0 +1,51 @@
+/* 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/. */
+
+// User generated cosmetic filtering below
+export const applyCSSCosmeticFilters = (tabId: number, hostname: string) => {
+  chrome.storage.local.get('cosmeticFilterList', (storeData = {}) => {
+    if (!storeData.cosmeticFilterList) {
+      if (process.env.NODE_ENV === 'shields_development') {
+        console.log('applySiteFilters: no cosmetic filter store yet')
+      }
+      return
+    }
+    if (storeData.cosmeticFilterList[hostname] !== undefined) {
+      storeData.cosmeticFilterList[hostname].map((rule: string) => {
+        if (process.env.NODE_ENV === 'shields_development') {
+          console.log('applying rule', rule)
+        }
+        chrome.tabs.insertCSS(tabId, { // https://github.com/brave/brave-browser/wiki/Cosmetic-Filtering
+          code: `${rule} {display: none !important;}`,
+          cssOrigin: 'user',
+          runAt: 'document_start'
+        })
+      })
+    }
+  })
+}
+
+export const removeAllFilters = () => {
+  chrome.storage.local.set({ 'cosmeticFilterList': {} })
+}
+
+export const addSiteCosmeticFilter = async (origin: string, cssfilter: string) => {
+  chrome.storage.local.get('cosmeticFilterList', (storeData = {}) => {
+    let storeList = Object.assign({}, storeData.cosmeticFilterList)
+    if (storeList[origin] === undefined || storeList[origin].length === 0) { // nothing in filter list for origin
+      storeList[origin] = [cssfilter]
+    } else { // add entry
+      storeList[origin].push(cssfilter)
+    }
+    chrome.storage.local.set({ 'cosmeticFilterList': storeList })
+  })
+}
+
+export const removeSiteFilter = (origin: string) => {
+  chrome.storage.local.get('cosmeticFilterList', (storeData = {}) => {
+    let storeList = Object.assign({}, storeData.cosmeticFilterList)
+    delete storeList[origin]
+    chrome.storage.local.set({ 'cosmeticFilterList': storeList })
+  })
+}

components/brave_extension/extension/brave_extension/background/events/cosmeticFilterEvents.ts

@@ -1,4 +1,9 @@
 import { getLocale } from '../api/localeAPI'
+import {
+  addSiteCosmeticFilter,
+  removeSiteFilter,
+  removeAllFilters
+} from '../api/cosmeticFilterAPI'
 import shieldsPanelActions from '../actions/shieldsPanelActions'
 
 export let rule = {
@@ -84,6 +89,14 @@ export function onContextMenuClicked (info: chrome.contextMenus.OnClickData, tab
     case 'addBlockElement':
       query()
       break
+    case 'resetSiteFilterSettings': {
+      removeSiteFilter(rule.host)
+      break
+    }
+    case 'resetAllFilterSettings': {
+      removeAllFilters()
+      break
+    }
     default: {
       console.warn('[cosmeticFilterEvents] invalid context menu option: ${info.menuItemId}')
     }
@@ -113,4 +126,6 @@ export async function onSelectorReturned (response: any) {
       cssOrigin: 'user'
     })
   }
+
+  await addSiteCosmeticFilter(rule.host, rule.selector)
 }