From e79060487bf09eccb5d5e1282e0d9bff7aa3a223 Mon Sep 17 00:00:00 2001
From: "Hikaru Y." <hkrysg@gmail.com>
Date: Fri, 11 Oct 2024 22:21:00 +0900
Subject: [PATCH] Fix broken tag editor in Svelte 5 (#3488)

* Fix temporary disappearance of a tag

https://forums.ankiweb.net/t/anki-24-10-beta/49989/47

* Fix incorrect behavior after tag deletion

* Fix tag addition/selection buttons becoming invisible

Once tags were selected, subsequent deselection or selection did not
mount 'TagAddButton' or 'TagsSelectedButton' components.
---
 ts/lib/tag-editor/TagEditMode.svelte                 |  3 ++-
 ts/lib/tag-editor/WithAutocomplete.svelte            |  5 ++++-
 .../tag-options-button/TagOptionsButton.svelte       | 12 +++++++-----
 3 files changed, 13 insertions(+), 7 deletions(-)

diff --git a/ts/lib/tag-editor/TagEditMode.svelte b/ts/lib/tag-editor/TagEditMode.svelte
index 49159e439..190e926f8 100644
--- a/ts/lib/tag-editor/TagEditMode.svelte
+++ b/ts/lib/tag-editor/TagEditMode.svelte
@@ -43,9 +43,10 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 >
     <TagDeleteBadge
         class={hoverClass}
-        on:click={() => {
+        on:click={(evt) => {
             if (!selectMode) {
                 deleteTag();
+                evt.stopPropagation();
             }
         }}
     />
diff --git a/ts/lib/tag-editor/WithAutocomplete.svelte b/ts/lib/tag-editor/WithAutocomplete.svelte
index 6a26ec4ce..87e69047e 100644
--- a/ts/lib/tag-editor/WithAutocomplete.svelte
+++ b/ts/lib/tag-editor/WithAutocomplete.svelte
@@ -76,6 +76,10 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
      * Choose as accepted suggestion
      */
     async function chooseSelected() {
+        if (!suggestionsItems.length) {
+            return;
+        }
+
         active = true;
         dispatch("choose", { chosen: suggestionsItems[selected ?? -1] });
 
@@ -129,7 +133,6 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
     keepOnKeyup
     show={$show}
     preferredPlacement="top"
-    portalTarget={document.body}
     let:asReference
     on:close={() => show.set(false)}
 >
diff --git a/ts/lib/tag-editor/tag-options-button/TagOptionsButton.svelte b/ts/lib/tag-editor/tag-options-button/TagOptionsButton.svelte
index 44360df74..250ce9c85 100644
--- a/ts/lib/tag-editor/tag-options-button/TagOptionsButton.svelte
+++ b/ts/lib/tag-editor/tag-options-button/TagOptionsButton.svelte
@@ -17,11 +17,13 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
     bind:offsetHeight={badgeHeight}
     on:mousedown|preventDefault
 >
-    {#if tagsSelected}
-        <TagsSelectedButton on:tagselectall on:tagcopy on:tagdelete />
-    {:else}
-        <TagAddButton on:tagappend {keyCombination} />
-    {/if}
+    {#key tagsSelected}
+        {#if tagsSelected}
+            <TagsSelectedButton on:tagselectall on:tagcopy on:tagdelete />
+        {:else}
+            <TagAddButton on:tagappend {keyCombination} />
+        {/if}
+    {/key}
 </div>
 
 <style lang="scss">