feat: add i18n support for the matching rules section

iorate · Aug 10, 2024 · 92d6f3e · 92d6f3e
1 parent 6556524
commit 92d6f3e
Show file tree

Hide file tree

Showing 5 changed files with 32 additions and 7 deletions.
diff --git a/src/_locales/en/messages.json.ts b/src/_locales/en/messages.json.ts
@@ -28,6 +28,9 @@ export default exportAsMessages({
   // The text of an OK button.
   okButton: "OK",
 
+  // The text that represents the user's own personal blocklist.
+  personalBlocklist: "Personal Blocklist",
+
   // The text that means one site has been blocked.
   content_singleSiteBlocked: "uBlacklist has blocked 1 site",
 
@@ -89,6 +92,18 @@ export default exportAsMessages({
   // The text of the button to activate this extension.
   popup_activateButton: "Activate",
 
+  // The title of the disclosure widget that contains the matching rules information.
+  popup_matchingRules: "Matching Rules",
+
+  // The label for the textarea that shows rules blocking the entry.
+  popup_blockingRulesLabel: "Rules blocking this entry",
+
+  // The label for the textarea that shows rules unblocking the entry.
+  popup_unblockingRulesLabel: "Rules unblocking this entry",
+
+  // The label for the textarea that shows rules highlighting the entry.
+  popup_highlightingRulesLabel: "Rules highlighting this entry",
+
   // The title of the general section.
   options_generalTitle: "General",
 

diff --git a/src/common/locales.ts b/src/common/locales.ts
@@ -7,6 +7,7 @@ export type MessageName =
   | "unauthorizedError"
   | "cancelButton"
   | "okButton"
+  | "personalBlocklist"
   | "content_singleSiteBlocked"
   | "content_multipleSitesBlocked"
   | "content_showBlockedSitesLink"
@@ -27,6 +28,10 @@ export type MessageName =
   | "popup_active"
   | "popup_inactive"
   | "popup_activateButton"
+  | "popup_matchingRules"
+  | "popup_blockingRulesLabel"
+  | "popup_unblockingRulesLabel"
+  | "popup_highlightingRulesLabel"
   | "options_generalTitle"
   | "options_blacklistLabel"
   | "options_blacklistHelper"

diff --git a/src/scripts/block-dialog.tsx b/src/scripts/block-dialog.tsx
@@ -290,14 +290,14 @@ const BlockDialogContent: React.FC<BlockDialogContentProps> = ({
               }}
             >
               <DetailsSummary className={FOCUS_START_CLASS}>
-                Matching Rules
+                {translate("popup_matchingRules")}
               </DetailsSummary>
               <DetailsBody>
                 <Row>
                   <RowItem expanded>
                     <LabelWrapper fullWidth>
                       <ControlLabel for="blocking-rules-text">
-                        Rules blocking this entry:
+                        {translate("popup_blockingRulesLabel")}
                       </ControlLabel>
                     </LabelWrapper>
                     {state.matchingRulesOpen && (
@@ -318,7 +318,7 @@ const BlockDialogContent: React.FC<BlockDialogContentProps> = ({
                   <RowItem expanded>
                     <LabelWrapper fullWidth>
                       <ControlLabel for="unblocking-rules-text">
-                        Rules unblocking this entry:
+                        {translate("popup_unblockingRulesLabel")}
                       </ControlLabel>
                     </LabelWrapper>
                     {state.matchingRulesOpen && (
@@ -339,7 +339,7 @@ const BlockDialogContent: React.FC<BlockDialogContentProps> = ({
                   <RowItem expanded>
                     <LabelWrapper fullWidth>
                       <ControlLabel for="highlight-rules-text">
-                        Rules highlighting this entry:
+                        {translate("popup_highlightingRulesLabel")}
                       </ControlLabel>
                     </LabelWrapper>
                     {state.matchingRulesOpen && (

diff --git a/src/scripts/interactive-ruleset.ts b/src/scripts/interactive-ruleset.ts
@@ -286,7 +286,7 @@ export class InteractiveRuleset {
     // Get rules from user's personal blacklist
     // Note: I need to internationalize this string later with translate() !!
     const matches = getMatchesPerRuleset(
-      "personal-blacklist",
+      "personal-blocklist",
       this.userRuleset,
       props,
     );
@@ -345,7 +345,7 @@ function getMatchesPerRuleset(
   // "Block this website" button.
   // This ensures the line numbers are accurate without reloading.
   const rulesetLines =
-    rulesetName === "personal-blacklist" ? [...ruleset] : null;
+    rulesetName === "personal-blocklist" ? [...ruleset] : null;
   const previousMatchIndexes = new Map<string, number>();
 
   for (let { lineNumber, specifier } of rawResults) {

diff --git a/src/scripts/utilities.ts b/src/scripts/utilities.ts
@@ -1,5 +1,6 @@
 import dayjs from "dayjs";
 import type { InteractiveRuleset } from "./interactive-ruleset.ts";
+import { translate } from "./locales.ts";
 import {
   type LinkProps,
   Ruleset,
@@ -180,7 +181,11 @@ export function getMatchingRulesText(
       // Check whether the ruleset contains rules of the current rule type
       if (match[ruleType].length === 0) continue;
       // Add header with ruleset name
-      matchingRulesText[ruleType] += `# ${match.rulesetName}\n`;
+      const headerContent =
+        match.rulesetName === "personal-blocklist"
+          ? translate("personalBlocklist")
+          : match.rulesetName;
+      matchingRulesText[ruleType] += `# ${headerContent}\n`;
       // Add individual rules
       matchingRulesText[ruleType] += match[ruleType]
         .map(({ lineContent, lineNumber }) => {