diff --git a/app/components/Code/FileTree.vue b/app/components/Code/FileTree.vue index ae34449680..0b5a3f47c7 100644 --- a/app/components/Code/FileTree.vue +++ b/app/components/Code/FileTree.vue @@ -12,6 +12,7 @@ const props = defineProps<{ }>() const depth = computed(() => props.depth ?? 0) +const treeRoot = useTemplateRef('treeRoot') // Check if a node or any of its children is currently selected function isNodeActive(node: PackageFileTree): boolean { @@ -35,12 +36,18 @@ function getFileRoute(nodePath: string): RouteLocationRaw { const { toggleDir, isExpanded, autoExpandAncestors } = useFileTreeState(props.baseUrl) +const scrollIntoView = () => { + const el = treeRoot.value?.querySelector('[aria-current="true"]') + el?.scrollIntoView({ block: 'center', behavior: 'smooth' }) +} + // Auto-expand directories in the current path watch( () => props.currentPath, path => { if (path) { autoExpandAncestors(path) + nextTick(scrollIntoView) } }, { immediate: true }, @@ -48,7 +55,7 @@ watch(