new Shields

BUILD.gn

@@ -32,11 +32,13 @@ action("brave-extension") {
     "app/background/store.ts",
     "app/braveShieldsPanel.tsx",
     "app/components/braveShields/braveShields.tsx",
-    "app/components/braveShields/braveShieldsControls.tsx",
-    "app/components/braveShields/braveShieldsFooter.tsx",
-    "app/components/braveShields/braveShieldsHeader.tsx",
-    "app/components/braveShields/braveShieldsStats.tsx",
-    "app/components/noScript/noScript.tsx",
+    "app/components/braveShields/footer.tsx",
+    "app/components/braveShields/header.tsx",
+    "app/components/braveShields/interfaceControls.tsx",
+    "app/components/braveShields/privacyControls.tsx",
+    "app/components/braveShields/blockedResources/blockedResources.tsx",
+    "app/components/braveShields/blockedResources/scriptsList.tsx",
+    "app/components/braveShields/blockedResources/staticList.tsx",
     "app/constants/cosmeticFilterTypes.ts",
     "app/constants/resourceIdentifiers.ts",
     "app/constants/runtimeActionTypes.ts",
@@ -48,6 +50,7 @@ action("brave-extension") {
     "app/content.ts",
     "app/helpers/arrayUtils.ts",
     "app/helpers/urlUtils.ts",
+    "app/helpers/shieldsUtils.ts",
     "app/state/shieldsPanelState.ts",
     "app/types/actions/cosmeticFilterActions.ts",
     "app/types/actions/index.ts",

app/_locales/en_US/messages.json

@@ -3,121 +3,164 @@
     "message": "The Brave Extension",
     "description": "The name of the the extension."
   },
-
-  "shieldsStatsAdsTrackersBlocked": {
-    "message": "Ads and Trackers Blocked",
-    "description": "Website ads and trackering elements such as pixels, images, scripts, etc."
+  "shields": {
+    "message": "Shields",
+    "description": "The Shields feature name"
   },
-  "shieldsStatsHttpsUpgrades": {
-    "message": "HTTPS Upgrades",
-    "description": "Label for shields stats, HTTPS upgrades count"
+  "up": {
+    "message": "up",
+    "description": "Message for when shields is enabled"
   },
-  "shieldsStatsScriptsBlocked": {
-    "message": "Scripts Blocked",
-    "description": "Label for shields stats, Scripts Blocked count"
+  "down": {
+    "message": "down",
+    "description": "Message for when shields is disabled"
   },
-  "shieldsFingerPrintingBlocked": {
-    "message": "Fingerprinting Methods Blocked",
-    "description": "Label for shields stats, Fingerprinting Methods Blocked count"
+  "totalBlocked": {
+    "message": "Total blocked",
+    "description": "Message showing the amount of all blocked resources"
   },
-
-  "shieldsHeaderShieldsToggle": {
-    "message": "Shields",
-    "description": "Label for top shields switch in shields header"
-  },
-  "shieldsHeaderToggleLeftPosition": {
-    "message": "Down",
-    "description": "Label for top shields switch in shields header turned off position"
-  },
-  "shieldsHeaderToggleRightPosition": {
-    "message": "Up",
-    "description": "Label for top shields switch in shields header turned on position"
-  },
-  "shieldsHeaderForSite": {
-    "message": "Site shield settings for",
-    "description": "Label for shields header near current site name"
-  },
-
-  "shieldsControlsAdvancedControls": {
-    "message": "Advanced Controls",
-    "description": "Label for advanced controls group"
-  },
-
-  "shieldsControlsAdControl": {
-    "message": "Ad Control",
-    "description": "Label for Advertisement Control dropdown box options "
-  },
-  "shieldsControlsAdControlOptionBlockAds": {
-    "message": "Block Ads",
-    "description": "Ad Control dropdown box, option block ads"
-  },
-  "shieldsControlsAdControlOptionAllowAdsTracking": {
-    "message": "Allow Ads and Tracking",
-    "description": "Ad Control dropdown box, option allow ads and tracking"
-  },
-
-  "shieldsControlsCookieControl": {
-    "message": "Cookie Control",
-    "description": "Label Cookie Control dropdown options"
-  },
-  "shieldsControlsCookieOptionBlock3p": {
-    "message": "Block 3rd Party Cookies",
-    "description": "Cookie control dropdown option Block 3rd Party Cookies"
-  },
-  "shieldsControlsCookieOptionAllowAll": {
-    "message": "Allow All Cookies",
-    "description": "Cookie control dropdown option Allow All Cookies"
-  },
-  "shieldsControlsCookieOptionBlockAll": {
-    "message": "Block All Cookies",
-    "description": "Cookie control dropdown option Block All Cookies"
-  },
-
-  "shieldsControlsFingerprintingProtection": {
-    "message": "Fingerprinting Protection",
-    "description": "Label Fingerprinting Protection dropdown options"
-  },
-  "shieldsControlsFingerprintingOptionBlock3p": {
-    "message": "Block 3rd Party Fingerprinting",
-    "description": "Fingerprinting control dropdown option Block 3rd Party Fingerprinting"
-  },
-  "shieldsControlsFingerprintingOptionAllowAll": {
-    "message": "Allow All Fingerprinting",
-    "description": "Fingerprinting control dropdown option Allow All Fingerprinting"
-  },
-  "shieldsControlsFingerprintingOptionBlockAll": {
-    "message": "Block All Fingerprinting",
-    "description": "Fingerprinting control dropdown option Block All Fingerprinting"
-  },
-
-  "shieldsControlsHttpsEverywhereSwitch": {
-    "message": "HTTPS Everywhere",
-    "description": "Shields controls, switch for HTTPS Everywhere"
-  },
-  "shieldsControlsBlockScriptsSwitch": {
-    "message": "Block Scripts",
-    "description": "Shields controls, switch for Block Scripts"
-  },
-  "shieldsControlsBlockPhishingMalwareSwitch": {
-    "message": "Block Phishing/Malware",
-    "description": "Shields controls, switch for Block Phishing/Malware"
-  },
-
-  "noScriptSwitches": {
-    "message": "Toggle switches to disable script blocking",
-    "description": "Instructions for per-origin noScript switches"
-  },
-  "noScriptApplyOnce": {
+  "forThisSite": {
+    "message": "for this site",
+    "description": "Partial string for the phrase `shields is up *for this site*`"
+  },
+  "enabledMessage": {
+    "message": "If a site appears broken, try shields down",
+    "description": "Message telling the user to disable shields if a site appears broken"
+  },
+  "disabledMessage": {
+    "message": "You’re browsing this site without any privacy and security protections.",
+    "description": "Message telling the user that shields are disabled"
+  },
+  "blockAds": {
+    "message": "Ads and trackers blocked",
+    "description": "Message indicating the number of ads and trackers blocked"
+  },
+  "blockPopups": {
+    "message": "Pop-ups blocked",
+    "description": "Message indicating the number of pop-ups blocked"
+  },
+  "blockImages": {
+    "message": "Images blocked",
+    "description": "Message indicating the number of images blocked"
+  },
+  "block3partyCookies": {
+    "message": "3rd-party cookies blocked",
+    "description": "Message for the select option about cookies blocked, blocking 3rd party cookies"
+  },
+  "allowAllCookies": {
+    "message": "All cookies allowed",
+    "description": "Message for the select option about cookies blocked, allowing all cookies"
+  },
+  "blockAllCookies": {
+    "message": "Cookies blocked",
+    "description": "Message for the select option about cookies blocked, blocking all cookies"
+  },
+  "blockSomeScripts": {
+    "message": "Some scripts blocked",
+    "description": "Message for the select option about scripts blocked, blocking 3rd party scripts"
+  },
+  "allowAllScripts": {
+    "message": "All scripts allowed",
+    "description": "Message for the select option about scripts blocked, allowing all scripts"
+  },
+  "blockAllScriptsOrigins": {
+    "message": "Scripts blocked",
+    "description": "Message for the select option about scripts blocked, blocking all scripts"
+  },
+  "block3partyFingerprinting": {
+    "message": "3rd-party device recognition blocked",
+    "description": "Message for the select option about fingerprinting blocked, blocking 3rd party fingerprinting"
+  },
+  "allowAllFingerprinting": {
+    "message": "All device recognition allowed",
+    "description": "Message for the select option about fingerprinting blocked, allowing all fingerprinting"
+  },
+  "blockAllFingerprinting": {
+    "message": "Device recognition blocked",
+    "description": "Message for the select option about fingerprinting blocked, blocking all fingerprinting"
+  },
+  "blockPishing": {
+    "message": "Phishing/malware attempts blocked",
+    "description": "Message indicating the number of phishing/malware blocked"
+  },
+  "connectionsEncrypted": {
+    "message": "Connections encrypted",
+    "description": "Message indicating the number of connections encrypted"
+  },
+  "editDefaults": {
+    "message": "Global shield defaults",
+    "description": "Message linking shields to the global shield settings"
+  },
+  "cookiesOnThisSite": {
+    "message": "Cookies on this site",
+    "description": "Message for the cookie resources blocked panel"
+  },
+  "deviceRecognitionAttempts": {
+    "message": "Device recognition attempts",
+    "description": "Message for the device recognition attempts blocked panel"
+  },
+  "scriptsOnThisSite": {
+    "message": "Scripts on this site",
+    "description": "Message for the script resources blocked panel"
+  },
+  "blockedScripts": {
+    "message": "Blocked scripts",
+    "description": "Message for the script resources blocked"
+  },
+  "allowedScripts": {
+    "message": "Allowed scripts",
+    "description": "Message for the script resources allowed"
+  },
+  "allowAll": {
+    "message": "Allow all",
+    "description": "Message for the resources blocked *allow all* option"
+  },
+  "allow": {
+    "message": "Allow",
+    "description": "Message for the resources blocked *allow* option"
+  },
+  "allowed": {
+    "message": "Allowed",
+    "description": "Message for the resources blocked *allowed* option"
+  },
+  "blockAll": {
+    "message": "Block all",
+    "description": "Message for the resources blocked *block all* option"
+  },
+  "block": {
+    "message": "Block",
+    "description": "Message for the resources blocked *block* option"
+  },
+  "blocked": {
+    "message": "Blocked",
+    "description": "Message for the resources blocked *blocked* option"
+  },
+  "apply": {
     "message": "Apply",
-    "description": "Label for applying per-origin noScript settings"
+    "description": "Message for the button inside dynamic list of resources blocked"
+  },
+  "applyOnce": {
+    "message": "Apply once",
+    "description": "Message for the dropdown option inside dynamic list of resources blocked to *apply once*"
+  },
+  "applyUntilRestart": {
+    "message": "Apply until restart",
+    "description": "Message for the dropdown option inside dynamic list of resources blocked to *apply until restart*"
+  },
+  "alwaysApply": {
+    "message": "Always apply",
+    "description": "Message for the dropdown option inside dynamic list of resources blocked to *always apply*"
+  },
+  "undo": {
+    "message": "Undo",
+    "description": "Message for the resources blocked *undo* option"
   },
-
-  "shieldsFooterEditDefault":{
-    "message": "Edit default shield settings...",
-    "description": "Shields controls footer, link to edit default shields settings"
+  "cancel": {
+    "message": "Cancel",
+    "description": "Message for the button inside the static list of resources blocked to cancel the operation"
   },
-  "shieldsFooterReload":{
-    "message": "Reload...",
-    "description": "Shields controls footer, label for action reload page to apply current shields settings"
+  "goBack": {
+    "message": "Go back",
+    "description": "Message for the button inside the static list of resources blocked to go back from the current screen"
   }
 }

app/actions/shieldsPanelActions.ts

@@ -40,15 +40,17 @@ export const controlsToggled: actions.ControlsToggled = (setting = true) => {
   }
 }
 
-export const httpsEverywhereToggled: actions.HttpsEverywhereToggled = () => {
+export const httpsEverywhereToggled: actions.HttpsEverywhereToggled = (setting) => {
   return {
-    type: types.HTTPS_EVERYWHERE_TOGGLED
+    type: types.HTTPS_EVERYWHERE_TOGGLED,
+    setting
   }
 }
 
-export const javascriptToggled: actions.JavascriptToggled = () => {
+export const blockJavaScript: actions.BlockJavaScript = (setting) => {
   return {
-    type: types.JAVASCRIPT_TOGGLED
+    type: types.JAVASCRIPT_TOGGLED,
+    setting
   }
 }
 
@@ -79,3 +81,11 @@ export const changeNoScriptSettings: actions.ChangeNoScriptSettings = (origin) =
     origin
   }
 }
+
+export const changeAllNoScriptSettings: actions.ChangeAllNoScriptSettings = (origin, shouldBlock) => {
+  return {
+    type: types.CHANGE_ALL_NO_SCRIPT_SETTINGS,
+    origin,
+    shouldBlock
+  }
+}