refactor(ui): unify confirm-dropdown Enter behavior via useAcceptOnEnter
Operator-flagged (again) on the tag-merge picker: Enter on the dropdown re-opens it instead of accepting the selection. I'd already patched this twice (fandom picker + fandom set dialog) with copy-pasted capture-phase handlers, so DRY it. New composable useAcceptOnEnter(accept): tracks the menu state and, on a capture-phase Enter, lets Vuetify pick when the menu is open but calls accept() (and blocks the re-open) when it's closed. Applied to every confirm-style picker: - TagsView merge-into picker (the reported one) - AliasPickerDialog - PostSeriesMenu add-to-existing - FandomPicker + FandomSetDialog (refactored off their bespoke handlers) One behavior, one place to change it.
This commit is contained in:
@@ -55,11 +55,13 @@
|
||||
</p>
|
||||
<v-autocomplete
|
||||
v-model="mergeTargetId"
|
||||
v-model:menu="mergeMenuOpen"
|
||||
:items="mergeHits" item-title="name" item-value="id"
|
||||
:loading="mergeLoading"
|
||||
density="compact" variant="outlined" hide-details
|
||||
placeholder="Search target tag…" no-filter
|
||||
@update:search="onMergeSearch"
|
||||
@keydown.enter.capture="onMergeEnter"
|
||||
/>
|
||||
</v-card-text>
|
||||
<v-card-actions>
|
||||
@@ -107,6 +109,7 @@ import { useTagDirectoryStore } from '../stores/tagDirectory.js'
|
||||
import { useAdminStore } from '../stores/admin.js'
|
||||
import { useApi } from '../composables/useApi.js'
|
||||
import { useInfiniteScroll } from '../composables/useInfiniteScroll.js'
|
||||
import { useAcceptOnEnter } from '../composables/useAcceptOnEnter.js'
|
||||
import TagCard from '../components/discovery/TagCard.vue'
|
||||
import MergeConfirmDialog from '../components/discovery/MergeConfirmDialog.vue'
|
||||
import DestructiveConfirmModal from '../components/modal/DestructiveConfirmModal.vue'
|
||||
@@ -181,6 +184,10 @@ const api = useApi()
|
||||
|
||||
// Tag merge via dots-menu (separate from inline-rename collision flow above)
|
||||
const mergePickerOpen = ref(false)
|
||||
// Enter on the closed dropdown accepts the target instead of re-opening it.
|
||||
const { menuOpen: mergeMenuOpen, onEnter: onMergeEnter } = useAcceptOnEnter(
|
||||
() => onMergeConfirm()
|
||||
)
|
||||
const mergeSource = ref(null)
|
||||
const mergeTargetId = ref(null)
|
||||
const mergeHits = ref([])
|
||||
|
||||
Reference in New Issue
Block a user