diff --git a/projects/ngx-monaco-tree-test/src/app/app.component.ts b/projects/ngx-monaco-tree-test/src/app/app.component.ts index c2cc77d..2f1e19c 100644 --- a/projects/ngx-monaco-tree-test/src/app/app.component.ts +++ b/projects/ngx-monaco-tree-test/src/app/app.component.ts @@ -5,6 +5,8 @@ import {CommonModule} from "@angular/common"; import {NgxMonacoTreeComponent} from "../../../ngx-monaco-tree/src/lib/ngx-monaco-tree.component"; import {DragAndDropEvent} from "../../../ngx-monaco-tree/src/lib/monaco-tree-file/monaco-tree-file.type"; +const TOO_MANY_FILES_IN_FOLDER = 200; + @Component({ selector: 'app-root', standalone: true, @@ -44,6 +46,10 @@ export class AppComponent { { name: 'environment.ts' }, ], }, + { + name: 'folder-with-too-many-files', + content: Array.from({ length: TOO_MANY_FILES_IN_FOLDER }).map((_, index) => ({ name: `file_${index + 1}.ts`})) + }, { name: 'favicon.ico', }, @@ -76,9 +82,9 @@ export class AppComponent { ]; changeCurrentFile() { - this.currentFile = this.currentFile === 'src/environments/environment.ts' + this.currentFile = this.currentFile === `src/folder-with-too-many-files/file_${TOO_MANY_FILES_IN_FOLDER}.ts` ? 'src/app/app.component.html' - : 'src/environments/environment.ts'; + : `src/folder-with-too-many-files/file_${TOO_MANY_FILES_IN_FOLDER}.ts`; } handleContextMenu(action: ContextMenuAction) { diff --git a/projects/ngx-monaco-tree/src/lib/monaco-tree-file/monaco-tree-file.component.ts b/projects/ngx-monaco-tree/src/lib/monaco-tree-file/monaco-tree-file.component.ts index a3b1d33..109463a 100644 --- a/projects/ngx-monaco-tree/src/lib/monaco-tree-file/monaco-tree-file.component.ts +++ b/projects/ngx-monaco-tree/src/lib/monaco-tree-file/monaco-tree-file.component.ts @@ -12,7 +12,6 @@ import {MonacoTreeContextMenuComponent} from "../monaco-tree-context-menu/monaco import {NgForOf, NgIf, NgStyle} from "@angular/common"; import {DragDropModule, CdkDragDrop, CdkDrag, CdkDropList} from '@angular/cdk/drag-drop'; - function getAbsolutePosition(element: any) { const r = { x: element.offsetLeft, y: element.offsetTop }; if (element.offsetParent) { @@ -56,10 +55,18 @@ export class MonacoTreeFileComponent implements OnChanges { changes['current'] && !!this.current && this.current.startsWith(this.path) - && !this.open - && this.current !== this.path ) { - this.toggle(false); + if (!this.open && this.current !== this.path) { + this.toggle(false); + } + if (this.current === this.path) { + // Needed as `scrollIntoViewIfNeeded` is not supported on Firefox + if (this.eRef.nativeElement.scrollIntoViewIfNeeded) { + this.eRef.nativeElement.scrollIntoViewIfNeeded(); + } else { + this.eRef.nativeElement.scrollIntoView(); + } + } } }