Create File explorer in Angular dynamically with springboot backend(SFTP,get folderstructure and pass to angular)

Question

I used this link - https://stackblitz.com/edit/angular-file-explorer

My issue is they hardcoded the Folder structure where the root Folders are created with constant but my Folder structure is dynamic with multiple sub directories which I am SFTPing to a server and getting to download files

So I can't create constants like below - Can somebody please help me how to create a file explorer with dynamic data

The below is the snippet is in app.component.ts which hardcodes the folder structure

ngOnInit() {
    const folderA = this.fileService.add({ name: 'Folder A', isFolder: true, parent: 'root' });
    this.fileService.add({ name: 'Folder B', isFolder: true, parent: 'root' });
    this.fileService.add({ name: 'Folder C', isFolder: true, parent: folderA.id });
    this.fileService.add({ name: 'File A', isFolder: false, parent: 'root' });
    this.fileService.add({ name: 'File B', isFolder: false, parent: 'root' });

    this.updateFileElementQuery();
}

Only couple other links I found helpful are below:

1. https://www.bennadel.com/blog/3601-more-fun-with-recursive-components-tree-state-and-one-way-data-flow-in-angular-7-2-13.htm
2. https://ej2.syncfusion.com/angular/demos/?_ga=2.55163950.443791518.1579042805-240484438.1579042805#/material/file-manager/overview

Thanks in advance