opensource/dify
2
0
Fork 0
mirror of https://github.com/langgenius/dify.git synced 2026-07-21 10:38:32 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: marketplace page header jitter when it in sticky status (#38832)

Browse Source
This commit is contained in:
Joel 2026-07-13 11:19:10 +08:00 committed by GitHub
parent 0e84444809
commit 41683013e3
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 5 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
web/app/components/plugins/marketplace/description/index.tsx
View File

@ -101,6 +101,9 @@ const Description = ({
const header = headerRef.current
if (!container || !header) return
const previousOverflowAnchor = container.style.overflowAnchor
container.style.overflowAnchor = 'none'
let maxHeaderHeight = 0
let lastAppliedOffset = 0
const updateOffset = () => {
@ -111,12 +114,8 @@ const Description = ({
const baseScrollableTop = Math.max(0, currentScrollableTop - lastAppliedOffset)
const shouldCompensate = baseScrollableTop <= maxHeaderHeight
const nextOffset = shouldCompensate ? collapsedHeight : 0
const offsetDelta = nextOffset - lastAppliedOffset
if (nextOffset > 0) {
container.style.setProperty('--marketplace-header-collapse-offset', `${nextOffset}px`)
if (offsetDelta !== 0 && container.scrollTop > 0)
container.scrollTop = Math.max(0, container.scrollTop + offsetDelta)
} else {
container.style.removeProperty('--marketplace-header-collapse-offset')
}
@ -129,16 +128,17 @@ const Description = ({
if (typeof ResizeObserver === 'undefined') {
return () => {
container.style.removeProperty('--marketplace-header-collapse-offset')
container.style.overflowAnchor = previousOverflowAnchor
}
}
const observer = new ResizeObserver(updateOffset)
observer.observe(header)
observer.observe(container)
return () => {
observer.disconnect()
container.style.removeProperty('--marketplace-header-collapse-offset')
container.style.overflowAnchor = previousOverflowAnchor
}
}, [isMarketplacePlatform, scrollContainerId])