refactor(navigation): scrollToFocusedNote takes an options object
Smooth-scroll for the anchor jump when the target note is already
stacked, instant otherwise. While threading the new flag, the four
positional params got hard to read, so collapse them into
{ noteId, notes, hash, smoothHash } and update all call sites.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -142,7 +142,7 @@ watch(mode, async (newMode) => {
|
||||
>
|
||||
<a
|
||||
class="title-stacked-note-link"
|
||||
@click.prevent="scrollToFocusedNote(props.sha)"
|
||||
@click.prevent="scrollToFocusedNote({ noteId: props.sha })"
|
||||
>
|
||||
<div
|
||||
class="title-stacked-note breadcrumbs text-sm"
|
||||
|
||||
@@ -97,7 +97,7 @@ watch(
|
||||
>
|
||||
<a
|
||||
class="title-stacked-note-link"
|
||||
@click.prevent="scrollToFocusedNote(didrkey)"
|
||||
@click.prevent="scrollToFocusedNote({ noteId: didrkey })"
|
||||
>
|
||||
<div
|
||||
class="title-stacked-note breadcrumbs text-sm"
|
||||
|
||||
@@ -50,7 +50,7 @@ export const useATProtoLinks = (
|
||||
: `${params.shortDid}-${params.rkey}`
|
||||
|
||||
if (noteId === toValue(mainNoteId)) {
|
||||
scrollToFocusedNote(null)
|
||||
scrollToFocusedNote()
|
||||
return
|
||||
}
|
||||
|
||||
@@ -67,7 +67,7 @@ export const useATProtoLinks = (
|
||||
const noteId = `${toShortDid(did)}-${rkey}`
|
||||
|
||||
if (noteId === toValue(mainNoteId)) {
|
||||
scrollToFocusedNote(null)
|
||||
scrollToFocusedNote()
|
||||
return
|
||||
}
|
||||
|
||||
|
||||
@@ -23,6 +23,7 @@ export const useRouteQueryStackedNotes = () => {
|
||||
const scrollToHashInNote = (
|
||||
cleanSha: string,
|
||||
hash: string,
|
||||
smooth: boolean,
|
||||
attempts = 30
|
||||
) => {
|
||||
if (attempts <= 0) {
|
||||
@@ -33,20 +34,32 @@ export const useRouteQueryStackedNotes = () => {
|
||||
`.note-${cleanSha} #${CSS.escape(hash)}`
|
||||
)
|
||||
if (heading) {
|
||||
heading.scrollIntoView({ block: "start", inline: "nearest" })
|
||||
heading.scrollIntoView({
|
||||
block: "start",
|
||||
inline: "nearest",
|
||||
behavior: smooth ? "smooth" : "auto"
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
requestAnimationFrame(() => {
|
||||
scrollToHashInNote(cleanSha, hash, attempts - 1)
|
||||
scrollToHashInNote(cleanSha, hash, smooth, attempts - 1)
|
||||
})
|
||||
}
|
||||
|
||||
const scrollToFocusedNote = (
|
||||
noteId: string | null = null,
|
||||
notes: string[] = stackedNotes.value,
|
||||
type ScrollToFocusedNoteOptions = {
|
||||
noteId?: string | null
|
||||
notes?: string[]
|
||||
hash?: string
|
||||
) => {
|
||||
smoothHash?: boolean
|
||||
}
|
||||
|
||||
const scrollToFocusedNote = ({
|
||||
noteId = null,
|
||||
notes = stackedNotes.value,
|
||||
hash,
|
||||
smoothHash = false
|
||||
}: ScrollToFocusedNoteOptions = {}) => {
|
||||
nextTick(() => {
|
||||
const index = noteId ? notes.findIndex((nid) => nid === noteId) : 0
|
||||
|
||||
@@ -72,7 +85,7 @@ export const useRouteQueryStackedNotes = () => {
|
||||
}
|
||||
|
||||
if (hash && noteId) {
|
||||
scrollToHashInNote(noteId.replaceAll(":", "-"), hash)
|
||||
scrollToHashInNote(noteId.replaceAll(":", "-"), hash, smoothHash)
|
||||
}
|
||||
})
|
||||
}
|
||||
@@ -84,7 +97,11 @@ export const useRouteQueryStackedNotes = () => {
|
||||
hash?: string
|
||||
) => {
|
||||
if (stackedNotes.value.includes(sha)) {
|
||||
scrollToFocusedNote(selector ?? sha, stackedNotes.value, hash)
|
||||
scrollToFocusedNote({
|
||||
noteId: selector ?? sha,
|
||||
hash,
|
||||
smoothHash: true
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
@@ -104,7 +121,7 @@ export const useRouteQueryStackedNotes = () => {
|
||||
stackedNotes.value = newStackedNotes
|
||||
}
|
||||
|
||||
scrollToFocusedNote(selector ?? sha, stackedNotes.value, hash)
|
||||
scrollToFocusedNote({ noteId: selector ?? sha, hash })
|
||||
}
|
||||
|
||||
return {
|
||||
|
||||
Reference in New Issue
Block a user