feat(modal): return focus to tag input after accepting a suggestion

Accepting an auto-suggested tag (Suggestions panel or the autocomplete dropdown) left focus on <body>, so the operator had to re-click the tag field to add the next one. Expose TagAutocomplete.focus (the existing mobile-aware focusInput) and call it after accept from both paths; SuggestionsPanel emits 'accepted' for the parent to refocus. Operator-asked 2026-06-08. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
2026-06-08 21:59:08 -04:00
parent a8f624a0f1
commit 4958e8f7d4
3 changed files with 18 additions and 0 deletions
@@ -46,6 +46,9 @@ import SuggestionsCategoryGroup from './SuggestionsCategoryGroup.vue'
 import AliasPickerDialog from './AliasPickerDialog.vue'

 const props = defineProps({ imageId: { type: Number, required: true } })
+// 'accepted' lets the parent return focus to the tag input after a suggestion is
+// applied (operator-asked 2026-06-08).
+const emit = defineEmits(['accepted'])
 const store = useSuggestionsStore()
 const modal = useModalStore()

@@ -72,6 +75,7 @@ async function onAccept(s) {
  try {
    await store.accept(s)
    await modal.reloadTags()
+    emit('accepted')
  } catch (e) {
    toast({ text: `Accept failed: ${e.message}`, type: 'error' })
  }
@@ -85,6 +89,7 @@ async function onAliasConfirm(canonicalTagId) {
    await store.aliasAccept(aliasTarget.value, canonicalTagId)
    aliasDialog.value = false
    await modal.reloadTags()
+    emit('accepted')
  } catch (e) {
    toast({ text: `Alias failed: ${e.message}`, type: 'error' })
  }