feat(toc): highlight active heading while scrolling#9727
Conversation
There was a problem hiding this comment.
Code Review
This pull request implements auto-scrolling for the Table of Contents and PDF page thumbnails to ensure the active item remains visible. Feedback indicates that the current implementation in PdfPageCell will not work for off-screen items due to the use of a virtualized list, and suggests moving the scroll logic to the parent component. Additionally, it is recommended to change the scroll alignment from center to nearest to prevent unnecessary or disruptive UI jumping when an item is already partially visible.
075de9b to
b23d018
Compare
|
🖥️ App preview is ready! 🔗 Preview URL: https://pr-9727.trilium-app.pages.dev ✅ All checks passed This preview will be updated automatically with new commits. |
|
/gemini review |
There was a problem hiding this comment.
Code Review
This pull request introduces a feature to synchronize the Table of Contents with the currently viewed heading in text notes, adding a configuration toggle and automatic scrolling to the active TOC item. Feedback suggests improving the active heading detection by calculating the trigger position dynamically to handle layout changes, reducing the scroll debounce timer for better responsiveness, and fixing a minor syntax typo in a type declaration.
Co-authored-by: gemini-code-assist[bot] <176961590+gemini-code-assist[bot]@users.noreply.github.com>
|
/gemini review |
There was a problem hiding this comment.
Code Review
This pull request implements an "active heading" synchronization feature for the Table of Contents (TOC), allowing the sidebar to highlight and scroll to the heading currently being viewed. The implementation includes a new configuration modal, updated translations, and logic to support both editable and read-only note types. Additionally, it fixes a bug where TOC IDs could be duplicated and ensures headings from included notes are excluded from the TOC. Review feedback identifies a type mismatch in a React ref, the use of a magic number for scroll offsets, and a missing dependency in a useEffect hook. Suggestions were also provided to use passive event listeners for scroll performance and to adhere to camelCase naming conventions for state setters.
It is disabled by default and can be enabled in the options.