mirror of
https://github.com/overleaf/overleaf.git
synced 2024-11-21 20:47:08 -05:00
Merge pull request #3070 from overleaf/ta-outline-scroll-fixes
Outline Scroll Fixes GitOrigin-RevId: 14bff01ab7678d363884bd8525ad3f7e60acacb4
This commit is contained in:
parent
0538ea2069
commit
4e3a9d4fa8
2 changed files with 14 additions and 8 deletions
|
@ -56,7 +56,6 @@ class OutlineManager {
|
|||
}
|
||||
|
||||
this.updateHighlightedLine(middleVisibleRow + 1)
|
||||
this.broadcastChangeEvent()
|
||||
})
|
||||
|
||||
scope.$watch('editor.showRichText', () => {
|
||||
|
@ -84,7 +83,9 @@ class OutlineManager {
|
|||
if (editorLine < outline.line) break // editorLine is above
|
||||
closestOutlineLine = outline.line
|
||||
}
|
||||
if (closestOutlineLine === this.highlightedLine) return
|
||||
this.highlightedLine = closestOutlineLine
|
||||
this.broadcastChangeEvent()
|
||||
}
|
||||
|
||||
jumpToLine(line) {
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
import React, { useState, useEffect, createRef } from 'react'
|
||||
import React, { useState, useEffect, createRef, useRef } from 'react'
|
||||
import PropTypes from 'prop-types'
|
||||
import classNames from 'classnames'
|
||||
import OutlineList from './OutlineList'
|
||||
|
@ -6,6 +6,7 @@ import OutlineList from './OutlineList'
|
|||
function OutlineItem({ outlineItem, jumpToLine, highlightedLine }) {
|
||||
const [expanded, setExpanded] = useState(true)
|
||||
const titleElementRef = createRef()
|
||||
const isHighlightedRef = useRef(false)
|
||||
|
||||
const mainItemClasses = classNames('outline-item', {
|
||||
'outline-item-no-children': !outlineItem.children
|
||||
|
@ -30,14 +31,18 @@ function OutlineItem({ outlineItem, jumpToLine, highlightedLine }) {
|
|||
|
||||
useEffect(
|
||||
() => {
|
||||
if (highlightedLine !== outlineItem.line) return
|
||||
const wasHighlighted = isHighlightedRef.current
|
||||
const isNowHighlighted = highlightedLine === outlineItem.line
|
||||
|
||||
titleElementRef.current.scrollIntoView({
|
||||
behavior: 'smooth',
|
||||
block: 'center'
|
||||
})
|
||||
isHighlightedRef.current = isNowHighlighted
|
||||
|
||||
if (!wasHighlighted && isNowHighlighted) {
|
||||
titleElementRef.current.scrollIntoView({
|
||||
block: 'center'
|
||||
})
|
||||
}
|
||||
},
|
||||
[highlightedLine, titleElementRef]
|
||||
[highlightedLine, titleElementRef, isHighlightedRef]
|
||||
)
|
||||
|
||||
return (
|
||||
|
|
Loading…
Reference in a new issue