Add an option to allow both viewing and adding duplicates (#693)

* Detect duplicates when checking if can add note

* Display the stacked add buttons

1 files changed, 45 insertions, 10 deletions

diff --git a/ext/js/display/display-anki.js b/ext/js/display/display-anki.js
index 9a6b96c7..b7d118da 100644
--- a/ext/js/display/display-anki.js
+++ b/ext/js/display/display-anki.js
@@ -371,6 +371,36 @@ export class DisplayAnki {
     }
 
     /**
+     * @param {HTMLButtonElement} button
+     */
+    _showDuplicateAddButton(button) {
+        const isKanjiAdd = button.dataset.mode === 'term-kanji';
+
+        const title = button.getAttribute('title');
+        if (title) {
+            button.setAttribute('title', title.replace(/Add (?!duplicate)/, 'Add duplicate '));
+        }
+
+        // eslint-disable-next-line no-underscore-dangle
+        const hotkeyLabel = this._display._hotkeyHelpController.getHotkeyLabel(button);
+
+        if (hotkeyLabel) {
+            if (hotkeyLabel === 'Add expression ({0})') {
+                // eslint-disable-next-line no-underscore-dangle
+                this._display._hotkeyHelpController.setHotkeyLabel(button, 'Add duplicate expression ({0})');
+            } else if (hotkeyLabel === 'Add reading ({0})') {
+                // eslint-disable-next-line no-underscore-dangle
+                this._display._hotkeyHelpController.setHotkeyLabel(button, 'Add duplicate reading ({0})');
+            }
+        }
+
+        const actionIcon = button.querySelector('.action-icon');
+        if (actionIcon instanceof HTMLElement) {
+            actionIcon.dataset.icon = isKanjiAdd ? 'add-duplicate-term-kanji' : 'add-duplicate-term-kana';
+        }
+    }
+
+    /**
      * @param {import('display-anki').DictionaryEntryDetails[]} dictionaryEntryDetails
      */
     _updateAdderButtons(dictionaryEntryDetails) {
@@ -383,6 +413,11 @@ export class DisplayAnki {
                 if (button !== null) {
                     button.disabled = !canAdd;
                     button.hidden = (ankiError !== null);
+
+                    // If entry has noteIds, show the "add duplicate" button.
+                    if (Array.isArray(noteIds) && noteIds.length > 0) {
+                        this._showDuplicateAddButton(button);
+                    }
                 }
 
                 if (Array.isArray(noteIds) && noteIds.length > 0) {
@@ -394,6 +429,7 @@ export class DisplayAnki {
                     this._setupTagsIndicator(i, noteInfos);
                 }
             }
+
             this._updateViewNoteButton(i, allNoteIds !== null ? [...allNoteIds] : [], false);
         }
     }
@@ -506,7 +542,9 @@ export class DisplayAnki {
                             allErrors.push(toError(e));
                         }
                     }
-                    button.disabled = true;
+                    // Now that this dictionary entry has a duplicate in Anki, show the "add duplicate" buttons.
+                    this._showDuplicateAddButton(button);
+
                     this._updateViewNoteButton(dictionaryEntryIndex, [noteId], true);
                 }
             }
@@ -615,7 +653,6 @@ export class DisplayAnki {
      * @returns {Promise<import('display-anki').DictionaryEntryDetails[]>}
      */
     async _getDictionaryEntryDetails(dictionaryEntries) {
-        const forceCanAddValue = (this._checkForDuplicates ? null : true);
         const fetchAdditionalInfo = (this._displayTags !== 'never');
 
         const notePromises = [];
@@ -638,14 +675,13 @@ export class DisplayAnki {
         let infos;
         let ankiError = null;
         try {
-            if (forceCanAddValue !== null) {
-                if (!await this._display.application.api.isAnkiConnected()) {
-                    throw new Error('Anki not connected');
-                }
-                infos = this._getAnkiNoteInfoForceValue(notes, forceCanAddValue);
-            } else {
-                infos = await this._display.application.api.getAnkiNoteInfo(notes, fetchAdditionalInfo);
+            if (!await this._display.application.api.isAnkiConnected()) {
+                throw new Error('Anki not connected');
             }
+
+            infos = this._checkForDuplicates ?
+                await this._display.application.api.getAnkiNoteInfo(notes, fetchAdditionalInfo) :
+                this._getAnkiNoteInfoForceValue(notes, true);
         } catch (e) {
             infos = this._getAnkiNoteInfoForceValue(notes, false);
             ankiError = toError(e);
@@ -711,7 +747,6 @@ export class DisplayAnki {
             modelName,
             fields,
             tags: this._noteTags,
-            checkForDuplicates: this._checkForDuplicates,
             duplicateScope: this._duplicateScope,
             duplicateScopeCheckAllModels: this._duplicateScopeCheckAllModels,
             resultOutputMode: this._resultOutputMode,