Compact tags refactor (#1021)

* Update translator to flag redundant tags instead of remove

* Update how compact tags are shown in the popup

* Pass compactTags option to note builder

* Update options templates

* Add options upgrade

* Add options upgrade test

3 files changed, 8 insertions, 1 deletions

diff --git a/ext/mixed/css/display.css b/ext/mixed/css/display.css
index 4914bfa1..77f6b073 100644
--- a/ext/mixed/css/display.css
+++ b/ext/mixed/css/display.css
@@ -562,6 +562,10 @@ button.action-button {
     display: inline;
 }
 
+:root[data-compact-tags=true] .tag[data-redundant=true] {
+    display: none;
+}
+
 .term-glossary-separator,
 .term-reason-separator {
     display: inline;
diff --git a/ext/mixed/js/display-generator.js b/ext/mixed/js/display-generator.js
index 910d45da..53d68162 100644
--- a/ext/mixed/js/display-generator.js
+++ b/ext/mixed/js/display-generator.js
@@ -349,6 +349,7 @@ class DisplayGenerator {
         node.title = details.notes;
         inner.textContent = details.name;
         node.dataset.category = details.category;
+        if (details.redundant) { node.dataset.redundant = true; }
 
         return node;
     }
diff --git a/ext/mixed/js/display.js b/ext/mixed/js/display.js
index 0d3ee69d..69d94603 100644
--- a/ext/mixed/js/display.js
+++ b/ext/mixed/js/display.js
@@ -726,6 +726,7 @@ class Display extends EventDispatcher {
         data.ankiEnabled = `${options.anki.enable}`;
         data.audioEnabled = `${options.audio.enabled && options.audio.sources.length > 0}`;
         data.compactGlossaries = `${options.general.compactGlossaries}`;
+        data.compactTags = `${options.general.compactTags}`;
         data.enableSearchTags = `${options.scanning.enableSearchTags}`;
         data.showPitchAccentDownstepNotation = `${options.general.showPitchAccentDownstepNotation}`;
         data.showPitchAccentPositionNotation = `${options.general.showPitchAccentPositionNotation}`;
@@ -1421,7 +1422,7 @@ class Display extends EventDispatcher {
 
     async _createNote(definition, mode, context, options, templates, injectMedia) {
         const {
-            general: {resultOutputMode, compactGlossaries},
+            general: {resultOutputMode, compactGlossaries, compactTags},
             anki: {tags, checkForDuplicates, duplicateScope, kanji, terms, screenshot: {format, quality}},
             audio: {sources, customSourceUrl}
         } = options;
@@ -1462,6 +1463,7 @@ class Display extends EventDispatcher {
             duplicateScope,
             resultOutputMode,
             compactGlossaries,
+            compactTags,
             modeOptions
         });
     }