fix(ui): tag-rail no longer scroll-jumps on accept/reject; keep suggestions clear of the toast
CI / lint (push) Successful in 2s
CI / frontend-build (push) Successful in 17s
CI / backend-lint-and-test (push) Successful in 26s
CI / integration (push) Successful in 3m39s

- TagAutocomplete: focus the inner input with preventScroll so handing focus
  back after an accept/reject stops yanking the rail up to the field (which sits
  above the suggestions list — you had to scroll back down every time). Applies
  to both the image modal and the Explore rail.
- ExploreView: pad the right rail's scroll bottom (88px) so the bottom-right
  snackbar floats over empty space instead of covering the last suggestions and
  their accept/reject controls.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01CDgx8bQS5YrGRK76v8HUnM
This commit is contained in:
2026-07-06 15:25:04 -04:00
parent 7939dba9ed
commit 48be921b8d
2 changed files with 15 additions and 2 deletions
@@ -127,7 +127,16 @@ const suggestions = useSuggestionsStore()
const inputRef = ref(null)
function focusInput () {
if (window.matchMedia?.('(max-width: 900px)')?.matches) return
nextTick(() => inputRef.value?.focus?.())
// Focus the inner <input> with preventScroll: handing focus back after an
// accept/reject must NOT yank the rail's scroll up to this field, which sits
// above the suggestions list (operator-flagged 2026-07-06 — "I have to scroll
// back down every time I apply/reject"). Vuetify's own .focus() forwards no
// options, so reach the element directly; fall back to it if it's not there.
nextTick(() => {
const el = inputRef.value?.$el?.querySelector?.('input')
if (el) el.focus({ preventScroll: true })
else inputRef.value?.focus?.()
})
}
onMounted(focusInput)
// Exposed so the parent (TagPanel) can hand focus back to this field after an
+5 -1
View File
@@ -350,10 +350,14 @@ onUnmounted(() => {
}
.fc-ex__artist { padding: 10px 16px 0; font-weight: 600; }
/* Right rail = the modal's tag panel, hosted on the anchor. */
/* Right rail = the modal's tag panel, hosted on the anchor. The bottom padding
keeps the scrollable content from reaching the viewport floor, so the
bottom-right snackbar floats over empty space instead of covering the last
suggestions / their accept-reject controls (operator-flagged 2026-07-06). */
.fc-ex__rail {
background: rgb(var(--v-theme-surface));
overflow-y: auto;
padding-bottom: 88px;
}
.fc-ex__spinner {